RESOLVED FIXED 192124
Web Inspector: Styles: selection lost when inspector is blurred 
https://bugs.webkit.org/show_bug.cgi?id=192124
Summary Web Inspector: Styles: selection lost when inspector is blurred
Devin Rousso
Reported 2018-11-28 16:16:12 PST
* STEPS TO REPRODUCE: 1. inspect any page 2. show the Elements tab 3. select multiple CSS properties within the same CSS rule 4. switch WebKit/Safari tabs 5. go back to the original WebKit/Safari tab => selected properties no longer selected
Attachments
Patch (2.55 KB, patch)
2019-01-02 18:00 PST, Nikita Vasilyev 		no flags
DetailsFormatted DiffDiff
[Video] With patch applied (2.86 MB, video/quicktime)
2019-01-02 18:05 PST, Nikita Vasilyev 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1 2018-12-17 21:34:01 PST
<rdar://problem/46800965>
Nikita Vasilyev
Comment 2 2019-01-02 18:00:53 PST
Created attachment 358233 [details] Patch
Nikita Vasilyev
Comment 3 2019-01-02 18:05:50 PST
Created attachment 358235 [details] [Video] With patch applied
Devin Rousso
Comment 4 2019-01-02 21:28:58 PST
Comment on attachment 358233 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=358233&action=review r=me > Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css:137 > + background-color: var(--selected-background-color-unfocused); Aside: is there a reason we didn't make it so that `--background-color-selected` changes it's value when `.window-docked-inactive` or `.window-inactive` is set? We use this in a few places, usually when we want to limit `:focus` to a particular element (not the <body>), but I'd imagine that it would apply just as well when set from these classes too.
Nikita Vasilyev
Comment 5 2019-01-02 22:52:49 PST
Comment on attachment 358233 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=358233&action=review >> Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css:137 >> + background-color: var(--selected-background-color-unfocused); > > Aside: is there a reason we didn't make it so that `--background-color-selected` changes it's value when `.window-docked-inactive` or `.window-inactive` is set? We use this in a few places, usually when we want to limit `:focus` to a particular element (not the <body>), but I'd imagine that it would apply just as well when set from these classes too. I find this easier to follow than: body:matches(.window-docked-inactive, .window-inactive) .spreadsheet-style-declaration-editor { --background-color-selected: var(--selected-background-color-unfocused); } The latter adds an extra level of abstraction which I don't find necessary.
WebKit Commit Bot
Comment 6 2019-01-02 23:18:40 PST
Comment on attachment 358233 [details] Patch Clearing flags on attachment: 358233 Committed r239588: <https://trac.webkit.org/changeset/239588>
WebKit Commit Bot
Comment 7 2019-01-02 23:18:41 PST
All reviewed patches have been landed. Closing bug.
Devin Rousso
Comment 8 2019-01-03 09:22:11 PST
Comment on attachment 358233 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=358233&action=review >>> Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css:137 >>> + background-color: var(--selected-background-color-unfocused); >> >> Aside: is there a reason we didn't make it so that `--background-color-selected` changes it's value when `.window-docked-inactive` or `.window-inactive` is set? We use this in a few places, usually when we want to limit `:focus` to a particular element (not the <body>), but I'd imagine that it would apply just as well when set from these classes too. > > I find this easier to follow than: > > body:matches(.window-docked-inactive, .window-inactive) .spreadsheet-style-declaration-editor { > --background-color-selected: var(--selected-background-color-unfocused); > } > > The latter adds an extra level of abstraction which I don't find necessary. I'd actually meant doing something like this in Variables.css, considering we already have `body.window-inactive` and `body.window-inactive *` rules.
Note You need to log in before you can comment on or make changes to this bug.