Bug 207819

Summary: Web Inspector: Add "outline focused element" debug setting
Product: WebKit Reporter: Nikita Vasilyev <nvasilyev>
Component: Web InspectorAssignee: Nikita Vasilyev <nvasilyev>
Status: RESOLVED FIXED    
Severity: Normal CC: commit-queue, hi, inspector-bugzilla-changes, timothy, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: WebKit Nightly Build   
Hardware: All   
OS: All   
Bug Depends on:    
Bug Blocks: 208217    
Attachments:
Description Flags
Patch
none
[Image] With patch applied none

Nikita Vasilyev
Reported 2020-02-15 17:37:33 PST
When debugging accessibility issues of Web Inspector, it's helpful to know what element is focused. Many elements have "outline: none" and no clear indication what's focused. Add a debug setting to show a bright outline for all focused elements.
Attachments
Patch (4.43 KB, patch)
2020-02-15 17:45 PST, Nikita Vasilyev 		no flags
DetailsFormatted DiffDiff
[Image] With patch applied (261.76 KB, image/png)
2020-02-15 17:49 PST, Nikita Vasilyev 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1 2020-02-15 17:37:45 PST
<rdar://problem/59489993>
Nikita Vasilyev
Comment 2 2020-02-15 17:45:39 PST
Created attachment 390877 [details] Patch
Nikita Vasilyev
Comment 3 2020-02-15 17:49:19 PST
Created attachment 390879 [details] [Image] With patch applied
WebKit Commit Bot
Comment 4 2020-02-17 16:26:56 PST
Comment on attachment 390877 [details] Patch Clearing flags on attachment: 390877 Committed r256788: <https://trac.webkit.org/changeset/256788>
WebKit Commit Bot
Comment 5 2020-02-17 16:26:57 PST
All reviewed patches have been landed. Closing bug.
Devin Rousso
Comment 6 2020-02-25 13:57:06 PST
Comment on attachment 390877 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=390877&action=review > Source/WebInspectorUI/UserInterface/Base/Main.js:568 > + function setFocusDebugOutline() { This should really exist inside 'Source/WebInspectorUI/UserInterface/Debug/Bootstrap.js' so we don't ship it when it's not going to be usable. > Source/WebInspectorUI/UserInterface/Views/Main.css:124 > +body.focus-debug *:focus { This should really exist inside 'Source/WebInspectorUI/UserInterface/Debug/Bootstrap.css' (which we should create) so we don't ship it when it's not going to be usable.
Note You need to log in before you can comment on or make changes to this bug.