Title: [256788] trunk/Source/WebInspectorUI
- Revision
- 256788
- Author
- nvasil...@apple.com
- Date
- 2020-02-17 16:26:51 -0800 (Mon, 17 Feb 2020)
Log Message
Web Inspector: Add "outline focused element" debug setting
https://bugs.webkit.org/show_bug.cgi?id=207819
<rdar://problem/59489993>
Reviewed by Timothy Hatcher.
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 of what's focused.
Add a debug setting to display a bright purple outline for all focused
elements.
* UserInterface/Base/Main.js:
(WI.contentLoaded):
* UserInterface/Base/Setting.js:
* UserInterface/Views/Main.css:
(body.focus-debug *:focus):
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createDebugSettingsView):
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (256787 => 256788)
--- trunk/Source/WebInspectorUI/ChangeLog 2020-02-17 23:45:16 UTC (rev 256787)
+++ trunk/Source/WebInspectorUI/ChangeLog 2020-02-18 00:26:51 UTC (rev 256788)
@@ -1,3 +1,26 @@
+2020-02-17 Nikita Vasilyev <nvasil...@apple.com>
+
+ Web Inspector: Add "outline focused element" debug setting
+ https://bugs.webkit.org/show_bug.cgi?id=207819
+ <rdar://problem/59489993>
+
+ Reviewed by Timothy Hatcher.
+
+ 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 of what's focused.
+
+ Add a debug setting to display a bright purple outline for all focused
+ elements.
+
+ * UserInterface/Base/Main.js:
+ (WI.contentLoaded):
+ * UserInterface/Base/Setting.js:
+ * UserInterface/Views/Main.css:
+ (body.focus-debug *:focus):
+ * UserInterface/Views/SettingsTabContentView.js:
+ (WI.SettingsTabContentView.prototype._createDebugSettingsView):
+
2020-02-17 Jon Davis <j...@apple.com>
Update resource, type, and instrument icons for light, dark, and override colors
Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Main.js (256787 => 256788)
--- trunk/Source/WebInspectorUI/UserInterface/Base/Main.js 2020-02-17 23:45:16 UTC (rev 256787)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Main.js 2020-02-18 00:26:51 UTC (rev 256788)
@@ -564,6 +564,12 @@
WI.diagnosticController.addRecorder(new WI.TabActivityDiagnosticEventRecorder(WI.diagnosticController));
WI.diagnosticController.addRecorder(new WI.TabNavigationDiagnosticEventRecorder(WI.diagnosticController));
}
+
+ function setFocusDebugOutline() {
+ document.body.classList.toggle("focus-debug", WI.settings.debugOutlineFocusedElement.value);
+ }
+ WI.settings.debugOutlineFocusedElement.addEventListener(WI.Setting.Event.Changed, setFocusDebugOutline);
+ setFocusDebugOutline();
};
WI.performOneTimeFrontendInitializationsUsingTarget = function(target)
Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (256787 => 256788)
--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js 2020-02-17 23:45:16 UTC (rev 256787)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js 2020-02-18 00:26:51 UTC (rev 256788)
@@ -236,6 +236,7 @@
// Debug
debugShowConsoleEvaluations: new WI.DebugSetting("debug-show-console-evaluations", false),
+ debugOutlineFocusedElement: new WI.DebugSetting("debug-outline-focused-element", false),
debugEnableLayoutFlashing: new WI.DebugSetting("debug-enable-layout-flashing", false),
debugEnableStyleEditingDebugMode: new WI.DebugSetting("debug-enable-style-editing-debug-mode", false),
debugEnableUncaughtExceptionReporter: new WI.DebugSetting("debug-enable-uncaught-exception-reporter", true),
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Main.css (256787 => 256788)
--- trunk/Source/WebInspectorUI/UserInterface/Views/Main.css 2020-02-17 23:45:16 UTC (rev 256787)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Main.css 2020-02-18 00:26:51 UTC (rev 256788)
@@ -121,6 +121,11 @@
cursor: default;
}
+body.focus-debug *:focus {
+ outline: 2px solid fuchsia !important;
+ outline-offset: -1px !important;
+}
+
input[type=range] {
-webkit-appearance: none;
}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js (256787 => 256788)
--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js 2020-02-17 23:45:16 UTC (rev 256787)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js 2020-02-18 00:26:51 UTC (rev 256788)
@@ -442,7 +442,9 @@
this._debugSettingsView.addSeparator();
- this._debugSettingsView.addSetting(WI.unlocalizedString("Debugging:"), WI.settings.debugShowConsoleEvaluations, WI.unlocalizedString("Show Console Evaluations"));
+ let debuggingGroup = this._debugSettingsView.addGroup(WI.unlocalizedString("Debugging:"));
+ debuggingGroup.addSetting(WI.settings.debugShowConsoleEvaluations, WI.unlocalizedString("Show Console Evaluations"));
+ debuggingGroup.addSetting(WI.settings.debugOutlineFocusedElement, WI.unlocalizedString("Outline focused element"));
this._debugSettingsView.addSeparator();
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes
