[webkit-changes] [292746] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [292746] trunk/Source/WebInspectorUI








Revision 292746
Author nvasil...@apple.com
Date 2022-04-11 17:23:05 -0700 (Mon, 11 Apr 2022)


Log Message
Web Inspector: REGRESSION(r290770): Styles: creating a new property scrolls the input to the top of the panel
https://bugs.webkit.org/show_bug.cgi?id=237747


Reviewed by Patrick Angle.

Remove unnecessary scrollIntoViewIfNeeded call. I added the scrollIntoViewIfNeeded call in 2017 (r222959) because,
at the time, focusing on an input field didn't scroll it into the viewport. It was possible to tab into an element
outside of the viewport and  WebKit wouldn't scroll it make it visible. This is no longer the case.

* UserInterface/Views/SpreadsheetSelectorField.js:
(WI.SpreadsheetSelectorField.prototype.startEditing):
Call `focus()` to scroll to the edited element.

* UserInterface/Views/SpreadsheetTextField.js:
(WI.SpreadsheetTextField.prototype.startEditing):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetSelectorField.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (292745 => 292746)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-04-12 00:19:08 UTC (rev 292745)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-04-12 00:23:05 UTC (rev 292746)
@@ -1,3 +1,22 @@
+2022-04-11  Nikita Vasilyev  
+
+Web Inspector: REGRESSION(r290770): Styles: creating a new property scrolls the input to the top of the panel
+https://bugs.webkit.org/show_bug.cgi?id=237747
+
+
+Reviewed by Patrick Angle.
+
+Remove unnecessary scrollIntoViewIfNeeded call. I added the scrollIntoViewIfNeeded call in 2017 (r222959) because,
+at the time, focusing on an input field didn't scroll it into the viewport. It was possible to tab into an element
+outside of the viewport and  WebKit wouldn't scroll it make it visible. This is no longer the case.
+
+* UserInterface/Views/SpreadsheetSelectorField.js:
+(WI.SpreadsheetSelectorField.prototype.startEditing):
+Call `focus()` to scroll to the edited element.
+
+* UserInterface/Views/SpreadsheetTextField.js:
+(WI.SpreadsheetTextField.prototype.startEditing):
+
 2022-04-08  Elliott Williams  
 
 [Xcode] Avoid targeting 32-bit iOS and Mac architectures


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetSelectorField.js (292745 => 292746)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetSelectorField.js	2022-04-12 00:19:08 UTC (rev 292745)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetSelectorField.js	2022-04-12 00:23:05 UTC (rev 292746)
@@ -59,7 +59,7 @@
 element.classList.add("editing");
 element.contentEditable = "plaintext-only";
 element.spellcheck = false;
-element.scrollIntoViewIfNeeded(false);
+element.focus();
 
 // Disable syntax highlighting.
 element.textContent = element.textContent;


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js (292745 => 292746)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js	2022-04-12 00:19:08 UTC (rev 292745)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetTextField.js	2022-04-12 00:23:05 UTC (rev 292746)
@@ -123,7 +123,6 @@
 this._element.classList.add("editing");
 this._element.contentEditable = "plaintext-only";
 this._element.spellcheck = false;
-this._element.scrollIntoViewIfNeeded(false);
 
 this._element.focus();
 this._selectText();






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [291628] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [291628] trunk/Source/WebInspectorUI








Revision 291628
Author nvasil...@apple.com
Date 2022-03-22 10:35:06 -0700 (Tue, 22 Mar 2022)


Log Message
Web Inspector: Inline swatch popovers should hide when inline swatches are removed
https://bugs.webkit.org/show_bug.cgi?id=235047


Reviewed by Patrick Angle.

* UserInterface/Views/InlineSwatch.js:
(WI.InlineSwatch):
(WI.InlineSwatch.prototype.dismissPopover):
(WI.InlineSwatch.prototype._presentPopover):

* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype.detached):
(WI.SpreadsheetStyleProperty.prototype.spreadsheetTextFieldDidCommit):
(WI.SpreadsheetStyleProperty.prototype._renderValue):
(WI.SpreadsheetStyleProperty.prototype._createInlineSwatch):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (291627 => 291628)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-03-22 17:30:16 UTC (rev 291627)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-03-22 17:35:06 UTC (rev 291628)
@@ -1,3 +1,22 @@
+2022-03-22  Nikita Vasilyev  
+
+Web Inspector: Inline swatch popovers should hide when inline swatches are removed
+https://bugs.webkit.org/show_bug.cgi?id=235047
+
+
+Reviewed by Patrick Angle.
+
+* UserInterface/Views/InlineSwatch.js:
+(WI.InlineSwatch):
+(WI.InlineSwatch.prototype.dismissPopover):
+(WI.InlineSwatch.prototype._presentPopover):
+
+* UserInterface/Views/SpreadsheetStyleProperty.js:
+(WI.SpreadsheetStyleProperty.prototype.detached):
+(WI.SpreadsheetStyleProperty.prototype.spreadsheetTextFieldDidCommit):
+(WI.SpreadsheetStyleProperty.prototype._renderValue):
+(WI.SpreadsheetStyleProperty.prototype._createInlineSwatch):
+
 2022-03-17  Nikita Vasilyev  
 
 Web Inspector: REGRESSION(r287753): Settings: checkboxes are smaller and no longer vertically align with related text


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js (291627 => 291628)

--- trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js	2022-03-22 17:30:16 UTC (rev 291627)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js	2022-03-22 17:35:06 UTC (rev 291628)
@@ -105,6 +105,7 @@
 this._value = value || this._fallbackValue();
 this._valueEditor = null;
 this._readOnly = readOnly;
+this._popover = null;
 
 this._updateSwatch();
 }
@@ -135,6 +136,11 @@
 this._updateSwatch(true);
 }
 
+dismissPopover()
+{
+this._popover?.dismiss();
+}
+
 // Popover delegate
 
 didDismissPopover(popover)
@@ -254,10 +260,10 @@
 if (!value)
 value = this._fallbackValue();
 
-let popover = new WI.Popover(this);
+this._popover = new WI.Popover(this);
 
-popover.windowResizeHandler = () => {
-this._presentPopover(popover);
+this._popover.windowResizeHandler = () => {
+this._presentPopover();
 };
 
 this._valueEditor = null;
@@ -282,7 +288,7 @@
 this._valueEditor.addEventListener(WI.GradientEditor.Event.GradientChanged, this._valueEditorValueDidChange, this);
 this._valueEditor.addEventListener(WI.GradientEditor.Event.ColorPickerToggled, function(event) {
 this.update();
-}, popover);
+}, this._popover);
 break;
 
 case WI.InlineSwatch.Type.Image:
@@ -319,7 +325,7 @@
 readOnly: true,
 });
 this._valueEditor.codeMirror.on("update", () => {
-popover.update();
+this._popover.update();
 });
 break;
 }
@@ -327,8 +333,8 @@
 if (!this._valueEditor)
 return;
 
-popover.content = this._valueEditor.element;
-this._presentPopover(popover);
+this._popover.content = this._valueEditor.element;
+this._presentPopover(this._popover);
 
 this.dispatchEventToListeners(WI.InlineSwatch.Event.Activated);
 
@@ -408,10 +414,10 @@
 this._updateSwatch();
 }
 
-_presentPopover(popover)
+_presentPopover()
 {
 let bounds = WI.Rect.rectFromClientRect(this._swatchElement.getBoundingClientRect());
-popover.present(bounds.pad(2), [WI.RectEdge.MAX_Y, WI.RectEdge.MIN_Y, WI.RectEdge.MIN_X]);
+this._popover.present(bounds.pad(2), [WI.RectEdge.MAX_Y, WI.RectEdge.MIN_Y, WI.RectEdge.MIN_X]);
 }
 
 _handleContextMenuEvent(event)


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js (291627 => 291628)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js	2022-03-22 17:30:16 UTC (rev 291627)
+++ 

[webkit-changes] [291466] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [291466] trunk/Source/WebInspectorUI








Revision 291466
Author nvasil...@apple.com
Date 2022-03-17 21:23:25 -0700 (Thu, 17 Mar 2022)


Log Message
Web Inspector: REGRESSION(r287753): Settings: checkboxes are smaller and no longer vertically align with related text
https://bugs.webkit.org/show_bug.cgi?id=237745


Reviewed by Devin Rousso.

After r287753, `font-size` no longer affects the size of the checkboxes.
Use `width` and `height` to make the checkbox the expected size.

* UserInterface/Views/SettingsTabContentView.css:
(.content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor input[type="checkbox"]):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (291465 => 291466)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-03-18 03:17:19 UTC (rev 291465)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-03-18 04:23:25 UTC (rev 291466)
@@ -1,3 +1,17 @@
+2022-03-17  Nikita Vasilyev  
+
+Web Inspector: REGRESSION(r287753): Settings: checkboxes are smaller and no longer vertically align with related text
+https://bugs.webkit.org/show_bug.cgi?id=237745
+
+
+Reviewed by Devin Rousso.
+
+After r287753, `font-size` no longer affects the size of the checkboxes.
+Use `width` and `height` to make the checkbox the expected size.
+
+* UserInterface/Views/SettingsTabContentView.css:
+(.content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor input[type="checkbox"]):
+
 2022-03-12  Tim Horton  
 
 Adopt FALLBACK_PLATFORM_NAME in place of FALLBACK_PLATFORM


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css (291465 => 291466)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css	2022-03-18 03:17:19 UTC (rev 291465)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css	2022-03-18 04:23:25 UTC (rev 291466)
@@ -105,8 +105,9 @@
 }
 
 .content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor input[type="checkbox"] {
-/* Vertically align  with the group title text. */
-font-size: 16px;
+width: 15px;
+height: 15px;
+vertical-align: -1px;
 }
 
 .content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor select {






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [290065] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [290065] trunk/Source/WebInspectorUI








Revision 290065
Author nvasil...@apple.com
Date 2022-02-17 13:19:01 -0800 (Thu, 17 Feb 2022)


Log Message
Web Inspector: [Flexbox] Enable Flexbox Inspector feature
https://bugs.webkit.org/show_bug.cgi?id=235820


Reviewed by Patrick Angle.

Remove the engineering setting and enable the feature by default.

* UserInterface/Base/Setting.js:
* UserInterface/Views/DOMTreeElement.js:
(WI.DOMTreeElement.prototype._updateLayoutBadge):
* UserInterface/Views/LayoutDetailsSidebarPanel.js:
(WI.LayoutDetailsSidebarPanel.prototype.initialLayout):
(WI.LayoutDetailsSidebarPanel.prototype.layout):
(WI.LayoutDetailsSidebarPanel.prototype._refreshNodeSets):
(WI.LayoutDetailsSidebarPanel):
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createEngineeringSettingsView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js
trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (290064 => 290065)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-02-17 21:13:57 UTC (rev 290064)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-02-17 21:19:01 UTC (rev 290065)
@@ -1,3 +1,24 @@
+2022-02-17  Nikita Vasilyev  
+
+Web Inspector: [Flexbox] Enable Flexbox Inspector feature
+https://bugs.webkit.org/show_bug.cgi?id=235820
+
+
+Reviewed by Patrick Angle.
+
+Remove the engineering setting and enable the feature by default.
+
+* UserInterface/Base/Setting.js:
+* UserInterface/Views/DOMTreeElement.js:
+(WI.DOMTreeElement.prototype._updateLayoutBadge):
+* UserInterface/Views/LayoutDetailsSidebarPanel.js:
+(WI.LayoutDetailsSidebarPanel.prototype.initialLayout):
+(WI.LayoutDetailsSidebarPanel.prototype.layout):
+(WI.LayoutDetailsSidebarPanel.prototype._refreshNodeSets):
+(WI.LayoutDetailsSidebarPanel):
+* UserInterface/Views/SettingsTabContentView.js:
+(WI.SettingsTabContentView.prototype._createEngineeringSettingsView):
+
 2022-02-14  Razvan Caliman  
 
 Web Inspector: [Flexbox] List flex containers in Layout sidebar


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (290064 => 290065)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2022-02-17 21:13:57 UTC (rev 290064)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2022-02-17 21:19:01 UTC (rev 290065)
@@ -239,7 +239,6 @@
 protocolFilterMultiplexingBackendMessages: new WI.Setting("protocol-filter-multiplexing-backend-messages", true),
 
 // Engineering
-engineeringEnableFlexboxInspector: new WI.EngineeringSetting("engineering-enable-flexbox-inspector", false),
 engineeringShowInternalExecutionContexts: new WI.EngineeringSetting("engineering-show-internal-execution-contexts", false),
 engineeringShowInternalScripts: new WI.EngineeringSetting("engineering-show-internal-scripts", false),
 engineeringPauseForInternalScripts: new WI.EngineeringSetting("engineering-pause-for-internal-scripts", false),


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js (290064 => 290065)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js	2022-02-17 21:13:57 UTC (rev 290064)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js	2022-02-17 21:19:01 UTC (rev 290065)
@@ -2023,9 +2023,6 @@
 if (!this.representedObject.layoutContextType)
 return;
 
-if (this.representedObject.layoutContextType === WI.DOMNode.LayoutContextType.Flex && !WI.settings.engineeringEnableFlexboxInspector.value)
-return;
-
 this._layoutBadgeElement = this.title.appendChild(document.createElement("span"));
 this._layoutBadgeElement.className = "layout-badge";
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js (290064 => 290065)

--- trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js	2022-02-17 21:13:57 UTC (rev 290064)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js	2022-02-17 21:19:01 UTC (rev 290065)
@@ -105,10 +105,6 @@
 
 this._gridSection = new WI.CSSGridNodeOverlayListSection;
 
-// FIXME:  Enable Flexbox Inspector feature
-if (!WI.settings.engineeringEnableFlexboxInspector.value)
-return;
-
 this._flexDetailsSectionRow = new WI.DetailsSectionRow(WI.UIString("No CSS Flex Containers", "No CSS Flex Containers @ Layout Details Sidebar Panel", "Message shown when there are no CSS Flex containers on the inspected page."));
 let flexDetailsSection = new WI.DetailsSection("layout-css-flexbox", WI.UIString("Flexbox", "Flexbox @ 

[webkit-changes] [289610] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [289610] trunk/Source/WebInspectorUI








Revision 289610
Author nvasil...@apple.com
Date 2022-02-11 00:44:23 -0800 (Fri, 11 Feb 2022)


Log Message
Web Inspector: [Flexbox] Show flex badge next to flex containers in DOM Tree
https://bugs.webkit.org/show_bug.cgi?id=235924

Reviewed by Patrick Angle.

Elements with `display: flex` and `display: inline-flex` should include a "flex" badge.
Clicking the badge should toggle the overlay for the corresponding element.

* UserInterface/Controllers/GridOverlayConfigurationDiagnosticEventRecorder.js:
(WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype.setup):
(WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype.teardown):
(WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._handleGridOverlayShown):
* UserInterface/Controllers/GridOverlayDiagnosticEventRecorder.js:
(WI.GridOverlayDiagnosticEventRecorder.prototype.setup):
(WI.GridOverlayDiagnosticEventRecorder.prototype.teardown):
(WI.GridOverlayDiagnosticEventRecorder.prototype._handleGridOverlayShown):
(WI.GridOverlayDiagnosticEventRecorder):
* UserInterface/Controllers/OverlayManager.js:
(WI.OverlayManager):
(WI.OverlayManager.prototype.showOverlay):
(WI.OverlayManager.prototype.hideOverlay):
(WI.OverlayManager.prototype.hasVisibleGridOverlays):
(WI.OverlayManager.prototype.hasVisibleOverlay):
(WI.OverlayManager.prototype.toggleOverlay):
(WI.OverlayManager.prototype.getColorForNode):
(WI.OverlayManager.prototype.setColorForNode):
(WI.OverlayManager.prototype._handleLayoutContextTypeChanged):
(WI.OverlayManager.prototype._handleGridSettingChanged):
(WI.OverlayManager.prototype._handleMainResourceDidChange):
(WI.OverlayManager.prototype.showGridOverlay): Deleted.
(WI.OverlayManager.prototype.hideGridOverlay): Deleted.
(WI.OverlayManager.prototype.isGridOverlayVisible): Deleted.
(WI.OverlayManager.prototype.toggleGridOverlay): Deleted.
(WI.OverlayManager.prototype.getGridColorForNode): Deleted.
(WI.OverlayManager.prototype.setGridColorForNode): Deleted.
Remove grid-specific methods (such as showGridOverlay) and introduce methods that work with
both Grid and Flexbox (such as showOverlay).

* UserInterface/Views/CSSGridSection.js:
(WI.CSSGridSection.prototype.attached):
(WI.CSSGridSection.prototype.detached):
(WI.CSSGridSection.prototype._handleToggleAllCheckboxChanged):
(WI.CSSGridSection.prototype.layout):
(WI.CSSGridSection.prototype._handleGridOverlayStateChanged):
(WI.CSSGridSection.prototype._updateToggleAllCheckbox):
(WI.CSSGridSection):
* UserInterface/Views/DOMTreeElement.css:
(.tree-outline.dom .layout-badge):
(.tree-outline.dom .layout-badge.activated):
(body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .layout-badge):
(@media (prefers-color-scheme: dark) .tree-outline.dom .layout-badge):
(.tree-outline.dom .badge-css-grid): Deleted.
(.tree-outline.dom .badge-css-grid.activated): Deleted.
(body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid): Deleted.
(@media (prefers-color-scheme: dark) .tree-outline.dom .badge-css-grid): Deleted.

* UserInterface/Views/DOMTreeElement.js:
(WI.DOMTreeElement):
(WI.DOMTreeElement.prototype.onattach):
(WI.DOMTreeElement.prototype.ondetach):
(WI.DOMTreeElement.prototype.updateTitle):
(WI.DOMTreeElement.prototype._updateLayoutBadge):
(WI.DOMTreeElement.prototype._layoutBadgeClicked):
(WI.DOMTreeElement.prototype._updateLayoutBadgeStatus):
(WI.DOMTreeElement.prototype._handleLayoutContextTypeChanged):
(WI.DOMTreeElement.prototype._updateGridBadge): Deleted.
(WI.DOMTreeElement.prototype._gridBadgeClicked): Deleted.
(WI.DOMTreeElement.prototype._gridBadgeDoubleClicked): Deleted.
(WI.DOMTreeElement.prototype._updateGridBadgeStatus): Deleted.
Renamed `_gridBadgeElement` to `_layoutBadgeElement`. We can't have both "flex" and "grid" badge on the same element,
so I called it "layoutBadge". I didn't call it simply "badge" because we may have other badges in the future.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Controllers/GridOverlayConfigurationDiagnosticEventRecorder.js
trunk/Source/WebInspectorUI/UserInterface/Controllers/GridOverlayDiagnosticEventRecorder.js
trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js
trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.css
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (289609 => 289610)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-02-11 08:40:49 UTC (rev 289609)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-02-11 08:44:23 UTC (rev 289610)
@@ -1,3 +1,77 @@
+2022-02-11  Nikita Vasilyev  
+
+Web Inspector: [Flexbox] Show flex badge next to flex containers in DOM Tree
+https://bugs.webkit.org/show_bug.cgi?id=235924
+
+Reviewed by Patrick Angle.
+
+ 

[webkit-changes] [289064] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [289064] trunk/Source/WebInspectorUI








Revision 289064
Author nvasil...@apple.com
Date 2022-02-03 11:46:39 -0800 (Thu, 03 Feb 2022)


Log Message
Web Inspector: [Flexbox] Add setting to guard Flexbox Inspector feature
https://bugs.webkit.org/show_bug.cgi?id=236091


Reviewed by Patrick Angle.

* UserInterface/Base/Setting.js:
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createEngineeringSettingsView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (289063 => 289064)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-02-03 19:44:54 UTC (rev 289063)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-02-03 19:46:39 UTC (rev 289064)
@@ -1,3 +1,15 @@
+2022-02-03  Nikita Vasilyev  
+
+Web Inspector: [Flexbox] Add setting to guard Flexbox Inspector feature
+https://bugs.webkit.org/show_bug.cgi?id=236091
+
+
+Reviewed by Patrick Angle.
+
+* UserInterface/Base/Setting.js:
+* UserInterface/Views/SettingsTabContentView.js:
+(WI.SettingsTabContentView.prototype._createEngineeringSettingsView):
+
 2022-02-02  Timothy Hatcher  
 
 Web Inspector: didShowExtensionTab needs to pass the frameID of the tab


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (289063 => 289064)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2022-02-03 19:44:54 UTC (rev 289063)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2022-02-03 19:46:39 UTC (rev 289064)
@@ -239,6 +239,7 @@
 protocolFilterMultiplexingBackendMessages: new WI.Setting("protocol-filter-multiplexing-backend-messages", true),
 
 // Engineering
+engineeringEnableFlexboxInspector: new WI.EngineeringSetting("engineering-enable-flexbox-inspector", false),
 engineeringShowInternalExecutionContexts: new WI.EngineeringSetting("engineering-show-internal-execution-contexts", false),
 engineeringShowInternalScripts: new WI.EngineeringSetting("engineering-show-internal-scripts", false),
 engineeringPauseForInternalScripts: new WI.EngineeringSetting("engineering-pause-for-internal-scripts", false),


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js (289063 => 289064)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2022-02-03 19:44:54 UTC (rev 289063)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2022-02-03 19:46:39 UTC (rev 289064)
@@ -443,6 +443,7 @@
 
 let elementsGroup = engineeringSettingsView.addGroup(WI.unlocalizedString("Elements:"));
 elementsGroup.addSetting(WI.settings.engineeringAllowEditingUserAgentShadowTrees, WI.unlocalizedString("Allow editing UserAgent shadow trees"));
+elementsGroup.addSetting(WI.settings.engineeringEnableFlexboxInspector, WI.unlocalizedString("Enable Flexbox Inspector"));
 
 engineeringSettingsView.addSeparator();
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [288580] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [288580] trunk/Source/WebInspectorUI








Revision 288580
Author nvasil...@apple.com
Date 2022-01-25 13:36:01 -0800 (Tue, 25 Jan 2022)


Log Message
Web Inspector: Collapse blackboxed call frames by default
https://bugs.webkit.org/show_bug.cgi?id=234581


Reviewed by Devin Rousso.

Remove "Collapse blackboxed call frames" checkbox from the experimental settings
and enable the feature by default.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Base/Setting.js:
* UserInterface/Controllers/CallFrameTreeController.js:
(WI.CallFrameTreeController.prototype.groupBlackboxedCallFrames):
* UserInterface/Controllers/DebuggerManager.js:
(WI.DebuggerManager.prototype.shouldAutoExpandBlackboxedCallFrameGroup):
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Controllers/CallFrameTreeController.js
trunk/Source/WebInspectorUI/UserInterface/Controllers/DebuggerManager.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (288579 => 288580)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-01-25 21:25:56 UTC (rev 288579)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-01-25 21:36:01 UTC (rev 288580)
@@ -1,3 +1,23 @@
+2022-01-25  Nikita Vasilyev  
+
+Web Inspector: Collapse blackboxed call frames by default
+https://bugs.webkit.org/show_bug.cgi?id=234581
+
+
+Reviewed by Devin Rousso.
+
+Remove "Collapse blackboxed call frames" checkbox from the experimental settings
+and enable the feature by default.
+
+* Localizations/en.lproj/localizedStrings.js:
+* UserInterface/Base/Setting.js:
+* UserInterface/Controllers/CallFrameTreeController.js:
+(WI.CallFrameTreeController.prototype.groupBlackboxedCallFrames):
+* UserInterface/Controllers/DebuggerManager.js:
+(WI.DebuggerManager.prototype.shouldAutoExpandBlackboxedCallFrameGroup):
+* UserInterface/Views/SettingsTabContentView.js:
+(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
+
 2022-01-25  Devin Rousso  
 
 Web Inspector: replace gear-with-contextmenu icons used for filtering with filter-with-contextmenu icons


Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (288579 => 288580)

--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2022-01-25 21:25:56 UTC (rev 288579)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2022-01-25 21:36:01 UTC (rev 288580)
@@ -344,8 +344,6 @@
 localizedStrings["Closure Variables (%s)"] = "Closure Variables (%s)";
 localizedStrings["Code"] = "Code";
 localizedStrings["Collapse All"] = "Collapse All";
-/* Setting to collapse blackboxed call frames in the debugger. */
-localizedStrings["Collapse blackboxed call frames @ Experimental Settings"] = "Collapse blackboxed call frames";
 localizedStrings["Collapse columns"] = "Collapse columns";
 localizedStrings["Collect garbage"] = "Collect garbage";
 /* Section header for the group of CSS variables with colors as values */
@@ -445,8 +443,6 @@
 localizedStrings["Debugger disabled during Audit"] = "Debugger disabled during Audit";
 localizedStrings["Debugger disabled during Timeline recording"] = "Debugger disabled during Timeline recording";
 localizedStrings["Debugging:"] = "Debugging:";
-/* Category label for experimental settings related to debugging. */
-localizedStrings["Debugging: @ Experimental Settings"] = "Debugging:";
 localizedStrings["Debugs"] = "Debugs";
 localizedStrings["Decoded"] = "Decoded";
 localizedStrings["Default"] = "Default";


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (288579 => 288580)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2022-01-25 21:25:56 UTC (rev 288579)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2022-01-25 21:36:01 UTC (rev 288580)
@@ -229,7 +229,6 @@
 experimentalEnablePreviewFeatures: new WI.Setting("experimental-enable-preview-features", true),
 experimentalEnableStylesJumpToEffective: new WI.Setting("experimental-styles-jump-to-effective", false),
 experimentalEnableStylesJumpToVariableDeclaration: new WI.Setting("experimental-styles-jump-to-variable-declaration", false),
-experimentalCollapseBlackboxedCallFrames: new WI.Setting("experimental-collapse-blackboxed-call-frames", false),
 experimentalAllowInspectingInspector: new WI.Setting("experimental-allow-inspecting-inspector", false),
 experimentalCSSCompletionFuzzyMatching: new WI.Setting("experimental-css-completion-fuzzy-matching", true),
 


Modified: 

[webkit-changes] [288385] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [288385] trunk/Source/WebInspectorUI








Revision 288385
Author nvasil...@apple.com
Date 2022-01-21 15:40:17 -0800 (Fri, 21 Jan 2022)


Log Message
Web Inspector: Make alignment editor accessible
https://bugs.webkit.org/show_bug.cgi?id=235395


Reviewed by Patrick Angle.

Make alignment editor icons focusable, and annotate elements so VoiceOver could correctly read what is selected.

* UserInterface/Views/AlignmentEditor.css:
(.alignment-editor .glyph:focus):
(.alignment-editor .glyph:not(:focus-visible)):
* UserInterface/Views/AlignmentEditor.js:
(WI.AlignmentEditor):
(WI.AlignmentEditor.prototype.set alignment):
(WI.AlignmentEditor.prototype._removePreviouslySelected):
(WI.AlignmentEditor.prototype._updateSelected):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css
trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (288384 => 288385)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-01-21 23:30:39 UTC (rev 288384)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-01-21 23:40:17 UTC (rev 288385)
@@ -1,3 +1,22 @@
+2022-01-21  Nikita Vasilyev  
+
+Web Inspector: Make alignment editor accessible
+https://bugs.webkit.org/show_bug.cgi?id=235395
+
+
+Reviewed by Patrick Angle.
+
+Make alignment editor icons focusable, and annotate elements so VoiceOver could correctly read what is selected.
+
+* UserInterface/Views/AlignmentEditor.css:
+(.alignment-editor .glyph:focus):
+(.alignment-editor .glyph:not(:focus-visible)):
+* UserInterface/Views/AlignmentEditor.js:
+(WI.AlignmentEditor):
+(WI.AlignmentEditor.prototype.set alignment):
+(WI.AlignmentEditor.prototype._removePreviouslySelected):
+(WI.AlignmentEditor.prototype._updateSelected):
+
 2022-01-19  Devin Rousso  
 
 Web Inspector: fully blackboxed stack traces don't show the right top call frame


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css (288384 => 288385)

--- trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css	2022-01-21 23:30:39 UTC (rev 288384)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css	2022-01-21 23:40:17 UTC (rev 288385)
@@ -56,3 +56,7 @@
 .alignment-editor .glyph.rotate-left > svg {
 rotate: -90deg;
 }
+
+.alignment-editor .glyph:focus {
+outline-offset: var(--focus-ring-outline-offset);
+}


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.js (288384 => 288385)

--- trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.js	2022-01-21 23:30:39 UTC (rev 288384)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.js	2022-01-21 23:40:17 UTC (rev 288385)
@@ -34,6 +34,7 @@
 
 this._element = document.createElement("div");
 this._element.className = "alignment-editor";
+this._element.role = "radiogroup";
 }
 
 // Static
@@ -99,6 +100,8 @@
 
 for (let [value, path] of Object.entries(WI.AlignmentEditor._glyphsForType(alignment.type))) {
 let glyphElement = WI.ImageUtilities.useSVGSymbol(path, "glyph", value);
+glyphElement.role = "radio";
+glyphElement.tabIndex = 0;
 this._element.append(glyphElement);
 glyphElement.classList.toggle("rotate-left", shouldRotate);
 glyphElement.addEventListener("click", () => {
@@ -122,6 +125,7 @@
 {
 let previousGlyphElement = this._valueToGlyphElement.get(this._alignment.text);
 previousGlyphElement?.classList.remove("selected");
+previousGlyphElement?.removeAttribute("aria-checked");
 }
 
 _updateSelected()
@@ -128,6 +132,7 @@
 {
 let glyphElement = this._valueToGlyphElement.get(this._alignment.text);
 glyphElement?.classList.add("selected");
+glyphElement?.setAttribute("aria-checked", true);
 }
 };
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [287891] trunk

[nvasilyev]

Title: [287891] trunk








Revision 287891
Author nvasil...@apple.com
Date 2022-01-11 10:53:40 -0800 (Tue, 11 Jan 2022)


Log Message
REGRESSION (r283723): Web Inspector: CSS declarations unexpectedly removed when editing property value
https://bugs.webkit.org/show_bug.cgi?id=233195

Reviewed by Devin Rousso.

Source/WebInspectorUI:

Re-attach CSS property if it was detached while editing.

CSSProperty is detached when focusing on property name and deleting it. Consequent edits of the detached
CSSProperty were not saved. This patch re-attaches detached property at the previous position.

* UserInterface/Models/CSSProperty.js:
(WI.CSSProperty.prototype.set name):
* UserInterface/Models/CSSStyleDeclaration.js:
(WI.CSSStyleDeclaration.prototype.newBlankProperty):
(WI.CSSStyleDeclaration.prototype.insertProperty):
Introduce this method since the logic is used in two different places now.

LayoutTests:

Test removing CSS property name.

* inspector/css/modify-css-property-expected.txt:
* inspector/css/modify-css-property.html:
* inspector/css/resources/modify-css-property.css:
(.rule-e):

Modified Paths

trunk/LayoutTests/ChangeLog
trunk/LayoutTests/inspector/css/modify-css-property-expected.txt
trunk/LayoutTests/inspector/css/modify-css-property.html
trunk/LayoutTests/inspector/css/resources/modify-css-property.css
trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js
trunk/Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js




Diff

Modified: trunk/LayoutTests/ChangeLog (287890 => 287891)

--- trunk/LayoutTests/ChangeLog	2022-01-11 18:46:45 UTC (rev 287890)
+++ trunk/LayoutTests/ChangeLog	2022-01-11 18:53:40 UTC (rev 287891)
@@ -1,3 +1,17 @@
+2022-01-11  Nikita Vasilyev  
+
+REGRESSION (r283723): Web Inspector: CSS declarations unexpectedly removed when editing property value
+https://bugs.webkit.org/show_bug.cgi?id=233195
+
+Reviewed by Devin Rousso.
+
+Test removing CSS property name.
+
+* inspector/css/modify-css-property-expected.txt:
+* inspector/css/modify-css-property.html:
+* inspector/css/resources/modify-css-property.css:
+(.rule-e):
+
 2022-01-11  Rob Buis  
 
 [CSS contain] Update css-contain tests from WPT


Modified: trunk/LayoutTests/inspector/css/modify-css-property-expected.txt (287890 => 287891)

--- trunk/LayoutTests/inspector/css/modify-css-property-expected.txt	2022-01-11 18:46:45 UTC (rev 287890)
+++ trunk/LayoutTests/inspector/css/modify-css-property-expected.txt	2022-01-11 18:53:40 UTC (rev 287891)
@@ -41,3 +41,7 @@
 PASS: Style declaration text should update immediately with commented out property.
 PASS: Uncommented property should be enabled.
 
+-- Running test case: ModifyCSSProperty.ReplacePropertyName
+PASS: Style declaration text should be empty.
+PASS: Style declaration text should have new property name.
+


Modified: trunk/LayoutTests/inspector/css/modify-css-property.html (287890 => 287891)

--- trunk/LayoutTests/inspector/css/modify-css-property.html	2022-01-11 18:46:45 UTC (rev 287890)
+++ trunk/LayoutTests/inspector/css/modify-css-property.html	2022-01-11 18:53:40 UTC (rev 287891)
@@ -316,6 +316,35 @@
 }
 });
 
+suite.addTestCase({
+name: "ModifyCSSProperty.ReplacePropertyName",
+async test() {
+let getMatchedStyleDeclaration = () => {
+for (let rule of nodeStyles.matchedRules) {
+if (rule.selectorText === ".rule-e")
+return rule.style;
+}
+throw "No declaration found.";
+};
+let getProperty = (propertyName) => {
+let styleDeclaration = getMatchedStyleDeclaration();
+for (let property of styleDeclaration.properties) {
+if (property.name === propertyName)
+return property;
+}
+throw "No property found.";
+};
+let styleDeclaration = getMatchedStyleDeclaration();
+
+let cssProperty = getProperty("color");
+cssProperty.name = "";
+InspectorTest.expectEqual(styleDeclaration.text, "", "Style declaration text should be empty.");
+
+cssProperty.name = "border-color";
+InspectorTest.expectEqual(styleDeclaration.text, `\nborder-color: darkseagreen;\n`, "Style declaration text should have new property name.");
+}
+});
+
 WI.domManager.requestDocument((documentNode) => {
 documentNode.querySelector("#x", (contentNodeId) => {
 if (contentNodeId) {
@@ -339,6 +368,6 @@
 
 
 Testing that CSSStyleDeclaration update immediately after modifying its properties when it is not locked.
-
+
 
 


Modified: trunk/LayoutTests/inspector/css/resources/modify-css-property.css (287890 => 287891)

--- trunk/LayoutTests/inspector/css/resources/modify-css-property.css	

[webkit-changes] [287870] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [287870] trunk/Source/WebInspectorUI








Revision 287870
Author nvasil...@apple.com
Date 2022-01-10 23:27:23 -0800 (Mon, 10 Jan 2022)


Log Message
Web Inspector: Increase padding around icons in Alignment editor
https://bugs.webkit.org/show_bug.cgi?id=234036


Reviewed by Devin Rousso.

Increase margin and padding around the icons, making the icons more visually appealing
and easier to distinguish and from each other.

* UserInterface/Images/AlignContentStretch.svg:
The gap between rectangles was only 0.5px. Increase it to 2px.

* UserInterface/Views/AlignmentEditor.css:
(.alignment-editor .glyph):
(.alignment-editor .glyph:not(:first-child)):
(.alignment-editor .glyph.selected):
(.alignment-editor .glyph.selected:active):
(.alignment-editor .glyph:not(:last-child)): Deleted.
(.alignment-editor .glyph.selected + .glyph): Deleted.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentStretch.svg
trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (287869 => 287870)

--- trunk/Source/WebInspectorUI/ChangeLog	2022-01-11 06:34:39 UTC (rev 287869)
+++ trunk/Source/WebInspectorUI/ChangeLog	2022-01-11 07:27:23 UTC (rev 287870)
@@ -1,3 +1,25 @@
+2022-01-10  Nikita Vasilyev  
+
+Web Inspector: Increase padding around icons in Alignment editor
+https://bugs.webkit.org/show_bug.cgi?id=234036
+
+
+Reviewed by Devin Rousso.
+
+Increase margin and padding around the icons, making the icons more visually appealing
+and easier to distinguish and from each other.
+
+* UserInterface/Images/AlignContentStretch.svg:
+The gap between rectangles was only 0.5px. Increase it to 2px.
+
+* UserInterface/Views/AlignmentEditor.css:
+(.alignment-editor .glyph):
+(.alignment-editor .glyph:not(:first-child)):
+(.alignment-editor .glyph.selected):
+(.alignment-editor .glyph.selected:active):
+(.alignment-editor .glyph:not(:last-child)): Deleted.
+(.alignment-editor .glyph.selected + .glyph): Deleted.
+
 2022-01-10  Alex Christensen  
 
 Start using C++20


Modified: trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentStretch.svg (287869 => 287870)

--- trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentStretch.svg	2022-01-11 06:34:39 UTC (rev 287869)
+++ trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentStretch.svg	2022-01-11 07:27:23 UTC (rev 287870)
@@ -1,5 +1,5 @@
 
 
-
-
+
+
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css (287869 => 287870)

--- trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css	2022-01-11 06:34:39 UTC (rev 287869)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css	2022-01-11 07:27:23 UTC (rev 287870)
@@ -27,6 +27,7 @@
 display: inline-block;
 width: 16px;
 height: 16px;
+padding: 2px;
 background-color: var(--background-color-content);
 box-sizing: content-box;
 border: 1px solid var(--border-color);
@@ -33,8 +34,8 @@
 color: var(--glyph-color);
 }
 
-.alignment-editor .glyph:not(:last-child) {
-border-inline-end-width: 0;
+.alignment-editor .glyph:not(:first-child) {
+margin-inline-start: 2px;
 }
 
 .alignment-editor .glyph:active {
@@ -42,17 +43,14 @@
 }
 
 .alignment-editor .glyph.selected {
-color: var(--glyph-color-active);
+background-color: var(--glyph-color-active);
 border-color: var(--glyph-color-active);
+color: var(--selected-foreground-color);
 }
 
-.alignment-editor .glyph.selected + .glyph {
-border-inline-start-color: var(--glyph-color-active);
-}
-
 .alignment-editor .glyph.selected:active {
-color: var(--glyph-color-active-pressed);
-outline-color: var(--glyph-color-active-pressed);
+background-color: var(--glyph-color-active-pressed);
+border-color: var(--glyph-color-active-pressed);
 }
 
 .alignment-editor .glyph.rotate-left > svg {






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [286885] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [286885] trunk/Source/WebInspectorUI








Revision 286885
Author nvasil...@apple.com
Date 2021-12-10 16:40:58 -0800 (Fri, 10 Dec 2021)


Log Message
Web Inspector: Add a swatch for justify-content, justify-items, and justify-self
https://bugs.webkit.org/show_bug.cgi?id=233055


Reviewed by Patrick Angle.

Add an inline swatch for `justify-content`, that shows icons for common values:
start, center, end, space-between, space-around, space-evenly, and stretch.

Also, add inline swatches for `justify-items` and `justify-self`, that shows icons for:
start, center, end, and stretch.

The newly added swatches reuse the existing `align-content` and `align-items` icons, and
rotate them -90 degrees. While `align-*` properties define alignment in the block-direction
the `justify-*` properties define alignment in the inline-direction.

* UserInterface/Models/AlignmentData.js:
(WI.AlignmentData._propertyNameToType):
* UserInterface/Views/AlignmentEditor.css:
(.alignment-editor .glyph.rotate-left > svg):
* UserInterface/Views/AlignmentEditor.js:
(WI.AlignmentEditor.shouldRotateGlyph):
(WI.AlignmentEditor._glyphsForType):
(WI.AlignmentEditor.prototype.set alignment):
* UserInterface/Views/InlineSwatch.css:
(.inline-swatch.alignment > span.rotate-left):
* UserInterface/Views/InlineSwatch.js:
(WI.InlineSwatch.prototype._updateSwatch):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/AlignmentData.js
trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css
trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.js
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.css
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (286884 => 286885)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-12-11 00:38:22 UTC (rev 286884)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-12-11 00:40:58 UTC (rev 286885)
@@ -1,3 +1,34 @@
+2021-12-10  Nikita Vasilyev  
+
+Web Inspector: Add a swatch for justify-content, justify-items, and justify-self
+https://bugs.webkit.org/show_bug.cgi?id=233055
+
+
+Reviewed by Patrick Angle.
+
+Add an inline swatch for `justify-content`, that shows icons for common values:
+start, center, end, space-between, space-around, space-evenly, and stretch.
+
+Also, add inline swatches for `justify-items` and `justify-self`, that shows icons for:
+start, center, end, and stretch.
+
+The newly added swatches reuse the existing `align-content` and `align-items` icons, and
+rotate them -90 degrees. While `align-*` properties define alignment in the block-direction
+the `justify-*` properties define alignment in the inline-direction.
+
+* UserInterface/Models/AlignmentData.js:
+(WI.AlignmentData._propertyNameToType):
+* UserInterface/Views/AlignmentEditor.css:
+(.alignment-editor .glyph.rotate-left > svg):
+* UserInterface/Views/AlignmentEditor.js:
+(WI.AlignmentEditor.shouldRotateGlyph):
+(WI.AlignmentEditor._glyphsForType):
+(WI.AlignmentEditor.prototype.set alignment):
+* UserInterface/Views/InlineSwatch.css:
+(.inline-swatch.alignment > span.rotate-left):
+* UserInterface/Views/InlineSwatch.js:
+(WI.InlineSwatch.prototype._updateSwatch):
+
 2021-12-10  Razvan Caliman  
 
 Web Inspector: Computed Panel: Group CSS variables by value type


Modified: trunk/Source/WebInspectorUI/UserInterface/Models/AlignmentData.js (286884 => 286885)

--- trunk/Source/WebInspectorUI/UserInterface/Models/AlignmentData.js	2021-12-11 00:38:22 UTC (rev 286884)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/AlignmentData.js	2021-12-11 00:40:58 UTC (rev 286885)
@@ -50,6 +50,12 @@
 return WI.AlignmentData.Type.AlignItems;
 case "align-self":
 return WI.AlignmentData.Type.AlignSelf;
+case "justify-content":
+return WI.AlignmentData.Type.JustifyContent;
+case "justify-items":
+return WI.AlignmentData.Type.JustifyItems;
+case "justify-self":
+return WI.AlignmentData.Type.JustifySelf;
 }
 return null;
 }
@@ -72,4 +78,7 @@
 AlignContent: "align-content",
 AlignItems: "align-items",
 AlignSelf: "align-self",
+JustifyContent: "justify-content",
+JustifyItems: "justify-items",
+JustifySelf: "justify-self",
 };


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css (286884 => 286885)

--- trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css	2021-12-11 00:38:22 UTC (rev 286884)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css	2021-12-11 00:40:58 UTC (rev 286885)
@@ -54,3 +54,7 @@
 color: var(--glyph-color-active-pressed);
 outline-color: var(--glyph-color-active-pressed);
 }
+
+.alignment-editor 

[webkit-changes] [286875] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [286875] trunk/Source/WebInspectorUI








Revision 286875
Author nvasil...@apple.com
Date 2021-12-10 14:01:57 -0800 (Fri, 10 Dec 2021)


Log Message
Web Inspector: Add a swatch for align-items and align-self
https://bugs.webkit.org/show_bug.cgi?id=233054


Reviewed by Devin Rousso.

Introduce inline swatches for `align-items` and `align-self`, that shows icons for common values:
start, center, end, and stretch.

* UserInterface/Images/AlignContentCenter.svg: Renamed from Source/WebInspectorUI/UserInterface/Images/AlignmentCenter.svg.
* UserInterface/Images/AlignContentEnd.svg: Renamed from Source/WebInspectorUI/UserInterface/Images/AlignmentEnd.svg.
* UserInterface/Images/AlignContentSpaceAround.svg: Renamed from Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceAround.svg.
* UserInterface/Images/AlignContentSpaceBetween.svg: Renamed from Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceBetween.svg.
* UserInterface/Images/AlignContentSpaceEvenly.svg: Renamed from Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceEvenly.svg.
* UserInterface/Images/AlignContentStart.svg: Renamed from Source/WebInspectorUI/UserInterface/Images/AlignmentStart.svg.
* UserInterface/Images/AlignContentStretch.svg: Renamed from Source/WebInspectorUI/UserInterface/Images/AlignmentStretch.svg.
Rename icons from Alignment to AlignContent since they are only used for `align-content` CSS property now.

* UserInterface/Images/AlignItemsCenter.svg: Added.
* UserInterface/Images/AlignItemsEnd.svg: Added.
* UserInterface/Images/AlignItemsStart.svg: Added.
* UserInterface/Images/AlignItemsStretch.svg: Added.
* UserInterface/Main.html:
* UserInterface/Models/AlignmentData.js: Added.

(WI.AlignmentData):
(WI.AlignmentData.isAlignmentAwarePropertyName):
(WI.AlignmentData._propertyNameToType):
(WI.AlignmentData.prototype.get type):
(WI.AlignmentData.prototype.get text):
(WI.AlignmentData.prototype.set text):
(WI.AlignmentData.prototype.toString):
Introduce a model object to be more consistent with the rest of the inline swatches.

* UserInterface/Views/AlignmentEditor.js:
(WI.AlignmentEditor):
Allow AlignmentEditor to work with more than one CSS property (i.e. align-content), by introducing propertyName argument.

(WI.AlignmentEditor.glyphPath):
(WI.AlignmentEditor._glyphsForType):
(WI.AlignmentEditor.prototype.get alignment):
(WI.AlignmentEditor.prototype.set alignment):
Rename `value` to `alignment` to be more consistent with the rest of the editors.

(WI.AlignmentEditor.prototype._removePreviouslySelected):
(WI.AlignmentEditor.prototype._updateSelected):
(WI.AlignmentEditor.isAlignContentValue): Deleted.
(WI.AlignmentEditor.prototype.get value): Deleted.
(WI.AlignmentEditor.prototype.set value): Deleted.
* UserInterface/Views/InlineSwatch.js:
(WI.InlineSwatch.prototype._updateSwatch):
(WI.InlineSwatch.prototype._valueEditorValueDidChange):
* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype._replaceSpecialTokens):
(WI.SpreadsheetStyleProperty.prototype._addAlignmentTokens):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Main.html
trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.js
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js


Added Paths

trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentCenter.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentEnd.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentSpaceAround.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentSpaceBetween.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentSpaceEvenly.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentStart.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignContentStretch.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignItemsCenter.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignItemsEnd.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignItemsStart.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignItemsStretch.svg
trunk/Source/WebInspectorUI/UserInterface/Models/AlignmentData.js


Removed Paths

trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentCenter.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentEnd.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceAround.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceBetween.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceEvenly.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentStart.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentStretch.svg




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (286874 => 286875)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-12-10 21:56:07 UTC (rev 286874)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-12-10 22:01:57 UTC (rev 

[webkit-changes] [285983] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [285983] trunk/Source/WebInspectorUI








Revision 285983
Author nvasil...@apple.com
Date 2021-11-17 23:18:04 -0800 (Wed, 17 Nov 2021)


Log Message
Web Inspector: Add a swatch for align-content
https://bugs.webkit.org/show_bug.cgi?id=230065


Reviewed by Devin Rousso.

Introduce an inline swatch for `align-content`, that shows icons for common align-content values:
start, center, end, space-between, space-around, space-evenly, and stretch.

* UserInterface/Images/AlignmentCenter.svg: Added.
* UserInterface/Images/AlignmentEnd.svg: Added.
* UserInterface/Images/AlignmentSpaceAround.svg: Added.
* UserInterface/Images/AlignmentSpaceBetween.svg: Added.
* UserInterface/Images/AlignmentSpaceEvenly.svg: Added.
* UserInterface/Images/AlignmentStart.svg: Added.
* UserInterface/Images/AlignmentStretch.svg: Added.
* UserInterface/Images/AlignmentUnknown.svg: Added.

* UserInterface/Main.html:
* UserInterface/Views/AlignmentEditor.css: Added.
(.alignment-editor .glyph):
(.alignment-editor .glyph:not(:last-child)):
(.alignment-editor .glyph:active):
(.alignment-editor .glyph.selected):
(.alignment-editor .glyph.selected + .glyph):
(.alignment-editor .glyph.selected:active):

* UserInterface/Views/AlignmentEditor.js: Added.
(WI.AlignmentEditor):
(WI.AlignmentEditor.isAlignContentValue):
(WI.AlignmentEditor.prototype.get element):
(WI.AlignmentEditor.prototype.get value):
(WI.AlignmentEditor.prototype.set value):
(WI.AlignmentEditor.prototype._updateSelected):

* UserInterface/Views/InlineSwatch.css:
(.inline-swatch:not(.read-only):matches(.bezier, .box-shadow, .spring, .variable, .alignment):hover):
(.inline-swatch:not(.read-only):matches(.bezier, .box-shadow, .spring, .variable, .alignment):active):
(.inline-swatch:is(.image, .alignment) > span):
(@media (prefers-color-scheme: dark) .inline-swatch.box-shadow > svg,):

* UserInterface/Views/InlineSwatch.js:
(WI.InlineSwatch):
(WI.InlineSwatch.prototype.didDismissPopover):
(WI.InlineSwatch.prototype._updateSwatch):
(WI.InlineSwatch.prototype._valueEditorValueDidChange):

* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype._replaceSpecialTokens):
(WI.SpreadsheetStyleProperty.prototype._addAlignmentTokens):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Main.html
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.css
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js


Added Paths

trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentCenter.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentEnd.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceAround.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceBetween.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentSpaceEvenly.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentStart.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentStretch.svg
trunk/Source/WebInspectorUI/UserInterface/Images/AlignmentUnknown.svg
trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.css
trunk/Source/WebInspectorUI/UserInterface/Views/AlignmentEditor.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (285982 => 285983)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-11-18 06:26:50 UTC (rev 285982)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-11-18 07:18:04 UTC (rev 285983)
@@ -1,3 +1,56 @@
+2021-11-17  Nikita Vasilyev  
+
+Web Inspector: Add a swatch for align-content
+https://bugs.webkit.org/show_bug.cgi?id=230065
+
+
+Reviewed by Devin Rousso.
+
+Introduce an inline swatch for `align-content`, that shows icons for common align-content values:
+start, center, end, space-between, space-around, space-evenly, and stretch.
+
+* UserInterface/Images/AlignmentCenter.svg: Added.
+* UserInterface/Images/AlignmentEnd.svg: Added.
+* UserInterface/Images/AlignmentSpaceAround.svg: Added.
+* UserInterface/Images/AlignmentSpaceBetween.svg: Added.
+* UserInterface/Images/AlignmentSpaceEvenly.svg: Added.
+* UserInterface/Images/AlignmentStart.svg: Added.
+* UserInterface/Images/AlignmentStretch.svg: Added.
+* UserInterface/Images/AlignmentUnknown.svg: Added.
+
+* UserInterface/Main.html:
+* UserInterface/Views/AlignmentEditor.css: Added.
+(.alignment-editor .glyph):
+(.alignment-editor .glyph:not(:last-child)):
+(.alignment-editor .glyph:active):
+(.alignment-editor .glyph.selected):
+(.alignment-editor .glyph.selected + .glyph):
+(.alignment-editor .glyph.selected:active):
+
+* UserInterface/Views/AlignmentEditor.js: Added.
+(WI.AlignmentEditor):
+(WI.AlignmentEditor.isAlignContentValue):
+(WI.AlignmentEditor.prototype.get element):
+

[webkit-changes] [285896] trunk

[nvasilyev]

Title: [285896] trunk








Revision 285896
Author nvasil...@apple.com
Date 2021-11-16 16:23:20 -0800 (Tue, 16 Nov 2021)


Log Message
Web Inspector: Remove unused `dontCreateIfMissing` argument from CSSStyleDeclaration.prototype.propertyForName
https://bugs.webkit.org/show_bug.cgi?id=233198

Reviewed by Devin Rousso.

Source/WebInspectorUI:

`dontCreateIfMissing` was always set to `true`.

* UserInterface/Models/CSSStyleDeclaration.js:
(WI.CSSStyleDeclaration.prototype.propertyForName):
Drive-by: inline findMatch function, which was only used once.

* UserInterface/Models/DOMNodeStyles.js:
(WI.DOMNodeStyles.prototype._parseStylePropertyPayload):
* UserInterface/Models/Font.js:
(WI.Font):
* UserInterface/Views/BoxModelDetailsSectionRow.js:
(WI.BoxModelDetailsSectionRow.prototype._getPropertyValue):
* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype._addVariableTokens):

LayoutTests:

* inspector/css/overridden-property.html:
* inspector/css/pseudo-element-matches-for-pseudo-element-node.html:

Modified Paths

trunk/LayoutTests/ChangeLog
trunk/LayoutTests/inspector/css/overridden-property.html
trunk/LayoutTests/inspector/css/pseudo-element-matches-for-pseudo-element-node.html
trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js
trunk/Source/WebInspectorUI/UserInterface/Models/DOMNodeStyles.js
trunk/Source/WebInspectorUI/UserInterface/Models/Font.js
trunk/Source/WebInspectorUI/UserInterface/Views/BoxModelDetailsSectionRow.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js




Diff

Modified: trunk/LayoutTests/ChangeLog (285895 => 285896)

--- trunk/LayoutTests/ChangeLog	2021-11-17 00:14:20 UTC (rev 285895)
+++ trunk/LayoutTests/ChangeLog	2021-11-17 00:23:20 UTC (rev 285896)
@@ -1,3 +1,13 @@
+2021-11-16  Nikita Vasilyev  
+
+Web Inspector: Remove unused `dontCreateIfMissing` argument from CSSStyleDeclaration.prototype.propertyForName
+https://bugs.webkit.org/show_bug.cgi?id=233198
+
+Reviewed by Devin Rousso.
+
+* inspector/css/overridden-property.html:
+* inspector/css/pseudo-element-matches-for-pseudo-element-node.html:
+
 2021-11-16  Rob Buis  
 
 [css-contain] Support contain:paint


Modified: trunk/LayoutTests/inspector/css/overridden-property.html (285895 => 285896)

--- trunk/LayoutTests/inspector/css/overridden-property.html	2021-11-17 00:14:20 UTC (rev 285895)
+++ trunk/LayoutTests/inspector/css/overridden-property.html	2021-11-17 00:23:20 UTC (rev 285896)
@@ -92,11 +92,10 @@
 name: "OverriddenProperty.OverriddenByShorthand",
 test(resolve, reject) {
 getStyleDeclaration(".longhand-overridden-by-shorthand", (style) => {
-const dontCreateIfMissing = true;
-let borderTopColorProperty = style.propertyForName("border-top-color", dontCreateIfMissing);
+let borderTopColorProperty = style.propertyForName("border-top-color");
 InspectorTest.expectTrue(borderTopColorProperty.overridden, "border-top-color is overridden.");
 
-let borderColorProperty = style.propertyForName("border-color", dontCreateIfMissing);
+let borderColorProperty = style.propertyForName("border-color");
 InspectorTest.expectFalse(borderColorProperty.overridden, "border-color is NOT overridden.");
 
 resolve();
@@ -108,11 +107,10 @@
 name: "OverriddenProperty.OverriddenByImportantShorthand",
 test(resolve, reject) {
 getStyleDeclaration(".longhand-overridden-by-important-shorthand", (style) => {
-const dontCreateIfMissing = true;
-let borderColorProperty = style.propertyForName("border-color", dontCreateIfMissing);
+let borderColorProperty = style.propertyForName("border-color");
 InspectorTest.expectFalse(borderColorProperty.overridden, "border-color is NOT overridden.");
 
-let borderTopColorProperty = style.propertyForName("border-top-color", dontCreateIfMissing);
+let borderTopColorProperty = style.propertyForName("border-top-color");
 InspectorTest.expectTrue(borderTopColorProperty.overridden, "border-top-color is overridden.");
 
 resolve();
@@ -124,11 +122,10 @@
 name: "OverriddenProperty.NotOverriddenByImportantLonghand",
 test(resolve, reject) {
 getStyleDeclaration(".shorthand-overridden-by-important-longhand", (style) => {
-const dontCreateIfMissing = true;
-let borderTopColorProperty = style.propertyForName("border-top-color", dontCreateIfMissing);
+let borderTopColorProperty = style.propertyForName("border-top-color");
 InspectorTest.expectFalse(borderTopColorProperty.overridden, "border-top-color is NOT overridden.");
 
-let 

[webkit-changes] [285215] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [285215] trunk/Source/WebInspectorUI








Revision 285215
Author nvasil...@apple.com
Date 2021-11-03 10:47:09 -0700 (Wed, 03 Nov 2021)


Log Message
Web Inspector: Display swatch popovers below the swatch by default, not on the left side
https://bugs.webkit.org/show_bug.cgi?id=232577

Reviewed by Devin Rousso.

The new defaults are: below, above, left.

Displaying the swatch popover on the left side covers the relevant property name.
Displaying it below or above doesn't have this problem; below is preferred because
it doesn't hide the CSS selector of the relevant rule.

* UserInterface/Views/InlineSwatch.js:
(WI.InlineSwatch.prototype._presentPopover):
Introduce a method to remove code duplication.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (285214 => 285215)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-11-03 17:28:39 UTC (rev 285214)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-11-03 17:47:09 UTC (rev 285215)
@@ -1,3 +1,20 @@
+2021-11-03  Nikita Vasilyev  
+
+Web Inspector: Display swatch popovers below the swatch by default, not on the left side
+https://bugs.webkit.org/show_bug.cgi?id=232577
+
+Reviewed by Devin Rousso.
+
+The new defaults are: below, above, left.
+
+Displaying the swatch popover on the left side covers the relevant property name.
+Displaying it below or above doesn't have this problem; below is preferred because
+it doesn't hide the CSS selector of the relevant rule.
+
+* UserInterface/Views/InlineSwatch.js:
+(WI.InlineSwatch.prototype._presentPopover):
+Introduce a method to remove code duplication.
+
 2021-10-29  David Kilzer  
 
 Web Inspector: Enable -Wformat=2 warnings


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js (285214 => 285215)

--- trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js	2021-11-03 17:28:39 UTC (rev 285214)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js	2021-11-03 17:47:09 UTC (rev 285215)
@@ -238,12 +238,10 @@
 if (!value)
 value = this._fallbackValue();
 
-let bounds = WI.Rect.rectFromClientRect(this._swatchElement.getBoundingClientRect());
 let popover = new WI.Popover(this);
 
 popover.windowResizeHandler = () => {
-let bounds = WI.Rect.rectFromClientRect(this._swatchElement.getBoundingClientRect());
-popover.present(bounds.pad(2), [WI.RectEdge.MIN_X]);
+this._presentPopover(popover);
 };
 
 this._valueEditor = null;
@@ -307,7 +305,7 @@
 return;
 
 popover.content = this._valueEditor.element;
-popover.present(bounds.pad(2), [WI.RectEdge.MIN_X]);
+this._presentPopover(popover);
 
 this.dispatchEventToListeners(WI.InlineSwatch.Event.Activated);
 
@@ -383,6 +381,12 @@
 this._updateSwatch();
 }
 
+_presentPopover(popover)
+{
+let bounds = WI.Rect.rectFromClientRect(this._swatchElement.getBoundingClientRect());
+popover.present(bounds.pad(2), [WI.RectEdge.MAX_Y, WI.RectEdge.MIN_Y, WI.RectEdge.MIN_X]);
+}
+
 _handleContextMenuEvent(event)
 {
 let value = this.value;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [283723] trunk

[nvasilyev]

Title: [283723] trunk








Revision 283723
Author nvasil...@apple.com
Date 2021-10-07 11:15:14 -0700 (Thu, 07 Oct 2021)


Log Message
Web Inspector: Styles: format style declarations after editing
https://bugs.webkit.org/show_bug.cgi?id=178835


Reviewed by Devin Rousso.

Source/WebInspectorUI:

Indent CSS properties with spaces/tabs set in Web Inspector settings. Increse indentation level when CSS rules are
inside of at-rules (e.g. @media, @keyframes, @supports).

Don't indent CSS properties in style attributes. Keep them on the single line, separated by a space character:

style="font-size: 12px; color: black;"

* UserInterface/Models/CSSProperty.js:
(WI.CSSProperty.prototype.set text):
Introduce `_isTextPendingSave` flag. It's needed when saving pasted text, and saving commented out or uncommented CSS properties.

(WI.CSSProperty.prototype.get formattedText):

(WI.CSSProperty.prototype.replaceWithText): Deleted.
This is redundant - setting `text` works the same.

(WI.CSSProperty.prototype._updateStyleText):
(WI.CSSProperty.prototype._updateOwnerStyleText):
(WI.CSSProperty.prototype._prependSemicolonIfNeeded): Deleted.
Greatly simplify the logic now that we save formatted text and don't modify styleText.

* UserInterface/Models/CSSStyleDeclaration.js:
(WI.CSSStyleDeclaration.prototype.removeProperty):
Remode unnecessary code that modifies `_styleSheetTextRange`. The backend sends new `_styleSheetTextRange` data
upon a change.

(WI.CSSStyleDeclaration.prototype.generateFormattedText): Renamed from 'generateCSSRuleString'.

* UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js:
(WI.SpreadsheetCSSStyleDeclarationSection.prototype._populateIconElementContextMenu):
* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype.remove):

LayoutTests:

- Indent text of expected CSS properties.
- Test generateFormattedText with all permutations of its options.
- Add a basic test ensuring styleSheetTextRange updates correctly from the backend.

* inspector/css/add-css-property.html:
* inspector/css/generateCSSRuleString-expected.txt: Removed.
* inspector/css/generateCSSRuleString.html: Removed.
* inspector/css/generateFormattedText-expected.txt: Added.
* inspector/css/generateFormattedText.html: Added.
* inspector/css/modify-css-property-expected.txt:
* inspector/css/modify-css-property.html:
* inspector/css/modify-inline-style-expected.txt:
* inspector/css/resources/modify-css-property.css: Added.
(.rule-a):
(.rule-b):
(.rule-c):
(.rule-d):

Modified Paths

trunk/LayoutTests/ChangeLog
trunk/LayoutTests/inspector/css/add-css-property.html
trunk/LayoutTests/inspector/css/modify-css-property-expected.txt
trunk/LayoutTests/inspector/css/modify-css-property.html
trunk/LayoutTests/inspector/css/modify-inline-style-expected.txt
trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/CSSProperty.js
trunk/Source/WebInspectorUI/UserInterface/Models/CSSStyleDeclaration.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js


Added Paths

trunk/LayoutTests/inspector/css/generateFormattedText-expected.txt
trunk/LayoutTests/inspector/css/generateFormattedText.html
trunk/LayoutTests/inspector/css/resources/modify-css-property.css


Removed Paths

trunk/LayoutTests/inspector/css/generateCSSRuleString-expected.txt
trunk/LayoutTests/inspector/css/generateCSSRuleString.html




Diff

Modified: trunk/LayoutTests/ChangeLog (283722 => 283723)

--- trunk/LayoutTests/ChangeLog	2021-10-07 18:08:53 UTC (rev 283722)
+++ trunk/LayoutTests/ChangeLog	2021-10-07 18:15:14 UTC (rev 283723)
@@ -1,3 +1,29 @@
+2021-10-07  Nikita Vasilyev  
+
+Web Inspector: Styles: format style declarations after editing
+https://bugs.webkit.org/show_bug.cgi?id=178835
+
+
+Reviewed by Devin Rousso.
+
+- Indent text of expected CSS properties.
+- Test generateFormattedText with all permutations of its options.
+- Add a basic test ensuring styleSheetTextRange updates correctly from the backend.
+
+* inspector/css/add-css-property.html:
+* inspector/css/generateCSSRuleString-expected.txt: Removed.
+* inspector/css/generateCSSRuleString.html: Removed.
+* inspector/css/generateFormattedText-expected.txt: Added.
+* inspector/css/generateFormattedText.html: Added.
+* inspector/css/modify-css-property-expected.txt:
+* inspector/css/modify-css-property.html:
+* inspector/css/modify-inline-style-expected.txt:
+* inspector/css/resources/modify-css-property.css: Added.
+(.rule-a):
+(.rule-b):
+(.rule-c):
+(.rule-d):
+
 2021-10-07  Ayumi Kojima  
 
 [ BigSur AS EWS ] http/tests/xmlhttprequest/access-control-response-with-body.html is flaky crashing.


Modified: trunk/LayoutTests/inspector/css/add-css-property.html (283722 => 

[webkit-changes] [280974] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [280974] trunk/Source/WebInspectorUI








Revision 280974
Author nvasil...@apple.com
Date 2021-08-12 12:07:27 -0700 (Thu, 12 Aug 2021)


Log Message
REGRESSION (r271348): Web Inspector: Table headers have vertical scrollbar
https://bugs.webkit.org/show_bug.cgi?id=228671


Reviewed by Devin Rousso.

* UserInterface/Views/Table.css:
(.table > .header):
Set overflow hidden for the y axis, not just x axis.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/Table.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (280973 => 280974)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-08-12 18:58:47 UTC (rev 280973)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-08-12 19:07:27 UTC (rev 280974)
@@ -1,3 +1,15 @@
+2021-08-12  Nikita Vasilyev  
+
+REGRESSION (r271348): Web Inspector: Table headers have vertical scrollbar
+https://bugs.webkit.org/show_bug.cgi?id=228671
+
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/Table.css:
+(.table > .header):
+Set overflow hidden for the y axis, not just x axis.
+
 2021-08-03  Sonia Singla  
 
 Web Inspector: Add standard logical properties to CSS keyword completion


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Table.css (280973 => 280974)

--- trunk/Source/WebInspectorUI/UserInterface/Views/Table.css	2021-08-12 18:58:47 UTC (rev 280973)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Table.css	2021-08-12 19:07:27 UTC (rev 280974)
@@ -41,7 +41,7 @@
 line-height: calc(var(--navigation-bar-height) - 1px);
 border-bottom: 1px solid var(--border-color);
 background: var(--background-color);
-overflow-x: hidden;
+overflow: hidden;
 vertical-align: middle;
 white-space: nowrap;
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [280566] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [280566] trunk/Source/WebInspectorUI








Revision 280566
Author nvasil...@apple.com
Date 2021-08-02 15:54:05 -0700 (Mon, 02 Aug 2021)


Log Message
Web Inspector: Network: sorting of transfer size for failed requests is causing the ordering to change every layout
https://bugs.webkit.org/show_bug.cgi?id=228712

Reviewed by Devin Rousso.

* UserInterface/Views/NetworkTableContentView.js:
(WI.NetworkTableContentView.prototype._generateSortComparator):
Don't change the item order when both values are NaN.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (280565 => 280566)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-08-02 22:37:04 UTC (rev 280565)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-08-02 22:54:05 UTC (rev 280566)
@@ -1,3 +1,14 @@
+2021-08-02  Nikita Vasilyev  
+
+Web Inspector: Network: sorting of transfer size for failed requests is causing the ordering to change every layout
+https://bugs.webkit.org/show_bug.cgi?id=228712
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/NetworkTableContentView.js:
+(WI.NetworkTableContentView.prototype._generateSortComparator):
+Don't change the item order when both values are NaN.
+
 2021-07-26  Qiaosong Zhou  
 
 FormDataEvent added. 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js (280565 => 280566)

--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js	2021-08-02 22:37:04 UTC (rev 280565)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js	2021-08-02 22:54:05 UTC (rev 280566)
@@ -1034,9 +1034,12 @@
 // Simple number.
 comparator = (a, b) => {
 let aValue = a[sortColumnIdentifier];
+let bValue = b[sortColumnIdentifier];
+
+if (isNaN(aValue) && isNaN(bValue))
+return 0;
 if (isNaN(aValue))
 return 1;
-let bValue = b[sortColumnIdentifier];
 if (isNaN(bValue))
 return -1;
 return aValue - bValue;
@@ -1059,6 +1062,9 @@
 let transferSizeA = a.transferSize;
 let transferSizeB = b.transferSize;
 
+if (isNaN(transferSizeA) && isNaN(transferSizeB))
+return 0;
+
 // Treat NaN as the largest value.
 if (isNaN(transferSizeA))
 return 1;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [280045] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [280045] trunk/Source/WebInspectorUI








Revision 280045
Author nvasil...@apple.com
Date 2021-07-19 13:49:56 -0700 (Mon, 19 Jul 2021)


Log Message
Web Inspector: REGRESSION(?): alpha slider doesn't match alpha input for `transparent` in color picker
https://bugs.webkit.org/show_bug.cgi?id=227941


Reviewed by Devin Rousso.

* UserInterface/Views/Slider.js:
(WI.Slider.prototype.set value):
When the initial value was set to 0, `set value` was exiting early when the passed value was 0.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (280044 => 280045)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-07-19 20:45:37 UTC (rev 280044)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-07-19 20:49:56 UTC (rev 280045)
@@ -1,3 +1,15 @@
+2021-07-19  Nikita Vasilyev  
+
+Web Inspector: REGRESSION(?): alpha slider doesn't match alpha input for `transparent` in color picker
+https://bugs.webkit.org/show_bug.cgi?id=227941
+
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/Slider.js:
+(WI.Slider.prototype.set value):
+When the initial value was set to 0, `set value` was exiting early when the passed value was 0.
+
 2021-07-19  Patrick Angle  
 
 Web Inspector: Elements: selecting a sibling node in the breadcrumb navigation doesn't do anything


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js (280044 => 280045)

--- trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js	2021-07-19 20:45:37 UTC (rev 280044)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js	2021-07-19 20:49:56 UTC (rev 280045)
@@ -59,8 +59,10 @@
 {
 value = Math.max(Math.min(value, 1), 0);
 
-if (value === this._value)
+if (value === this._value) {
+this.recalculateKnobY();
 return;
+}
 
 this.knobY = value;
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [277284] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [277284] trunk/Source/WebInspectorUI








Revision 277284
Author nvasil...@apple.com
Date 2021-05-10 12:33:14 -0700 (Mon, 10 May 2021)


Log Message
Web Inspector: Layout panel "Grid Overlays" main checkbox has dead space (no interaction) between checkbox and label text
https://bugs.webkit.org/show_bug.cgi?id=225433


Reviewed by Devin Rousso.

Make the empty space between the checkbox and the label text clickable in:
- Everywhere in Settings tab
- Layout panel, Page Overlay Options
- Grid Overlay header

* UserInterface/Main.html:
* UserInterface/Views/CSSGridSection.css:
(.css-grid-section .node-display-name):
(.css-grid-section .toggle-all):
(.css-grid-section :is(.setting-editor, .node-overlay-list-item-container, .heading) input[type="checkbox"]):
(.css-grid-section .setting-editor > input[type="checkbox"]):
(.css-grid-section .node-display-name,): Deleted.
Make all checkbox labels in the Grid section align vertically.

* UserInterface/Views/CSSGridSection.js:
(WI.CSSGridSection.prototype.initialLayout):
* UserInterface/Views/SettingEditor.css: Copied from Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css.
(.setting-editor input):
(.setting-editor > input[type="checkbox"]):
(.setting-editor > label):

* UserInterface/Views/SettingEditor.js:
(WI.SettingEditor):
* UserInterface/Views/SettingsTabContentView.css:
(.content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor):
(.content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor:first-child > *):
(.content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor input[type="checkbox"]):
(.content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor select):
(.content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor input[type="number"]):
(.content-view.tab.settings > .settings-view > .container > .editor-group > .setting-editor input[type="text"]):
(.content-view.tab.settings > .settings-view > .container > .editor-group > .editor): Deleted.
(.content-view.tab.settings > .settings-view > .container > .editor-group > .editor:first-child > *): Deleted.
(.content-view.tab.settings > .settings-view > .container > .editor-group > .editor input): Deleted.
(.content-view.tab.settings > .settings-view > .container > .editor-group > .editor input[type="checkbox"]): Deleted.
(.content-view.tab.settings > .settings-view > .container > .editor-group > .editor select): Deleted.
(.content-view.tab.settings > .settings-view > .container > .editor-group > .editor input[type="number"]): Deleted.
(.content-view.tab.settings > .settings-view > .container > .editor-group > .editor input[type="text"]): Deleted.
Rename ".editor" to ".setting-editor" so it matches SettingEditor.css.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Main.html
trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css
trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingEditor.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css


Added Paths

trunk/Source/WebInspectorUI/UserInterface/Views/SettingEditor.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (277283 => 277284)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-05-10 19:28:08 UTC (rev 277283)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-05-10 19:33:14 UTC (rev 277284)
@@ -1,3 +1,50 @@
+2021-05-10  Nikita Vasilyev  
+
+Web Inspector: Layout panel "Grid Overlays" main checkbox has dead space (no interaction) between checkbox and label text
+https://bugs.webkit.org/show_bug.cgi?id=225433
+
+
+Reviewed by Devin Rousso.
+
+Make the empty space between the checkbox and the label text clickable in:
+- Everywhere in Settings tab
+- Layout panel, Page Overlay Options
+- Grid Overlay header
+
+* UserInterface/Main.html:
+* UserInterface/Views/CSSGridSection.css:
+(.css-grid-section .node-display-name):
+(.css-grid-section .toggle-all):
+(.css-grid-section :is(.setting-editor, .node-overlay-list-item-container, .heading) input[type="checkbox"]):
+(.css-grid-section .setting-editor > input[type="checkbox"]):
+(.css-grid-section .node-display-name,): Deleted.
+Make all checkbox labels in the Grid section align vertically.
+
+* UserInterface/Views/CSSGridSection.js:
+(WI.CSSGridSection.prototype.initialLayout):
+* UserInterface/Views/SettingEditor.css: Copied from Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css.
+(.setting-editor input):
+(.setting-editor > input[type="checkbox"]):
+(.setting-editor > label):
+
+* UserInterface/Views/SettingEditor.js:
+(WI.SettingEditor):
+* 

[webkit-changes] [276616] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [276616] trunk/Source/WebInspectorUI








Revision 276616
Author nvasil...@apple.com
Date 2021-04-26 14:54:22 -0700 (Mon, 26 Apr 2021)


Log Message
Web Inspector: Audit Tab: Edits are not committed when leaving edit mode unless you first click into another text field
https://bugs.webkit.org/show_bug.cgi?id=224318


Reviewed by Devin Rousso.

Save test and setup code when pressing "Done" button. Don't rely on the blur event because it doesn't fire on
the focused element when it's removed from the DOM.

* UserInterface/Models/AuditTestBase.js:
(WI.AuditTestBase.prototype.set setup):
* UserInterface/Models/AuditTestCase.js:
(WI.AuditTestCase.prototype.set test):
Allow setting `test` and `setup` after editing is finished.

* UserInterface/Views/AuditTestCaseContentView.js:
(WI.AuditTestCaseContentView.prototype.layout):
(WI.AuditTestCaseContentView.prototype.saveEditedData):
* UserInterface/Views/AuditTestContentView.js:
(WI.AuditTestContentView.prototype.detached):
Saving test on `detached` saves it when selecting a different test in the navigation sidebar.

(WI.AuditTestContentView.prototype.saveEditedData):
(WI.AuditTestContentView.prototype._createSetupEditor):
(WI.AuditTestContentView.prototype._handleEditingChanged):
(WI.AuditTestContentView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/AuditTestBase.js
trunk/Source/WebInspectorUI/UserInterface/Models/AuditTestCase.js
trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestCaseContentView.js
trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (276615 => 276616)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-04-26 21:44:16 UTC (rev 276615)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-04-26 21:54:22 UTC (rev 276616)
@@ -1,3 +1,32 @@
+2021-04-26  Nikita Vasilyev  
+
+Web Inspector: Audit Tab: Edits are not committed when leaving edit mode unless you first click into another text field
+https://bugs.webkit.org/show_bug.cgi?id=224318
+
+
+Reviewed by Devin Rousso.
+
+Save test and setup code when pressing "Done" button. Don't rely on the blur event because it doesn't fire on
+the focused element when it's removed from the DOM.
+
+* UserInterface/Models/AuditTestBase.js:
+(WI.AuditTestBase.prototype.set setup):
+* UserInterface/Models/AuditTestCase.js:
+(WI.AuditTestCase.prototype.set test):
+Allow setting `test` and `setup` after editing is finished.
+
+* UserInterface/Views/AuditTestCaseContentView.js:
+(WI.AuditTestCaseContentView.prototype.layout):
+(WI.AuditTestCaseContentView.prototype.saveEditedData):
+* UserInterface/Views/AuditTestContentView.js:
+(WI.AuditTestContentView.prototype.detached):
+Saving test on `detached` saves it when selecting a different test in the navigation sidebar.
+
+(WI.AuditTestContentView.prototype.saveEditedData):
+(WI.AuditTestContentView.prototype._createSetupEditor):
+(WI.AuditTestContentView.prototype._handleEditingChanged):
+(WI.AuditTestContentView):
+
 2021-04-26  Devin Rousso  
 
 Web Inspector: Audit: Uncaught Exception: Failed to execute 'delete' on 'IDBObjectStore': The parameter is not a valid key range.


Modified: trunk/Source/WebInspectorUI/UserInterface/Models/AuditTestBase.js (276615 => 276616)

--- trunk/Source/WebInspectorUI/UserInterface/Models/AuditTestBase.js	2021-04-26 21:44:16 UTC (rev 276615)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/AuditTestBase.js	2021-04-26 21:54:22 UTC (rev 276616)
@@ -121,7 +121,6 @@
 set setup(setup)
 {
 console.assert(this.editable);
-console.assert(WI.auditManager.editing);
 console.assert(typeof setup === "string", setup);
 
 if (setup === this._setup)


Modified: trunk/Source/WebInspectorUI/UserInterface/Models/AuditTestCase.js (276615 => 276616)

--- trunk/Source/WebInspectorUI/UserInterface/Models/AuditTestCase.js	2021-04-26 21:44:16 UTC (rev 276615)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/AuditTestCase.js	2021-04-26 21:54:22 UTC (rev 276616)
@@ -100,7 +100,6 @@
 set test(test)
 {
 console.assert(this.editable);
-console.assert(WI.auditManager.editing);
 console.assert(typeof test === "string", test);
 
 if (test === this._test)


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestCaseContentView.js (276615 => 276616)

--- trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestCaseContentView.js	2021-04-26 21:44:16 UTC (rev 276615)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestCaseContentView.js	2021-04-26 21:54:22 UTC (rev 276616)
@@ -81,7 +81,7 @@
 
 // Give the rest of the view a chance to load.
 setTimeout(() => {
-let testCodeMirror = 

[webkit-changes] [275310] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [275310] trunk/Source/WebInspectorUI








Revision 275310
Author nvasil...@apple.com
Date 2021-03-31 15:31:53 -0700 (Wed, 31 Mar 2021)


Log Message
Web Inspector: Autocomplete experimental CSS Color values (hwb, lch, lab, color-mix, color-contrast)
https://bugs.webkit.org/show_bug.cgi?id=224010


Reviewed by BJ Burg.

* UserInterface/Models/CSSKeywordCompletions.js:

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (275309 => 275310)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-03-31 22:11:59 UTC (rev 275309)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-03-31 22:31:53 UTC (rev 275310)
@@ -1,3 +1,13 @@
+2021-03-31  Nikita Vasilyev  
+
+Web Inspector: Autocomplete experimental CSS Color values (hwb, lch, lab, color-mix, color-contrast)
+https://bugs.webkit.org/show_bug.cgi?id=224010
+
+
+Reviewed by BJ Burg.
+
+* UserInterface/Models/CSSKeywordCompletions.js:
+
 2021-03-28  Sam Weinig  
 
 Remove ENABLE_INDEXED_DATABASE & ENABLE_INDEXED_DATABASE_IN_WORKERS, it seems like it is on for all ports


Modified: trunk/Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js (275309 => 275310)

--- trunk/Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js	2021-03-31 22:11:59 UTC (rev 275309)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js	2021-03-31 22:31:53 UTC (rev 275310)
@@ -313,7 +313,8 @@
 "paleturquoise", "palevioletred", "papayawhip", "peachpuff", "peru", "pink", "plum", "powderblue", "rebeccapurple", "rosybrown",
 "royalblue", "saddlebrown", "salmon", "sandybrown", "seagreen", "seashell", "sienna", "skyblue", "slateblue",
 "slategray", "slategrey", "snow", "springgreen", "steelblue", "tan", "thistle", "tomato", "turquoise", "violet",
-"wheat", "whitesmoke", "yellowgreen", "rgb()", "rgba()", "hsl()", "hsla()", "color()",
+"wheat", "whitesmoke", "yellowgreen", "rgb()", "rgba()", "hsl()", "hsla()", "color()", "hwb()", "lch()", "lab()",
+"color-mix()", "color-contrast()",
 ];
 
 WI.CSSKeywordCompletions._colorAwareProperties = new Set([






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [274680] trunk

[nvasilyev]

Title: [274680] trunk








Revision 274680
Author nvasil...@apple.com
Date 2021-03-18 15:59:04 -0700 (Thu, 18 Mar 2021)


Log Message
Use 1000-based units for file sizes, per HIG
https://bugs.webkit.org/show_bug.cgi?id=208190


Reviewed by BJ Burg.

Source/WebInspectorUI:

* UserInterface/Base/Utilities.js:
* UserInterface/Views/ResourceSizesContentView.js:
(WI.ResourceSizesContentView.prototype._formattedSizeComponent):

LayoutTests:

* inspector/unit-tests/number-utilities.html:

Modified Paths

trunk/LayoutTests/ChangeLog
trunk/LayoutTests/inspector/unit-tests/number-utilities.html
trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js
trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSizesContentView.js




Diff

Modified: trunk/LayoutTests/ChangeLog (274679 => 274680)

--- trunk/LayoutTests/ChangeLog	2021-03-18 22:53:51 UTC (rev 274679)
+++ trunk/LayoutTests/ChangeLog	2021-03-18 22:59:04 UTC (rev 274680)
@@ -1,3 +1,13 @@
+2021-03-18  Nikita Vasilyev  
+
+Use 1000-based units for file sizes, per HIG
+https://bugs.webkit.org/show_bug.cgi?id=208190
+
+
+Reviewed by BJ Burg.
+
+* inspector/unit-tests/number-utilities.html:
+
 2021-03-18  Chris Gambrell  
 
 [ macOS Wk2 ] http/tests/security/contentSecurityPolicy/report-only-connect-src-xmlhttprequest-redirect-to-blocked.php is constantly text failing


Modified: trunk/LayoutTests/inspector/unit-tests/number-utilities.html (274679 => 274680)

--- trunk/LayoutTests/inspector/unit-tests/number-utilities.html	2021-03-18 22:53:51 UTC (rev 274679)
+++ trunk/LayoutTests/inspector/unit-tests/number-utilities.html	2021-03-18 22:59:04 UTC (rev 274680)
@@ -68,8 +68,8 @@
 suite.addTestCase({
 name: "Number.bytesToString",
 test() {
-const kb = 1024;
-const mb = kb * 1024;
+const kb = 1000;
+const mb = kb * 1000;
 
 // Normal resolution.
 InspectorTest.expectEqual(Number.bytesToString(123, false), "123 B", "normal resolution of sub 1k should be bytes");


Modified: trunk/Source/WebInspectorUI/ChangeLog (274679 => 274680)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-03-18 22:53:51 UTC (rev 274679)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-03-18 22:59:04 UTC (rev 274680)
@@ -1,5 +1,17 @@
 2021-03-18  Nikita Vasilyev  
 
+Use 1000-based units for file sizes, per HIG
+https://bugs.webkit.org/show_bug.cgi?id=208190
+
+
+Reviewed by BJ Burg.
+
+* UserInterface/Base/Utilities.js:
+* UserInterface/Views/ResourceSizesContentView.js:
+(WI.ResourceSizesContentView.prototype._formattedSizeComponent):
+
+2021-03-18  Nikita Vasilyev  
+
 Web Inspector: REGRESSION(r271348): Console: message source code location is not vertically aligned with containing function name
 https://bugs.webkit.org/show_bug.cgi?id=223288
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js (274679 => 274680)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js	2021-03-18 22:53:51 UTC (rev 274679)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js	2021-03-18 22:59:04 UTC (rev 274680)
@@ -1359,26 +1359,26 @@
 value(bytes, higherResolution, bytesThreshold)
 {
 higherResolution ??= true;
-bytesThreshold ??= 1024;
+bytesThreshold ??= 1000;
 
 if (Math.abs(bytes) < bytesThreshold)
 return WI.UIString("%.0f B").format(bytes);
 
-let kilobytes = bytes / 1024;
-if (Math.abs(kilobytes) < 1024) {
+let kilobytes = bytes / 1000;
+if (Math.abs(kilobytes) < 1000) {
 if (higherResolution || Math.abs(kilobytes) < 10)
 return WI.UIString("%.2f KB").format(kilobytes);
 return WI.UIString("%.1f KB").format(kilobytes);
 }
 
-let megabytes = kilobytes / 1024;
-if (Math.abs(megabytes) < 1024) {
+let megabytes = kilobytes / 1000;
+if (Math.abs(megabytes) < 1000) {
 if (higherResolution || Math.abs(megabytes) < 10)
 return WI.UIString("%.2f MB").format(megabytes);
 return WI.UIString("%.1f MB").format(megabytes);
 }
 
-let gigabytes = megabytes / 1024;
+let gigabytes = megabytes / 1000;
 if (higherResolution || Math.abs(gigabytes) < 10)
 return WI.UIString("%.2f GB").format(gigabytes);
 return WI.UIString("%.1f GB").format(gigabytes);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSizesContentView.js (274679 => 274680)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSizesContentView.js	2021-03-18 22:53:51 UTC (rev 274679)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceSizesContentView.js	2021-03-18 22:59:04 UTC (rev 274680)
@@ -168,9 +168,9 @@
 console.assert(bytes >= 0);
 
 // Prefer KB over B. 

[webkit-changes] [274656] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [274656] trunk/Source/WebInspectorUI








Revision 274656
Author nvasil...@apple.com
Date 2021-03-18 11:45:16 -0700 (Thu, 18 Mar 2021)


Log Message
Web Inspector: REGRESSION(r271348): Console: message source code location is not vertically aligned with containing function name
https://bugs.webkit.org/show_bug.cgi?id=223288


Reviewed by Devin Rousso.

WebKit inline-block behavior changed in r271348 to match the spec more closely.

* UserInterface/Views/ConsoleMessageView.css:
(.console-message-location.call-frame > .title):
Explicitly set `vertical-align` to match the behavior prior r271348.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ConsoleMessageView.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (274655 => 274656)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-03-18 18:36:38 UTC (rev 274655)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-03-18 18:45:16 UTC (rev 274656)
@@ -1,3 +1,17 @@
+2021-03-18  Nikita Vasilyev  
+
+Web Inspector: REGRESSION(r271348): Console: message source code location is not vertically aligned with containing function name
+https://bugs.webkit.org/show_bug.cgi?id=223288
+
+
+Reviewed by Devin Rousso.
+
+WebKit inline-block behavior changed in r271348 to match the spec more closely.
+
+* UserInterface/Views/ConsoleMessageView.css:
+(.console-message-location.call-frame > .title):
+Explicitly set `vertical-align` to match the behavior prior r271348.
+
 2021-03-17  Devin Rousso  
 
 Web Inspector: use native datetime-local picker for changing `expires` value in cookie popover


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ConsoleMessageView.css (274655 => 274656)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ConsoleMessageView.css	2021-03-18 18:36:38 UTC (rev 274655)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ConsoleMessageView.css	2021-03-18 18:45:16 UTC (rev 274656)
@@ -281,6 +281,7 @@
 overflow: hidden;
 text-overflow: ellipsis;
 display: inline-block;
+vertical-align: text-top;
 }
 
 .console-message-location.call-frame > .subtitle > .source-link {






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [274575] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [274575] trunk/Source/WebInspectorUI








Revision 274575
Author nvasil...@apple.com
Date 2021-03-17 11:56:31 -0700 (Wed, 17 Mar 2021)


Log Message
Web Inspector: remove experimental setting and enable "grid" badges
https://bugs.webkit.org/show_bug.cgi?id=223209


Reviewed by BJ Burg.

* UserInterface/Base/Setting.js:
* UserInterface/Views/DOMTreeElement.js:
(WI.DOMTreeElement.prototype._updateGridBadge):
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (274574 => 274575)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-03-17 18:56:02 UTC (rev 274574)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-03-17 18:56:31 UTC (rev 274575)
@@ -1,3 +1,17 @@
+2021-03-17  Nikita Vasilyev  
+
+Web Inspector: remove experimental setting and enable "grid" badges
+https://bugs.webkit.org/show_bug.cgi?id=223209
+
+
+Reviewed by BJ Burg.
+
+* UserInterface/Base/Setting.js:
+* UserInterface/Views/DOMTreeElement.js:
+(WI.DOMTreeElement.prototype._updateGridBadge):
+* UserInterface/Views/SettingsTabContentView.js:
+(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
+
 2021-03-15  Nikita Vasilyev  
 
 Web Inspector: remove experimental setting and enable Layout sidebar


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (274574 => 274575)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-03-17 18:56:02 UTC (rev 274574)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-03-17 18:56:31 UTC (rev 274575)
@@ -228,7 +228,6 @@
 experimentalEnablePreviewFeatures: new WI.Setting("experimental-enable-preview-features", true),
 experimentalEnableStylesJumpToEffective: new WI.Setting("experimental-styles-jump-to-effective", false),
 experimentalEnableStylesJumpToVariableDeclaration: new WI.Setting("experimental-styles-jump-to-variable-declaration", false),
-experimentalEnableGridBadges: new WI.Setting("experimental-enable-grid-badges", false),
 experimentalCollapseBlackboxedCallFrames: new WI.Setting("experimental-collapse-blackboxed-call-frames", false),
 
 // Protocol


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js (274574 => 274575)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js	2021-03-17 18:56:02 UTC (rev 274574)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js	2021-03-17 18:56:31 UTC (rev 274575)
@@ -2012,9 +2012,6 @@
 
 _updateGridBadge()
 {
-if (!WI.settings.experimentalEnableGridBadges.value)
-return;
-
 if (!this.listItemElement || this._elementCloseTag)
 return;
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js (274574 => 274575)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2021-03-17 18:56:02 UTC (rev 274574)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2021-03-17 18:56:31 UTC (rev 274575)
@@ -398,7 +398,6 @@
 let stylesGroup = experimentalSettingsView.addGroup(WI.UIString("Styles:"));
 stylesGroup.addSetting(WI.settings.experimentalEnableStylesJumpToEffective, WI.UIString("Show jump to effective property button"));
 stylesGroup.addSetting(WI.settings.experimentalEnableStylesJumpToVariableDeclaration, WI.UIString("Show jump to variable declaration button"));
-stylesGroup.addSetting(WI.settings.experimentalEnableGridBadges, WI.unlocalizedString("Show \"grid\" badges"));
 
 experimentalSettingsView.addSeparator();
 }
@@ -428,7 +427,6 @@
 listenForChange(WI.settings.experimentalEnablePreviewFeatures);
 
 if (hasCSSDomain) {
-listenForChange(WI.settings.experimentalEnableGridBadges);
 listenForChange(WI.settings.experimentalEnableStylesJumpToEffective);
 listenForChange(WI.settings.experimentalEnableStylesJumpToVariableDeclaration);
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [274466] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [274466] trunk/Source/WebInspectorUI








Revision 274466
Author nvasil...@apple.com
Date 2021-03-15 22:55:19 -0700 (Mon, 15 Mar 2021)


Log Message
Web Inspector: remove experimental setting and enable Layout sidebar
https://bugs.webkit.org/show_bug.cgi?id=221246


Reviewed by BJ Burg.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Base/Setting.js:
* UserInterface/Views/ElementsTabContentView.js:
(WI.ElementsTabContentView):
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Views/ElementsTabContentView.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (274465 => 274466)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-03-16 05:08:03 UTC (rev 274465)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-03-16 05:55:19 UTC (rev 274466)
@@ -1,3 +1,18 @@
+2021-03-15  Nikita Vasilyev  
+
+Web Inspector: remove experimental setting and enable Layout sidebar
+https://bugs.webkit.org/show_bug.cgi?id=221246
+
+
+Reviewed by BJ Burg.
+
+* Localizations/en.lproj/localizedStrings.js:
+* UserInterface/Base/Setting.js:
+* UserInterface/Views/ElementsTabContentView.js:
+(WI.ElementsTabContentView):
+* UserInterface/Views/SettingsTabContentView.js:
+(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
+
 2021-03-15  Patrick Angle  
 
 Web Inspector: `Styles` sidebar pseudo-class checkboxes appear cramped after resizing window at narrow widths


Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (274465 => 274466)

--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2021-03-16 05:08:03 UTC (rev 274465)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2021-03-16 05:55:19 UTC (rev 274466)
@@ -1316,7 +1316,6 @@
 localizedStrings["Show Console"] = "Show Console";
 localizedStrings["Show Console tab"] = "Show Console tab";
 localizedStrings["Show Elements"] = "Show Elements";
-localizedStrings["Show Layout panel"] = "Show Layout panel";
 localizedStrings["Show Path"] = "Show Path";
 localizedStrings["Show Remaining (%d)"] = "Show Remaining (%d)";
 localizedStrings["Show Scope Chain on pause"] = "Show Scope Chain on pause";


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (274465 => 274466)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-03-16 05:08:03 UTC (rev 274465)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-03-16 05:55:19 UTC (rev 274466)
@@ -228,7 +228,6 @@
 experimentalEnablePreviewFeatures: new WI.Setting("experimental-enable-preview-features", true),
 experimentalEnableStylesJumpToEffective: new WI.Setting("experimental-styles-jump-to-effective", false),
 experimentalEnableStylesJumpToVariableDeclaration: new WI.Setting("experimental-styles-jump-to-variable-declaration", false),
-experimentalEnableLayoutPanel: new WI.Setting("experimental-enable-layout-panel", false),
 experimentalEnableGridBadges: new WI.Setting("experimental-enable-grid-badges", false),
 experimentalCollapseBlackboxedCallFrames: new WI.Setting("experimental-collapse-blackboxed-call-frames", false),
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ElementsTabContentView.js (274465 => 274466)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ElementsTabContentView.js	2021-03-16 05:08:03 UTC (rev 274465)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ElementsTabContentView.js	2021-03-16 05:55:19 UTC (rev 274466)
@@ -32,7 +32,8 @@
 WI.ComputedStyleDetailsSidebarPanel,
 ];
 
-if (WI.settings.experimentalEnableLayoutPanel.value)
+// COMPATIBILITY (iOS 14.5): `DOM.showGridOverlay` did not exist yet.
+if (InspectorBackend.hasCommand("DOM.showGridOverlay"))
 detailsSidebarPanelConstructors.push(WI.LayoutDetailsSidebarPanel);
 
 // COMPATIBILITY (iOS 14.0): `CSS.getFontDataForNode` did not exist yet.


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js (274465 => 274466)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2021-03-16 05:08:03 UTC (rev 274465)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2021-03-16 05:55:19 UTC (rev 274466)
@@ -398,7 +398,6 @@
 let stylesGroup = experimentalSettingsView.addGroup(WI.UIString("Styles:"));
 stylesGroup.addSetting(WI.settings.experimentalEnableStylesJumpToEffective, WI.UIString("Show jump to effective property button"));
 

[webkit-changes] [274268] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [274268] trunk/Source/WebInspectorUI








Revision 274268
Author nvasil...@apple.com
Date 2021-03-10 23:28:47 -0800 (Wed, 10 Mar 2021)


Log Message
Web Inspector: Add checkbox to toggle all grid overlays
https://bugs.webkit.org/show_bug.cgi?id=221924


Reviewed by BJ Burg.

* UserInterface/Controllers/OverlayManager.js:
Drive-by: remove unused getter.

* UserInterface/Views/CSSGridSection.css:
(.css-grid-section .toggle-all):
* UserInterface/Views/CSSGridSection.js:
(WI.CSSGridSection):
(WI.CSSGridSection.prototype.initialLayout):
(WI.CSSGridSection.prototype._handleToggleAllCheckboxChanged):

(WI.CSSGridSection.prototype.layout):
Drive-by: replace `Array.prototype.includes`, which runs at O(n) time, with `isGridOverlayVisible`,
which checks a Map instead.

(WI.CSSGridSection.prototype._handleGridOverlayStateChanged):
(WI.CSSGridSection.prototype._updateToggleAllCheckbox):
Optimization: minimize number of Map lookups when when at least one overlay is visible and at least one is hidden.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js
trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css
trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (274267 => 274268)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-03-11 05:59:44 UTC (rev 274267)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-03-11 07:28:47 UTC (rev 274268)
@@ -1,5 +1,31 @@
 2021-03-10  Nikita Vasilyev  
 
+Web Inspector: Add checkbox to toggle all grid overlays
+https://bugs.webkit.org/show_bug.cgi?id=221924
+
+
+Reviewed by BJ Burg.
+
+* UserInterface/Controllers/OverlayManager.js:
+Drive-by: remove unused getter.
+
+* UserInterface/Views/CSSGridSection.css:
+(.css-grid-section .toggle-all):
+* UserInterface/Views/CSSGridSection.js:
+(WI.CSSGridSection):
+(WI.CSSGridSection.prototype.initialLayout):
+(WI.CSSGridSection.prototype._handleToggleAllCheckboxChanged):
+
+(WI.CSSGridSection.prototype.layout):
+Drive-by: replace `Array.prototype.includes`, which runs at O(n) time, with `isGridOverlayVisible`,
+which checks a Map instead.
+
+(WI.CSSGridSection.prototype._handleGridOverlayStateChanged):
+(WI.CSSGridSection.prototype._updateToggleAllCheckbox):
+Optimization: minimize number of Map lookups when when at least one overlay is visible and at least one is hidden.
+
+2021-03-10  Nikita Vasilyev  
+
 Web Inspector: Syntax highlighting for JSX is incorrect
 https://bugs.webkit.org/show_bug.cgi?id=217613
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js (274267 => 274268)

--- trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js	2021-03-11 05:59:44 UTC (rev 274267)
+++ trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js	2021-03-11 07:28:47 UTC (rev 274268)
@@ -44,11 +44,6 @@
 
 // Public
 
-get nodesWithGridOverlay()
-{
-return Array.from(this._gridOverlayForNodeMap.keys());
-}
-
 showGridOverlay(domNode, {color} = {})
 {
 console.assert(!domNode.destroyed, domNode);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css (274267 => 274268)

--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css	2021-03-11 05:59:44 UTC (rev 274267)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.css	2021-03-11 07:28:47 UTC (rev 274268)
@@ -62,3 +62,7 @@
 font-weight: 500;
 color: var(--text-color)
 }
+
+.css-grid-section .toggle-all {
+margin-inline-end: 7px;
+}


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js (274267 => 274268)

--- trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js	2021-03-11 05:59:44 UTC (rev 274267)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js	2021-03-11 07:28:47 UTC (rev 274268)
@@ -35,6 +35,8 @@
 
 this._gridNodeSet = new Set;
 this._checkboxElementByNodeMap = new WeakMap;
+this._toggleAllCheckboxElement = null;
+this._suppressUpdateToggleAllCheckbox = false;
 }
 
 // Public
@@ -78,12 +80,31 @@
 
 let listHeading = this.element.appendChild(document.createElement("h2"));
 listHeading.classList.add("heading");
-listHeading.textContent = WI.UIString("Grid Overlays", "Page Overlays @ Layout Sidebar Section Header", "Heading for list of grid nodes");
 
+let label = listHeading.createChild("label");
+this._toggleAllCheckboxElement = label.createChild("input", "toggle-all");
+this._toggleAllCheckboxElement.type = "checkbox";
+this._toggleAllCheckboxElement.addEventListener("change", this._handleToggleAllCheckboxChanged.bind(this));
+
+label.append(WI.UIString("Grid 

[webkit-changes] [274230] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [274230] trunk/Source/WebInspectorUI








Revision 274230
Author nvasil...@apple.com
Date 2021-03-10 12:43:35 -0800 (Wed, 10 Mar 2021)


Log Message
Web Inspector: Syntax highlighting for JSX is incorrect
https://bugs.webkit.org/show_bug.cgi?id=217613


Reviewed by BJ Burg.

Out of the box, React specifies the "js" extension for JSX files.
Use JSX mode for source map resources with the "js" extension. This
appears to match what the other browsers' developer tools do.

* UserInterface/Models/SourceMapResource.js:
(WI.SourceMapResource):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/SourceMapResource.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (274229 => 274230)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-03-10 20:36:30 UTC (rev 274229)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-03-10 20:43:35 UTC (rev 274230)
@@ -1,3 +1,18 @@
+2021-03-10  Nikita Vasilyev  
+
+Web Inspector: Syntax highlighting for JSX is incorrect
+https://bugs.webkit.org/show_bug.cgi?id=217613
+
+
+Reviewed by BJ Burg.
+
+Out of the box, React specifies the "js" extension for JSX files.
+Use JSX mode for source map resources with the "js" extension. This
+appears to match what the other browsers' developer tools do.
+
+* UserInterface/Models/SourceMapResource.js:
+(WI.SourceMapResource):
+
 2021-03-10  Razvan Caliman  
 
 Web Inspector: CSS Grid Inspector clean-up


Modified: trunk/Source/WebInspectorUI/UserInterface/Models/SourceMapResource.js (274229 => 274230)

--- trunk/Source/WebInspectorUI/UserInterface/Models/SourceMapResource.js	2021-03-10 20:36:30 UTC (rev 274229)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/SourceMapResource.js	2021-03-10 20:43:35 UTC (rev 274230)
@@ -36,9 +36,11 @@
 
 var inheritedMIMEType = this._sourceMap.originalSourceCode instanceof WI.Resource ? this._sourceMap.originalSourceCode.syntheticMIMEType : null;
 
-var fileExtension = WI.fileExtensionForURL(url) || "";
-var fileExtensionMIMEType = WI.mimeTypeForFileExtension(fileExtension, true);
+let fileExtension = WI.fileExtensionForURL(url) || "";
 
+// React serves JSX resources with "js" extension.
+let fileExtensionMIMEType = fileExtension === "js" ? "text/jsx" : WI.mimeTypeForFileExtension(fileExtension, true);
+
 // FIXME: This is a layering violation. It should use a helper function on the
 // Resource base-class to set _mimeType and _type.
 this._mimeType = fileExtensionMIMEType || inheritedMIMEType || "text/_javascript_";






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [273992] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [273992] trunk/Source/WebInspectorUI








Revision 273992
Author nvasil...@apple.com
Date 2021-03-05 11:54:19 -0800 (Fri, 05 Mar 2021)


Log Message
Web Inspector: border color of "grid" badge should match color of corresponding outline
https://bugs.webkit.org/show_bug.cgi?id=222747


Reviewed by BJ Burg.

* UserInterface/Views/DOMTreeElement.css:
(.tree-outline.dom .badge-css-grid):
Drive-by: decrease the font size and align the badge in the middle of the selected tree element (i.e. keep 1px space
above and below the badge).

(body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid):
(@media (prefers-color-scheme: dark) .tree-outline.dom .badge-css-grid):
* UserInterface/Views/DOMTreeElement.js:
(WI.DOMTreeElement.prototype._updateGridBadgeStatus):
For text and background color, only use the hue of the selected color to keep "grid" text always readable.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.css
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (273991 => 273992)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-03-05 19:51:26 UTC (rev 273991)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-03-05 19:54:19 UTC (rev 273992)
@@ -1,3 +1,22 @@
+2021-03-05  Nikita Vasilyev  
+
+Web Inspector: border color of "grid" badge should match color of corresponding outline
+https://bugs.webkit.org/show_bug.cgi?id=222747
+
+
+Reviewed by BJ Burg.
+
+* UserInterface/Views/DOMTreeElement.css:
+(.tree-outline.dom .badge-css-grid):
+Drive-by: decrease the font size and align the badge in the middle of the selected tree element (i.e. keep 1px space
+above and below the badge).
+
+(body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid):
+(@media (prefers-color-scheme: dark) .tree-outline.dom .badge-css-grid):
+* UserInterface/Views/DOMTreeElement.js:
+(WI.DOMTreeElement.prototype._updateGridBadgeStatus):
+For text and background color, only use the hue of the selected color to keep "grid" text always readable.
+
 2021-03-04  Razvan Caliman  
 
 Web Inspector: Persist CSS Grid overlay colors


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.css (273991 => 273992)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.css	2021-03-05 19:51:26 UTC (rev 273991)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.css	2021-03-05 19:54:19 UTC (rev 273992)
@@ -27,14 +27,15 @@
 /* Using sans-serif San Francisco font here creates a badge 1px taller than the selected
 area. Use the same monospace font as the rest of the DOM tree outline. */
 
-font-size: 10px;
-line-height: 10px;
+font-size: 8px;
+vertical-align: 1px;
 color: var(--text-color);
-background: hsla(0, 0%, 0%, 0.05);
+background: hsla(0, 0%, 95%, 0.8);
 border: 1px solid hsla(0, 0%, var(--foreground-lightness), 0.1);
 border-radius: 3px;
 margin-left: 3px;
 padding: 0 2px;
+box-shadow: 0 0 1px hsla(0, 0%, 0%, 0.5);
 }
 
 .tree-outline.dom .badge-css-grid.activated {
@@ -42,27 +43,15 @@
 color: white;
 }
 
-.tree-outline.dom li.selected .badge-css-grid {
-color: hsla(0, 0%, var(--foreground-lightness), 0.5);
-background-color: transparent;
-}
-
-.tree-outline.dom li.selected .badge-css-grid.activated {
-background: var(--glyph-color-disabled);
-color: white;
-}
-
 body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid {
-border-color: hsla(0, 0%, 100%, 0.2);
+/* Override `li.selected * {color: inherited}` from DOMTreeOutline.css */
+color: var(--text-color);
 }
 
-body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid.activated {
-background: hsla(0, 0%, 100%, 0.3);
-}
 
 @media (prefers-color-scheme: dark) {
 .tree-outline.dom .badge-css-grid {
-background: hsla(0, 0%, 100%, 0.05);
+background: hsla(0, 0%, 30%, 0.8);
 border-color: hsla(0, 0%, 100%, 0.1);
 }
 }


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js (273991 => 273992)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js	2021-03-05 19:51:26 UTC (rev 273991)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js	2021-03-05 19:54:19 UTC (rev 273992)
@@ -2057,7 +2057,17 @@
 if (!this._gridBadgeElement)
 return;
 
-this._gridBadgeElement.classList.toggle("activated", WI.overlayManager.isGridOverlayVisible(this.representedObject));
+let isGridVisible = WI.overlayManager.isGridOverlayVisible(this.representedObject);
+

[webkit-changes] [273164] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [273164] trunk/Source/WebInspectorUI








Revision 273164
Author nvasil...@apple.com
Date 2021-02-19 13:35:05 -0800 (Fri, 19 Feb 2021)


Log Message
Web Inspector: CSS Grid Inspector: use a color palette for default grid overlay colors
https://bugs.webkit.org/show_bug.cgi?id=222161

Reviewed by Devin Rousso.

Define a 5-color palette.

* UserInterface/Controllers/OverlayManager.js:
(WI.OverlayManager):
(WI.OverlayManager.prototype.showGridOverlay):
(WI.OverlayManager.prototype.colorForNode):
(WI.OverlayManager.prototype._handleMainResourceDidChange):
* UserInterface/Views/CSSGridSection.js:
(WI.CSSGridSection.prototype.layout):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js
trunk/Source/WebInspectorUI/UserInterface/Views/CSSGridSection.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (273163 => 273164)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-02-19 21:28:52 UTC (rev 273163)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-02-19 21:35:05 UTC (rev 273164)
@@ -1,3 +1,20 @@
+2021-02-19  Nikita Vasilyev  
+
+Web Inspector: CSS Grid Inspector: use a color palette for default grid overlay colors
+https://bugs.webkit.org/show_bug.cgi?id=222161
+
+Reviewed by Devin Rousso.
+
+Define a 5-color palette.
+
+* UserInterface/Controllers/OverlayManager.js:
+(WI.OverlayManager):
+(WI.OverlayManager.prototype.showGridOverlay):
+(WI.OverlayManager.prototype.colorForNode):
+(WI.OverlayManager.prototype._handleMainResourceDidChange):
+* UserInterface/Views/CSSGridSection.js:
+(WI.CSSGridSection.prototype.layout):
+
 2021-02-19  Razvan Caliman  
 
 Web Inspector: Truncate long node display names in Grid Overlay list


Modified: trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js (273163 => 273164)

--- trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js	2021-02-19 21:28:52 UTC (rev 273163)
+++ trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js	2021-02-19 21:35:05 UTC (rev 273164)
@@ -31,11 +31,16 @@
 
 this._gridOverlayForNodeMap = new Map;
 
+// Can't reuse `this._gridOverlayForNodeMap` because nodes are removed from it when overlay isn't visible.
+this._colorForNodeMap = new WeakMap;
+this._nextDOMNodeColorIndex = 0;
+
 WI.settings.gridOverlayShowExtendedGridLines.addEventListener(WI.Setting.Event.Changed, this._handleGridSettingChanged, this);
 WI.settings.gridOverlayShowLineNames.addEventListener(WI.Setting.Event.Changed, this._handleGridSettingChanged, this);
 WI.settings.gridOverlayShowLineNumbers.addEventListener(WI.Setting.Event.Changed, this._handleGridSettingChanged, this);
 WI.settings.gridOverlayShowTrackSizes.addEventListener(WI.Setting.Event.Changed, this._handleGridSettingChanged, this);
 WI.settings.gridOverlayShowAreaNames.addEventListener(WI.Setting.Event.Changed, this._handleGridSettingChanged, this);
+WI.Frame.addEventListener(WI.Frame.Event.MainResourceDidChange, this._handleMainResourceDidChange, this);
 }
 
 // Public
@@ -55,8 +60,7 @@
 console.assert(!color || color instanceof WI.Color, color);
 console.assert(domNode.layoutContextType === WI.DOMNode.LayoutContextType.Grid, domNode.layoutContextType);
 
-color ||= WI.Color.fromString("magenta"); // fallback color
-
+color ||= this.colorForNode(domNode);
 let target = WI.assumingMainTarget();
 let commandArguments = {
 nodeId: domNode.id,
@@ -71,6 +75,7 @@
 
 let overlay = {domNode, ...commandArguments};
 this._gridOverlayForNodeMap.set(domNode, overlay);
+this._colorForNodeMap.set(domNode, color);
 
 domNode.addEventListener(WI.DOMNode.Event.LayoutContextTypeChanged, this._handleLayoutContextTypeChanged, this);
 this.dispatchEventToListeners(WI.OverlayManager.Event.GridOverlayShown, overlay);
@@ -108,6 +113,27 @@
 this.showGridOverlay(domNode);
 }
 
+colorForNode(domNode)
+{
+let color = this._colorForNodeMap.get(domNode);
+if (color)
+return color;
+
+const hslColors = [
+[329, 91, 70],
+[207, 96, 69],
+[92, 90, 64],
+[291, 73, 68],
+[40, 97, 57],
+];
+
+color = new WI.Color(WI.Color.Format.HSL, hslColors[this._nextDOMNodeColorIndex]);
+this._colorForNodeMap.set(domNode, color);
+this._nextDOMNodeColorIndex = (this._nextDOMNodeColorIndex + 1) % hslColors.length;
+
+return color;
+}
+
 // Private
 
 _handleLayoutContextTypeChanged(event)
@@ -129,6 +155,20 @@
 this.showGridOverlay(domNode, {color: overlay.color});
 }
 }
+
+_handleMainResourceDidChange(event)
+{
+// Consider the following scenario:
+

[webkit-changes] [273097] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [273097] trunk/Source/WebInspectorUI








Revision 273097
Author nvasil...@apple.com
Date 2021-02-18 12:51:51 -0800 (Thu, 18 Feb 2021)


Log Message
Web Inspector: Elements: show badges for CSS Grid container elements
https://bugs.webkit.org/show_bug.cgi?id=221370

Reviewed by BJ Burg.

Clicking "grid" CSS badge shows/hides the grid overlay for the corresponding element.

* UserInterface/Base/Setting.js:
* UserInterface/Controllers/OverlayManager.js:
(WI.OverlayManager.prototype.isGridOverlayVisible):
(WI.OverlayManager.prototype.toggleGridOverlay):

* UserInterface/Main.html:
* UserInterface/Views/DOMTreeElement.css: Added.
(.tree-outline.dom .badge-css-grid):
(.tree-outline.dom .badge-css-grid.activated):
(.tree-outline.dom li.selected .badge-css-grid):
(.tree-outline.dom li.selected .badge-css-grid.activated):
(body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid):
(body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid.activated):
(@media (prefers-color-scheme: dark) .tree-outline.dom .badge-css-grid):

* UserInterface/Views/DOMTreeElement.js:
(WI.DOMTreeElement):
(WI.DOMTreeElement.prototype.onattach):
(WI.DOMTreeElement.prototype.ondetach):
(WI.DOMTreeElement.prototype.updateTitle):
(WI.DOMTreeElement.prototype._updateGridBadge):
(WI.DOMTreeElement.prototype._gridBadgeClicked):
(WI.DOMTreeElement.prototype._gridBadgeDoubleClicked):
(WI.DOMTreeElement.prototype._updateGridBadgeStatus):
(WI.DOMTreeElement.prototype._handleLayoutContextTypeChanged):

* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Controllers/OverlayManager.js
trunk/Source/WebInspectorUI/UserInterface/Main.html
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js


Added Paths

trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeElement.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (273096 => 273097)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-02-18 20:46:59 UTC (rev 273096)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-02-18 20:51:51 UTC (rev 273097)
@@ -1,3 +1,41 @@
+2021-02-18  Nikita Vasilyev  
+
+Web Inspector: Elements: show badges for CSS Grid container elements
+https://bugs.webkit.org/show_bug.cgi?id=221370
+
+Reviewed by BJ Burg.
+
+Clicking "grid" CSS badge shows/hides the grid overlay for the corresponding element.
+
+* UserInterface/Base/Setting.js:
+* UserInterface/Controllers/OverlayManager.js:
+(WI.OverlayManager.prototype.isGridOverlayVisible):
+(WI.OverlayManager.prototype.toggleGridOverlay):
+
+* UserInterface/Main.html:
+* UserInterface/Views/DOMTreeElement.css: Added.
+(.tree-outline.dom .badge-css-grid):
+(.tree-outline.dom .badge-css-grid.activated):
+(.tree-outline.dom li.selected .badge-css-grid):
+(.tree-outline.dom li.selected .badge-css-grid.activated):
+(body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid):
+(body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .badge-css-grid.activated):
+(@media (prefers-color-scheme: dark) .tree-outline.dom .badge-css-grid):
+
+* UserInterface/Views/DOMTreeElement.js:
+(WI.DOMTreeElement):
+(WI.DOMTreeElement.prototype.onattach):
+(WI.DOMTreeElement.prototype.ondetach):
+(WI.DOMTreeElement.prototype.updateTitle):
+(WI.DOMTreeElement.prototype._updateGridBadge):
+(WI.DOMTreeElement.prototype._gridBadgeClicked):
+(WI.DOMTreeElement.prototype._gridBadgeDoubleClicked):
+(WI.DOMTreeElement.prototype._updateGridBadgeStatus):
+(WI.DOMTreeElement.prototype._handleLayoutContextTypeChanged):
+
+* UserInterface/Views/SettingsTabContentView.js:
+(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
+
 2021-02-18  Razvan Caliman  
 
 Web Inspector: Update .eslintrc to account for ECMAScript 2021


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (273096 => 273097)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-02-18 20:46:59 UTC (rev 273096)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-02-18 20:51:51 UTC (rev 273097)
@@ -229,6 +229,7 @@
 experimentalEnableStylesJumpToEffective: new WI.Setting("experimental-styles-jump-to-effective", false),
 experimentalEnableStylesJumpToVariableDeclaration: new WI.Setting("experimental-styles-jump-to-variable-declaration", false),
 experimentalEnableLayoutPanel: new 

[webkit-changes] [272768] trunk/Source

[nvasilyev]

Title: [272768] trunk/Source








Revision 272768
Author nvasil...@apple.com
Date 2021-02-11 18:56:51 -0800 (Thu, 11 Feb 2021)


Log Message
Web Inspector: "Show Extended Gridlines" option for grid overlay does not work
https://bugs.webkit.org/show_bug.cgi?id=221775

Reviewed by Devin Rousso.

Replace all mentions of "Gridlines" with "GridLines" (camelcase).

Source/_javascript_Core:

* inspector/protocol/DOM.json:

Source/WebCore:

* inspector/InspectorOverlay.h:
* inspector/agents/InspectorDOMAgent.cpp:
(WebCore::InspectorDOMAgent::showGridOverlay):
* inspector/agents/InspectorDOMAgent.h:

Modified Paths

trunk/Source/_javascript_Core/ChangeLog
trunk/Source/_javascript_Core/inspector/protocol/DOM.json
trunk/Source/WebCore/ChangeLog
trunk/Source/WebCore/inspector/InspectorOverlay.h
trunk/Source/WebCore/inspector/agents/InspectorDOMAgent.cpp
trunk/Source/WebCore/inspector/agents/InspectorDOMAgent.h




Diff

Modified: trunk/Source/_javascript_Core/ChangeLog (272767 => 272768)

--- trunk/Source/_javascript_Core/ChangeLog	2021-02-12 02:19:42 UTC (rev 272767)
+++ trunk/Source/_javascript_Core/ChangeLog	2021-02-12 02:56:51 UTC (rev 272768)
@@ -1,3 +1,14 @@
+2021-02-11  Nikita Vasilyev  
+
+Web Inspector: "Show Extended Gridlines" option for grid overlay does not work
+https://bugs.webkit.org/show_bug.cgi?id=221775
+
+Reviewed by Devin Rousso.
+
+Replace all mentions of "Gridlines" with "GridLines" (camelcase).
+
+* inspector/protocol/DOM.json:
+
 2021-02-11  Mark Lam  
 
 CodeBlock::propagateTransitions() should also handle OpSetPrivateBrand's LLInt IC.


Modified: trunk/Source/_javascript_Core/inspector/protocol/DOM.json (272767 => 272768)

--- trunk/Source/_javascript_Core/inspector/protocol/DOM.json	2021-02-12 02:19:42 UTC (rev 272767)
+++ trunk/Source/_javascript_Core/inspector/protocol/DOM.json	2021-02-12 02:56:51 UTC (rev 272768)
@@ -503,7 +503,7 @@
 { "name": "gridColor", "$ref": "RGBAColor", "description": "The primary color to use for the grid overlay." },
 { "name": "showLineNames", "type": "boolean", "optional": true, "description": "Show labels for grid line names. If not specified, the default value is false." },
 { "name": "showLineNumbers", "type": "boolean", "optional": true, "description": "Show labels for grid line numbers. If not specified, the default value is false." },
-{ "name": "showExtendedGridlines", "type": "boolean", "optional": true, "description": "Show grid lines that extend beyond the bounds of the grid. If not specified, the default value is false." },
+{ "name": "showExtendedGridLines", "type": "boolean", "optional": true, "description": "Show grid lines that extend beyond the bounds of the grid. If not specified, the default value is false." },
 { "name": "showTrackSizes", "type": "boolean", "optional": true, "description": "Show grid track size information. If not specified, the default value is false." },
 { "name": "showAreaNames", "type": "boolean", "optional": true, "description": "Show labels for grid area names. If not specified, the default value is false." }
 ]


Modified: trunk/Source/WebCore/ChangeLog (272767 => 272768)

--- trunk/Source/WebCore/ChangeLog	2021-02-12 02:19:42 UTC (rev 272767)
+++ trunk/Source/WebCore/ChangeLog	2021-02-12 02:56:51 UTC (rev 272768)
@@ -1,3 +1,17 @@
+2021-02-11  Nikita Vasilyev  
+
+Web Inspector: "Show Extended Gridlines" option for grid overlay does not work
+https://bugs.webkit.org/show_bug.cgi?id=221775
+
+Reviewed by Devin Rousso.
+
+Replace all mentions of "Gridlines" with "GridLines" (camelcase).
+
+* inspector/InspectorOverlay.h:
+* inspector/agents/InspectorDOMAgent.cpp:
+(WebCore::InspectorDOMAgent::showGridOverlay):
+* inspector/agents/InspectorDOMAgent.h:
+
 2021-02-11  Alex Christensen  
 
 REGRESSION(r272293) WebGL 1.0.2 test expectations say HTTPS


Modified: trunk/Source/WebCore/inspector/InspectorOverlay.h (272767 => 272768)

--- trunk/Source/WebCore/inspector/InspectorOverlay.h	2021-02-12 02:19:42 UTC (rev 272767)
+++ trunk/Source/WebCore/inspector/InspectorOverlay.h	2021-02-12 02:56:51 UTC (rev 272768)
@@ -115,7 +115,7 @@
 Color gridColor;
 bool showLineNames;
 bool showLineNumbers;
-bool showExtendedGridlines;
+bool showExtendedGridLines;
 bool showTrackSizes;
 bool showAreaNames;
 };


Modified: trunk/Source/WebCore/inspector/agents/InspectorDOMAgent.cpp (272767 => 272768)

--- trunk/Source/WebCore/inspector/agents/InspectorDOMAgent.cpp	2021-02-12 02:19:42 UTC (rev 272767)
+++ trunk/Source/WebCore/inspector/agents/InspectorDOMAgent.cpp	2021-02-12 02:56:51 UTC (rev 272768)
@@ -1477,7 +1477,7 @@
 return { };
 }
 
-Inspector::Protocol::ErrorStringOr 

[webkit-changes] [272371] trunk

[nvasilyev]

Title: [272371] trunk








Revision 272371
Author nvasil...@apple.com
Date 2021-02-04 09:16:03 -0800 (Thu, 04 Feb 2021)


Log Message
Web Inspector: Collapse blackboxed call frames in Sources
https://bugs.webkit.org/show_bug.cgi?id=216897

Reviewed by Devin Rousso.

Source/WebInspectorUI:

Stack traces often have dozens of blackboxed call frames when using blackboxing for JS-frameworks such as React.js.
It makes it hard to see more relevant non-framework code.

To improve this, introduce "Collapse blackboxed call frames" experimental setting, that collapses adjacent
blackboxed call frames into expandable items.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Base/Setting.js:
* UserInterface/Base/Utilities.js:
* UserInterface/Images/TypeIcons.svg:
* UserInterface/Main.html:
* UserInterface/Models/CallFrame.js:
(WI.CallFrame):
(WI.CallFrame.prototype.get blackboxed):
(WI.CallFrame.fromDebuggerPayload):
(WI.CallFrame.fromPayload):
* UserInterface/Views/BlackboxedGroupTreeElement.css: Added.
(.tree-outline .item.blackboxed-group):
(.tree-outline .item.blackboxed-group .icon):
(@media (prefers-color-scheme: dark) .tree-outline .item.blackboxed-group .icon):
* UserInterface/Views/BlackboxedGroupTreeElement.js: Added.
(WI.BlackboxedGroupTreeElement):
(WI.BlackboxedGroupTreeElement.prototype.expand):
* UserInterface/Views/CallFrameTreeElement.css:
(.tree-outline .item.call-frame.blackboxed:not(.selected)):
* UserInterface/Views/CallFrameView.css:
(.call-frame.blackboxed > .title,):
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
* UserInterface/Views/SourcesNavigationSidebarPanel.js:
(WI.SourcesNavigationSidebarPanel.prototype._handleTreeSelectionDidChange):
* UserInterface/Views/ThreadTreeElement.js:
(WI.ThreadTreeElement.prototype.refresh):
* UserInterface/Views/TreeElement.js:
(WI.TreeElement.treeElementToggled):
This is necessary since `WI.BlackboxedGroupTreeElement` removes itself when expanded.

* UserInterface/Views/Variables.css:
(:root):

LayoutTests:

Test Array.prototype.groupBy.

* inspector/unit-tests/array-utilities-expected.txt:
* inspector/unit-tests/array-utilities.html:

Modified Paths

trunk/LayoutTests/ChangeLog
trunk/LayoutTests/inspector/unit-tests/array-utilities-expected.txt
trunk/LayoutTests/inspector/unit-tests/array-utilities.html
trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js
trunk/Source/WebInspectorUI/UserInterface/Images/TypeIcons.svg
trunk/Source/WebInspectorUI/UserInterface/Main.html
trunk/Source/WebInspectorUI/UserInterface/Models/CallFrame.js
trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameTreeElement.css
trunk/Source/WebInspectorUI/UserInterface/Views/CallFrameView.css
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js
trunk/Source/WebInspectorUI/UserInterface/Views/SourcesNavigationSidebarPanel.js
trunk/Source/WebInspectorUI/UserInterface/Views/ThreadTreeElement.js
trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js
trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css


Added Paths

trunk/Source/WebInspectorUI/UserInterface/Views/BlackboxedGroupTreeElement.css
trunk/Source/WebInspectorUI/UserInterface/Views/BlackboxedGroupTreeElement.js




Diff

Modified: trunk/LayoutTests/ChangeLog (272370 => 272371)

--- trunk/LayoutTests/ChangeLog	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/LayoutTests/ChangeLog	2021-02-04 17:16:03 UTC (rev 272371)
@@ -1,3 +1,15 @@
+2021-02-04  Nikita Vasilyev  
+
+Web Inspector: Collapse blackboxed call frames in Sources
+https://bugs.webkit.org/show_bug.cgi?id=216897
+
+Reviewed by Devin Rousso.
+
+Test Array.prototype.groupBy.
+
+* inspector/unit-tests/array-utilities-expected.txt:
+* inspector/unit-tests/array-utilities.html:
+
 2021-02-04  Aditya Keerthi  
 
 [macOS] Selecting a date on datetime-local inputs unexpectedly adds second and millisecond fields


Modified: trunk/LayoutTests/inspector/unit-tests/array-utilities-expected.txt (272370 => 272371)

--- trunk/LayoutTests/inspector/unit-tests/array-utilities-expected.txt	2021-02-04 16:56:30 UTC (rev 272370)
+++ trunk/LayoutTests/inspector/unit-tests/array-utilities-expected.txt	2021-02-04 17:16:03 UTC (rev 272371)
@@ -105,6 +105,16 @@
 [1,2,3] => [[1,2],[2,3]]
 [1,2,3,4] => [[1,2],[2,3],[3,4]]
 
+-- Running test case: Array.prototype.groupBy
+[0,1,0,1,1,0,1,1,1,0] => [0,[1],0,[1,1],0,[1,1,1],0]
+[0,1,0,1,1,0,1,1,1,0] => [0,1,0,[1,1],0,[1,1,1],0]
+[0,1,0,1,1,0,1,1,1,0] => [0,1,0,1,1,0,[1,1,1],0]
+[0,1,0,1,1,0,1,1,1,0] => [0,1,0,1,1,0,1,1,1,0]
+[0,1,0,1,1,0,1,1,1] => [0,[1],0,[1,1],0,[1,1,1]]
+[0,1,0,1,1,0,1,1,1] => [0,1,0,[1,1],0,[1,1,1]]
+[0,1,0,1,1,0,1,1,1] => [0,1,0,1,1,0,[1,1,1]]
+[0,1,0,1,1,0,1,1,1] => 

[webkit-changes] [272182] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [272182] trunk/Source/WebInspectorUI








Revision 272182
Author nvasil...@apple.com
Date 2021-02-01 18:10:37 -0800 (Mon, 01 Feb 2021)


Log Message
Web Inspector: add Box Model into Layout panel
https://bugs.webkit.org/show_bug.cgi?id=220987

Reviewed by BJ Burg.

Add Box Model section to the experimental Layout panel.

* UserInterface/Views/LayoutDetailsSidebarPanel.js:
(WI.LayoutDetailsSidebarPanel):
(WI.LayoutDetailsSidebarPanel.prototype.get minimumWidth):
(WI.LayoutDetailsSidebarPanel.prototype.inspect):
(WI.LayoutDetailsSidebarPanel.prototype.initialLayout):
(WI.LayoutDetailsSidebarPanel.prototype.layout):
(WI.LayoutDetailsSidebarPanel.prototype._nodeStylesRefreshed):
(WI.LayoutDetailsSidebarPanel.prototype._nodeStylesNeedsRefreshed):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (272181 => 272182)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-02-02 01:03:54 UTC (rev 272181)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-02-02 02:10:37 UTC (rev 272182)
@@ -1,3 +1,21 @@
+2021-02-01  Nikita Vasilyev  
+
+Web Inspector: add Box Model into Layout panel
+https://bugs.webkit.org/show_bug.cgi?id=220987
+
+Reviewed by BJ Burg.
+
+Add Box Model section to the experimental Layout panel.
+
+* UserInterface/Views/LayoutDetailsSidebarPanel.js:
+(WI.LayoutDetailsSidebarPanel):
+(WI.LayoutDetailsSidebarPanel.prototype.get minimumWidth):
+(WI.LayoutDetailsSidebarPanel.prototype.inspect):
+(WI.LayoutDetailsSidebarPanel.prototype.initialLayout):
+(WI.LayoutDetailsSidebarPanel.prototype.layout):
+(WI.LayoutDetailsSidebarPanel.prototype._nodeStylesRefreshed):
+(WI.LayoutDetailsSidebarPanel.prototype._nodeStylesNeedsRefreshed):
+
 2021-02-01  Yusuke Suzuki  
 
 [JSC] Add @ in Error.stack if URL exists


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js (272181 => 272182)

--- trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js	2021-02-02 01:03:54 UTC (rev 272181)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js	2021-02-02 02:10:37 UTC (rev 272182)
@@ -29,11 +29,47 @@
 {
 super("layout-details", WI.UIString("Layout", "Layout @ Styles Sidebar", "Title of the CSS style panel."));
 
+this._nodeStyles = null;
 this.element.classList.add("layout-panel");
 }
 
 // Public
 
+get minimumWidth()
+{
+return this._boxModelDiagramRow?.minimumWidth ?? 0;
+}
+
+inspect(objects)
+{
+// Layout panel doesn't show when hasDOMNode is false.
+let hasDOMNode = super.inspect(objects);
+if (!hasDOMNode)
+return false;
+
+let stylesForNode = WI.cssManager.stylesForNode(this.domNode);
+stylesForNode.refreshIfNeeded().then((nodeStyles) => {
+if (nodeStyles === this._nodeStyles)
+return;
+
+if (this._nodeStyles) {
+this._nodeStyles.removeEventListener(WI.DOMNodeStyles.Event.Refreshed, this._nodeStylesRefreshed, this);
+this._nodeStyles.removeEventListener(WI.DOMNodeStyles.Event.NeedsRefresh, this._nodeStylesNeedsRefreshed, this);
+}
+
+this._nodeStyles = nodeStyles;
+
+if (this._nodeStyles) {
+this._nodeStyles.addEventListener(WI.DOMNodeStyles.Event.Refreshed, this._nodeStylesRefreshed, this);
+this._nodeStyles.addEventListener(WI.DOMNodeStyles.Event.NeedsRefresh, this._nodeStylesNeedsRefreshed, this);
+}
+
+this.needsLayout();
+});
+
+return hasDOMNode;
+}
+
 supportsDOMNode(nodeToInspect)
 {
 return nodeToInspect.nodeType() === Node.ELEMENT_NODE;
@@ -57,12 +93,18 @@
 
 initialLayout()
 {
-// FIXME: Move the Box Model section here from the Computed panel.
+this._boxModelDiagramRow = new WI.BoxModelDetailsSectionRow;
+let boxModelGroup = new WI.DetailsSectionGroup([this._boxModelDiagramRow]);
+let boxModelSection = new WI.DetailsSection("layout-box-model", WI.UIString("Box Model"), [boxModelGroup]);
+this.contentView.element.appendChild(boxModelSection.element);
 }
 
 layout()
 {
 super.layout();
+
+if (this._boxModelDiagramRow.nodeStyles !== this._nodeStyles)
+this._boxModelDiagramRow.nodeStyles = this._nodeStyles;
 }
 
 // Private
@@ -74,4 +116,16 @@
 
 this.needsLayout();
 }
+
+_nodeStylesRefreshed()
+{
+if (this.isAttached)
+this.needsLayout();
+}
+
+_nodeStylesNeedsRefreshed()
+{
+if (this.isAttached)
+this._nodeStyles?.refresh();
+}
 };






___
webkit-changes mailing 

[webkit-changes] [271874] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [271874] trunk/Source/WebInspectorUI








Revision 271874
Author nvasil...@apple.com
Date 2021-01-25 19:29:03 -0800 (Mon, 25 Jan 2021)


Log Message
Web Inspector: Add experimental setting to show Layout panel in Elements tab
https://bugs.webkit.org/show_bug.cgi?id=220954


Reviewed by BJ Burg.

Add "Show layout panel" checkbox to the Experimental settings that shows an empty
panel (for now) in Elements tab.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Base/Setting.js:
* UserInterface/Main.html:
* UserInterface/Views/ElementsTabContentView.js:
(WI.ElementsTabContentView):
* UserInterface/Views/LayoutDetailsSidebarPanel.js: Added.
(WI.LayoutDetailsSidebarPanel):
(WI.LayoutDetailsSidebarPanel.prototype.supportsDOMNode):
(WI.LayoutDetailsSidebarPanel.prototype.attached):
(WI.LayoutDetailsSidebarPanel.prototype.detached):
(WI.LayoutDetailsSidebarPanel.prototype.initialLayout):
(WI.LayoutDetailsSidebarPanel.prototype.layout):
(WI.LayoutDetailsSidebarPanel.prototype._mainResourceDidChange):
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Main.html
trunk/Source/WebInspectorUI/UserInterface/Views/ElementsTabContentView.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js


Added Paths

trunk/Source/WebInspectorUI/UserInterface/Views/LayoutDetailsSidebarPanel.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (271873 => 271874)

--- trunk/Source/WebInspectorUI/ChangeLog	2021-01-26 02:13:11 UTC (rev 271873)
+++ trunk/Source/WebInspectorUI/ChangeLog	2021-01-26 03:29:03 UTC (rev 271874)
@@ -1,3 +1,30 @@
+2021-01-25  Nikita Vasilyev  
+
+Web Inspector: Add experimental setting to show Layout panel in Elements tab
+https://bugs.webkit.org/show_bug.cgi?id=220954
+
+
+Reviewed by BJ Burg.
+
+Add "Show layout panel" checkbox to the Experimental settings that shows an empty
+panel (for now) in Elements tab.
+
+* Localizations/en.lproj/localizedStrings.js:
+* UserInterface/Base/Setting.js:
+* UserInterface/Main.html:
+* UserInterface/Views/ElementsTabContentView.js:
+(WI.ElementsTabContentView):
+* UserInterface/Views/LayoutDetailsSidebarPanel.js: Added.
+(WI.LayoutDetailsSidebarPanel):
+(WI.LayoutDetailsSidebarPanel.prototype.supportsDOMNode):
+(WI.LayoutDetailsSidebarPanel.prototype.attached):
+(WI.LayoutDetailsSidebarPanel.prototype.detached):
+(WI.LayoutDetailsSidebarPanel.prototype.initialLayout):
+(WI.LayoutDetailsSidebarPanel.prototype.layout):
+(WI.LayoutDetailsSidebarPanel.prototype._mainResourceDidChange):
+* UserInterface/Views/SettingsTabContentView.js:
+(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
+
 2021-01-21  Devin Rousso  
 
 [Apple Pay] use the first item in `shippingOptions` even when it's not `selected`


Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (271873 => 271874)

--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2021-01-26 02:13:11 UTC (rev 271873)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2021-01-26 03:29:03 UTC (rev 271874)
@@ -822,6 +822,8 @@
 /* Name of Layers Tab */
 localizedStrings["Layers Tab Name"] = "Layers";
 localizedStrings["Layout & Rendering"] = "Layout & Rendering";
+/* Title of the CSS style panel. */
+localizedStrings["Layout @ Styles Sidebar"] = "Layout";
 /* Layout phase timeline records */
 localizedStrings["Layout @ Timeline record"] = "Layout";
 localizedStrings["Layout Invalidated"] = "Layout Invalidated";
@@ -1293,6 +1295,7 @@
 localizedStrings["Show Console"] = "Show Console";
 localizedStrings["Show Console tab"] = "Show Console tab";
 localizedStrings["Show Elements"] = "Show Elements";
+localizedStrings["Show Layout panel"] = "Show Layout panel";
 localizedStrings["Show Path"] = "Show Path";
 localizedStrings["Show Remaining (%d)"] = "Show Remaining (%d)";
 localizedStrings["Show Scope Chain on pause"] = "Show Scope Chain on pause";


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (271873 => 271874)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-01-26 02:13:11 UTC (rev 271873)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2021-01-26 03:29:03 UTC (rev 271874)
@@ -223,6 +223,7 @@
 experimentalEnablePreviewFeatures: new WI.Setting("experimental-enable-preview-features", true),
 experimentalEnableStylesJumpToEffective: new WI.Setting("experimental-styles-jump-to-effective", false),
 experimentalEnableStylesJumpToVariableDeclaration: new 

[webkit-changes] [269201] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [269201] trunk/Source/WebInspectorUI








Revision 269201
Author nvasil...@apple.com
Date 2020-10-30 11:06:27 -0700 (Fri, 30 Oct 2020)


Log Message
Web Inspector: Extra closing parenthesis added after var in styles panel
https://bugs.webkit.org/show_bug.cgi?id=218295


Reviewed by Devin Rousso.

* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype._addVariableTokens):
Remove `contents.push(token)` which was adding `)`. The closing parenthesis that was already
included in rawTokens above.
Drive-by: rawTokens.slice() should never include `i` as the 2nd argument. `i` is an index of an item
in the `tokens` - a different array.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (269200 => 269201)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-10-30 17:42:47 UTC (rev 269200)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-10-30 18:06:27 UTC (rev 269201)
@@ -1,3 +1,18 @@
+2020-10-30  Nikita Vasilyev  
+
+Web Inspector: Extra closing parenthesis added after var in styles panel
+https://bugs.webkit.org/show_bug.cgi?id=218295
+
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/SpreadsheetStyleProperty.js:
+(WI.SpreadsheetStyleProperty.prototype._addVariableTokens):
+Remove `contents.push(token)` which was adding `)`. The closing parenthesis that was already
+included in rawTokens above.
+Drive-by: rawTokens.slice() should never include `i` as the 2nd argument. `i` is an index of an item
+in the `tokens` - a different array.
+
 2020-10-29  Federico Bucchi  
 
 Web Inspector: Uncaught Exception: undefined is not an object (evaluating 'value.truncate')


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js (269200 => 269201)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js	2020-10-30 17:42:47 UTC (rev 269200)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js	2020-10-30 18:06:27 UTC (rev 269201)
@@ -814,7 +814,7 @@
 if (fallbackStartIndex !== -1) {
 contents.pushAll(rawTokens.slice(variableNameIndex + 1, fallbackStartIndex));
 
-let fallbackTokens = rawTokens.slice(fallbackStartIndex, i);
+let fallbackTokens = rawTokens.slice(fallbackStartIndex);
 fallbackTokens = this._addBoxShadowTokens(fallbackTokens);
 fallbackTokens = this._addGradientTokens(fallbackTokens);
 fallbackTokens = this._addColorTokens(fallbackTokens);
@@ -823,8 +823,7 @@
 fallbackTokens = this._addVariableTokens(fallbackTokens);
 contents.pushAll(fallbackTokens);
 } else
-contents.pushAll(rawTokens.slice(variableNameIndex + 1, i));
-contents.push(token);
+contents.pushAll(rawTokens.slice(variableNameIndex + 1));
 
 let text = rawTokens.reduce((accumulator, token) => accumulator + token.value, "");
 if (this._property.ownerStyle.nodeStyles.computedStyle.resolveVariableValue(text))






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [268929] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [268929] trunk/Source/WebInspectorUI








Revision 268929
Author nvasil...@apple.com
Date 2020-10-23 11:08:16 -0700 (Fri, 23 Oct 2020)


Log Message
Web Inspector: Typo in experimentalEnableStyelsJumpToVariableDeclaration
https://bugs.webkit.org/show_bug.cgi?id=218119

Reviewed by Devin Rousso.

Replace "Styels" with "Styles".

* UserInterface/Base/Setting.js:
* UserInterface/Views/SettingsTabContentView.js:
(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty.prototype._addVariableTokens):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (268928 => 268929)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-10-23 18:03:10 UTC (rev 268928)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-10-23 18:08:16 UTC (rev 268929)
@@ -1,3 +1,18 @@
+2020-10-23  Nikita Vasilyev  
+
+Web Inspector: Typo in experimentalEnableStyelsJumpToVariableDeclaration
+https://bugs.webkit.org/show_bug.cgi?id=218119
+
+Reviewed by Devin Rousso.
+
+Replace "Styels" with "Styles".
+
+* UserInterface/Base/Setting.js:
+* UserInterface/Views/SettingsTabContentView.js:
+(WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
+* UserInterface/Views/SpreadsheetStyleProperty.js:
+(WI.SpreadsheetStyleProperty.prototype._addVariableTokens):
+
 2020-10-22  Devin Rousso  
 
 Web Inspector: REGRESSION(r266074): Sources: icon for non-_javascript_ breakpoints doesn't change when breakpoints are globally disabled


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (268928 => 268929)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2020-10-23 18:03:10 UTC (rev 268928)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2020-10-23 18:08:16 UTC (rev 268929)
@@ -221,7 +221,7 @@
 // Experimental
 experimentalEnablePreviewFeatures: new WI.Setting("experimental-enable-preview-features", true),
 experimentalEnableStylesJumpToEffective: new WI.Setting("experimental-styles-jump-to-effective", false),
-experimentalEnableStyelsJumpToVariableDeclaration: new WI.Setting("experimental-styles-jump-to-variable-declaration", false),
+experimentalEnableStylesJumpToVariableDeclaration: new WI.Setting("experimental-styles-jump-to-variable-declaration", false),
 experimentalEnableIndependentStylesPanel: new WI.Setting("experimental-independent-styles-panel", false),
 
 // Protocol


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js (268928 => 268929)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2020-10-23 18:03:10 UTC (rev 268928)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2020-10-23 18:08:16 UTC (rev 268929)
@@ -390,7 +390,7 @@
 if (hasCSSDomain) {
 let stylesGroup = experimentalSettingsView.addGroup(WI.UIString("Styles:"));
 stylesGroup.addSetting(WI.settings.experimentalEnableStylesJumpToEffective, WI.UIString("Show jump to effective property button"));
-stylesGroup.addSetting(WI.settings.experimentalEnableStyelsJumpToVariableDeclaration, WI.UIString("Show jump to variable declaration button"));
+stylesGroup.addSetting(WI.settings.experimentalEnableStylesJumpToVariableDeclaration, WI.UIString("Show jump to variable declaration button"));
 
 experimentalSettingsView.addSeparator();
 }
@@ -418,7 +418,7 @@
 
 if (hasCSSDomain) {
 listenForChange(WI.settings.experimentalEnableStylesJumpToEffective);
-listenForChange(WI.settings.experimentalEnableStyelsJumpToVariableDeclaration);
+listenForChange(WI.settings.experimentalEnableStylesJumpToVariableDeclaration);
 }
 
 listenForChange(WI.settings.experimentalEnableIndependentStylesPanel);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js (268928 => 268929)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js	2020-10-23 18:03:10 UTC (rev 268928)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js	2020-10-23 18:08:16 UTC (rev 268929)
@@ -795,7 +795,7 @@
 if (variableNameIndex !== -1) {
 let contents = rawTokens.slice(0, variableNameIndex + 1);
 
-if (WI.settings.experimentalEnableStyelsJumpToVariableDeclaration.value && this._property.ownerStyle.type !== WI.CSSStyleDeclaration.Type.Computed && this._delegate && this._delegate.spreadsheetStylePropertySelectByProperty) {
+if 

[webkit-changes] [268733] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [268733] trunk/Source/WebInspectorUI








Revision 268733
Author nvasil...@apple.com
Date 2020-10-20 08:50:04 -0700 (Tue, 20 Oct 2020)


Log Message
REGRESSION(r268691): Web Inspector: WI.Sidebar.Event.CollapsedStateChanged is undefined
https://bugs.webkit.org/show_bug.cgi?id=217939

Reviewed by Brian Burg.

r268691 added an event listener for CollapsedStateChanged, which is undefined.

* UserInterface/Base/Main.js:

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Main.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (268732 => 268733)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-10-20 15:48:13 UTC (rev 268732)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-10-20 15:50:04 UTC (rev 268733)
@@ -1,3 +1,14 @@
+2020-10-20  Nikita Vasilyev  
+
+REGRESSION(r268691): Web Inspector: WI.Sidebar.Event.CollapsedStateChanged is undefined
+https://bugs.webkit.org/show_bug.cgi?id=217939
+
+Reviewed by Brian Burg.
+
+r268691 added an event listener for CollapsedStateChanged, which is undefined.
+
+* UserInterface/Base/Main.js:
+
 2020-10-20  Philippe Normand  
 
 Web Inspector: Add setScreenSizeOverride API to the Page agent


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Main.js (268732 => 268733)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2020-10-20 15:48:13 UTC (rev 268732)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2020-10-20 15:50:04 UTC (rev 268733)
@@ -278,11 +278,11 @@
 
 WI.navigationSidebar = new WI.SingleSidebar(document.getElementById("navigation-sidebar"), WI.Sidebar.Sides.Leading, WI.UIString("Navigation", "Navigation @ Sidebar", "Label for the navigation sidebar."));
 WI.navigationSidebar.addEventListener(WI.Sidebar.Event.WidthDidChange, WI._sidebarWidthDidChange);
-WI.navigationSidebar.addEventListener(WI.Sidebar.Event.CollapsedStateChanged, WI._sidebarWidthDidChange);
+WI.navigationSidebar.addEventListener(WI.Sidebar.Event.CollapsedStateDidChange, WI._sidebarWidthDidChange);
 
 WI.detailsSidebar = new WI.MultiSidebar(document.getElementById("details-sidebar"), WI.Sidebar.Sides.Trailing, WI.UIString("Details", "Details @ Sidebar", "Label for the details sidebar."));
 WI.detailsSidebar.addEventListener(WI.Sidebar.Event.WidthDidChange, WI._sidebarWidthDidChange);
-WI.detailsSidebar.addEventListener(WI.Sidebar.Event.CollapsedStateChanged, WI._sidebarWidthDidChange);
+WI.detailsSidebar.addEventListener(WI.Sidebar.Event.CollapsedStateDidChange, WI._sidebarWidthDidChange);
 WI.detailsSidebar.addEventListener(WI.MultiSidebar.Event.MultipleSidebarsVisibleChanged, WI._sidebarWidthDidChange);
 
 WI.searchKeyboardShortcut = new WI.KeyboardShortcut(WI.KeyboardShortcut.Modifier.CommandOrControl | WI.KeyboardShortcut.Modifier.Shift, "F", WI._focusSearchField);






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [267971] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [267971] trunk/Source/WebInspectorUI








Revision 267971
Author nvasil...@apple.com
Date 2020-10-05 09:36:39 -0700 (Mon, 05 Oct 2020)


Log Message
Web Inspector: Make text selectable in CPU timeline content view
https://bugs.webkit.org/show_bug.cgi?id=216999

Reviewed by Brian Burg.

* UserInterface/Views/CPUTimelineView.css:
(.timeline-view.cpu > .content > .overview .legend):
* UserInterface/Views/CPUUsageCombinedView.css:
(.cpu-usage-combined-view > .details):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.css
trunk/Source/WebInspectorUI/UserInterface/Views/CPUUsageCombinedView.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (267970 => 267971)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-10-05 16:17:13 UTC (rev 267970)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-10-05 16:36:39 UTC (rev 267971)
@@ -1,3 +1,15 @@
+2020-10-05  Nikita Vasilyev  
+
+Web Inspector: Make text selectable in CPU timeline content view
+https://bugs.webkit.org/show_bug.cgi?id=216999
+
+Reviewed by Brian Burg.
+
+* UserInterface/Views/CPUTimelineView.css:
+(.timeline-view.cpu > .content > .overview .legend):
+* UserInterface/Views/CPUUsageCombinedView.css:
+(.cpu-usage-combined-view > .details):
+
 2020-09-28  Devin Rousso  
 
 Web Inspector: add checkbox to local override popover to allow it to skip the network


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.css (267970 => 267971)

--- trunk/Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.css	2020-10-05 16:17:13 UTC (rev 267970)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.css	2020-10-05 16:36:39 UTC (rev 267971)
@@ -132,6 +132,7 @@
 .timeline-view.cpu > .content > .overview .legend {
 -webkit-padding-start: 20px;
 text-align: start;
+-webkit-user-select: text;
 }
 
 .timeline-view.cpu > .content > .overview .legend .row {


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CPUUsageCombinedView.css (267970 => 267971)

--- trunk/Source/WebInspectorUI/UserInterface/Views/CPUUsageCombinedView.css	2020-10-05 16:17:13 UTC (rev 267970)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CPUUsageCombinedView.css	2020-10-05 16:36:39 UTC (rev 267971)
@@ -59,6 +59,7 @@
 color: var(--text-color-secondary);
 overflow: hidden;
 text-overflow: ellipsis;
+-webkit-user-select: text;
 
 --cpu-usage-combined-view-details-border-end: 1px solid var(--border-color);
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [267577] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [267577] trunk/Source/WebInspectorUI








Revision 267577
Author nvasil...@apple.com
Date 2020-09-25 10:42:26 -0700 (Fri, 25 Sep 2020)


Log Message
Uncaught Exception: TypeError: null is not an object (evaluating 'this.listItemElement.classList')
https://bugs.webkit.org/show_bug.cgi?id=216307


Reviewed by Brian Burg.

* UserInterface/Views/DOMTreeUpdater.js:
(WI.DOMTreeUpdater.prototype._updateModifiedNodes):
Don't update the element if it hasn't been attached yet. It will use the latest data when attached.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeUpdater.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (267576 => 267577)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-09-25 17:19:48 UTC (rev 267576)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-09-25 17:42:26 UTC (rev 267577)
@@ -1,3 +1,15 @@
+2020-09-25  Nikita Vasilyev  
+
+Uncaught Exception: TypeError: null is not an object (evaluating 'this.listItemElement.classList')
+https://bugs.webkit.org/show_bug.cgi?id=216307
+
+
+Reviewed by Brian Burg.
+
+* UserInterface/Views/DOMTreeUpdater.js:
+(WI.DOMTreeUpdater.prototype._updateModifiedNodes):
+Don't update the element if it hasn't been attached yet. It will use the latest data when attached.
+
 2020-09-24  Nikita Vasilyev  
 
 REGRESSION(r267379): Web Inspector: Sources navigation sidebar is empty every other time it's selected


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeUpdater.js (267576 => 267577)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeUpdater.js	2020-09-25 17:19:48 UTC (rev 267576)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeUpdater.js	2020-09-25 17:42:26 UTC (rev 267577)
@@ -124,7 +124,7 @@
 this._recentlyDeletedNodes.forEach(markNodeParentForUpdate);
 
 for (let parentTreeElement of parentElementsToUpdate) {
-if (parentTreeElement.treeOutline) {
+if (parentTreeElement.treeOutline && parentTreeElement.listItemElement) {
 parentTreeElement.updateTitle();
 parentTreeElement.updateChildren();
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [267546] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [267546] trunk/Source/WebInspectorUI








Revision 267546
Author nvasil...@apple.com
Date 2020-09-24 14:47:43 -0700 (Thu, 24 Sep 2020)


Log Message
REGRESSION(r267379): Web Inspector: Sources navigation sidebar is empty every other time it's selected
https://bugs.webkit.org/show_bug.cgi?id=216942


Reviewed by Brian Burg.

* UserInterface/Views/Sidebar.js:
(WI.Sidebar.prototype.insertSidebarPanel):
insertSidebarPanel was exiting early when sidebarPanel.parentSidebar matched the current sidebar,
creating a state when `this._sidebarPanels` is an empty array.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (267545 => 267546)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-09-24 21:36:45 UTC (rev 267545)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-09-24 21:47:43 UTC (rev 267546)
@@ -1,3 +1,16 @@
+2020-09-24  Nikita Vasilyev  
+
+REGRESSION(r267379): Web Inspector: Sources navigation sidebar is empty every other time it's selected
+https://bugs.webkit.org/show_bug.cgi?id=216942
+
+
+Reviewed by Brian Burg.
+
+* UserInterface/Views/Sidebar.js:
+(WI.Sidebar.prototype.insertSidebarPanel):
+insertSidebarPanel was exiting early when sidebarPanel.parentSidebar matched the current sidebar,
+creating a state when `this._sidebarPanels` is an empty array.
+
 2020-09-22  Brian Burg  
 
 [Cocoa] _WKInspectorDelegate should handle showing external resources


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js (267545 => 267546)

--- trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js	2020-09-24 21:36:45 UTC (rev 267545)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js	2020-09-24 21:47:43 UTC (rev 267546)
@@ -72,9 +72,10 @@
 if (!(sidebarPanel instanceof WI.SidebarPanel))
 return;
 
-console.assert(!sidebarPanel.parentSidebar);
-if (sidebarPanel.parentSidebar)
+if (sidebarPanel.parentSidebar && sidebarPanel.parentSidebar !== this) {
+console.assert(false, "Failed to insert sidebar panel", sidebarPanel);
 return;
+}
 
 console.assert(index >= 0 && index <= this._sidebarPanels.length);
 this._sidebarPanels.splice(index, 0, sidebarPanel);






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [267379] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [267379] trunk/Source/WebInspectorUI








Revision 267379
Author nvasil...@apple.com
Date 2020-09-21 16:09:18 -0700 (Mon, 21 Sep 2020)


Log Message
Web Inspector: Uncaught Exception: Missing node for given nodeId
https://bugs.webkit.org/show_bug.cgi?id=216067


Reviewed by Devin Rousso.

* UserInterface/Views/ContentBrowserTabContentView.js:
(WI.ContentBrowserTabContentView.prototype.showDetailsSidebarPanels):
Rewrite `showDetailsSidebarPanels` in such way that causes no more than one change of selectedSidebarPanel.
Previously, `removeSidebarPanel` would cause the change of selectedSidebarPanel, resulting in showing
a panel with outdated `this.domNode`.

* UserInterface/Views/DOMNodeDetailsSidebarPanel.js:
Display a useful error with a relevant location instead of a generic Connection.js error.

* UserInterface/Views/Sidebar.js:
(WI.Sidebar.prototype.removeSidebarPanel):
After removing a panel, don't select the nearest panel. There doesn't seem to be a useful case for it.
The selected panel is determined at the removeSidebarPanel callsites.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowserTabContentView.js
trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.js
trunk/Source/WebInspectorUI/UserInterface/Views/Sidebar.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (267378 => 267379)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-09-21 22:59:16 UTC (rev 267378)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-09-21 23:09:18 UTC (rev 267379)
@@ -1,3 +1,25 @@
+2020-09-21  Nikita Vasilyev  
+
+Web Inspector: Uncaught Exception: Missing node for given nodeId
+https://bugs.webkit.org/show_bug.cgi?id=216067
+
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/ContentBrowserTabContentView.js:
+(WI.ContentBrowserTabContentView.prototype.showDetailsSidebarPanels):
+Rewrite `showDetailsSidebarPanels` in such way that causes no more than one change of selectedSidebarPanel.
+Previously, `removeSidebarPanel` would cause the change of selectedSidebarPanel, resulting in showing
+a panel with outdated `this.domNode`.
+
+* UserInterface/Views/DOMNodeDetailsSidebarPanel.js:
+Display a useful error with a relevant location instead of a generic Connection.js error.
+
+* UserInterface/Views/Sidebar.js:
+(WI.Sidebar.prototype.removeSidebarPanel):
+After removing a panel, don't select the nearest panel. There doesn't seem to be a useful case for it.
+The selected panel is determined at the removeSidebarPanel callsites.
+
 2020-09-21  Patrick Angle  
 
 Web Inspector: Timelines: remove "stop requested" marker


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowserTabContentView.js (267378 => 267379)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowserTabContentView.js	2020-09-21 22:59:16 UTC (rev 267378)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ContentBrowserTabContentView.js	2020-09-21 23:09:18 UTC (rev 267379)
@@ -177,6 +177,7 @@
 this._ignoreDetailsSidebarPanelCollapsedEvent = true;
 
 let hiddenSidebarPanels = 0;
+let sidebarPanelToSelect = null;
 
 for (var i = 0; i < this.detailsSidebarPanels.length; ++i) {
 var sidebarPanel = this.detailsSidebarPanels[i];
@@ -192,7 +193,7 @@
 
 if (this._lastSelectedDetailsSidebarPanelSetting.value === sidebarPanel.identifier) {
 // Restore the sidebar panel selection if this sidebar panel was the last one selected by the user.
-WI.detailsSidebar.selectedSidebarPanel = sidebarPanel;
+sidebarPanelToSelect = sidebarPanel;
 }
 } else {
 // The sidebar panel can't inspect the current represented objects, so remove the panel and hide the toolbar item.
@@ -201,7 +202,9 @@
 }
 }
 
-if (!WI.detailsSidebar.selectedSidebarPanel && WI.detailsSidebar.sidebarPanels.length)
+if (sidebarPanelToSelect)
+WI.detailsSidebar.selectedSidebarPanel = sidebarPanelToSelect;
+else if (!WI.detailsSidebar.selectedSidebarPanel && WI.detailsSidebar.sidebarPanels.length)
 WI.detailsSidebar.selectedSidebarPanel = WI.detailsSidebar.sidebarPanels[0];
 
 if (!WI.detailsSidebar.sidebarPanels.length)


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.js (267378 => 267379)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.js	2020-09-21 22:59:16 UTC (rev 267378)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMNodeDetailsSidebarPanel.js	2020-09-21 23:09:18 UTC (rev 267379)
@@ -262,6 +262,12 @@
 const args = undefined;
 const generatePreview = false;
 

[webkit-changes] [266622] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [266622] trunk/Source/WebInspectorUI








Revision 266622
Author nvasil...@apple.com
Date 2020-09-04 11:23:01 -0700 (Fri, 04 Sep 2020)


Log Message
Web Inspector: Localization: "Low/Medium/High" strings need separate keys for different uses in the UI
https://bugs.webkit.org/show_bug.cgi?id=216136

Reviewed by Brian Burg.

Provide enough context to understand what nouns "low/medium/high" are used with
("impact" and "priority", in our case). This is necessary to determine adjectives'
grammatical gender.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Models/Resource.js:
(WI.Resource.displayNameForPriority):

* UserInterface/Views/CPUTimelineView.js:
(WI.CPUTimelineView.prototype._layoutEnergyChart):
Drive-by: merge two if blocks into one to minimize code repetition.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
trunk/Source/WebInspectorUI/UserInterface/Models/Resource.js
trunk/Source/WebInspectorUI/UserInterface/Views/CPUTimelineView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (266621 => 266622)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-09-04 18:06:25 UTC (rev 266621)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-09-04 18:23:01 UTC (rev 266622)
@@ -1,3 +1,22 @@
+2020-09-04  Nikita Vasilyev  
+
+Web Inspector: Localization: "Low/Medium/High" strings need separate keys for different uses in the UI
+https://bugs.webkit.org/show_bug.cgi?id=216136
+
+Reviewed by Brian Burg.
+
+Provide enough context to understand what nouns "low/medium/high" are used with
+("impact" and "priority", in our case). This is necessary to determine adjectives'
+grammatical gender.
+
+* Localizations/en.lproj/localizedStrings.js:
+* UserInterface/Models/Resource.js:
+(WI.Resource.displayNameForPriority):
+
+* UserInterface/Views/CPUTimelineView.js:
+(WI.CPUTimelineView.prototype._layoutEnergyChart):
+Drive-by: merge two if blocks into one to minimize code repetition.
+
 2020-09-04  Patrick Angle  
 
 Web Inspector: Localization: typo in WAI-ARIA string ("[the] element have")


Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (266621 => 266622)

--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2020-09-04 18:06:25 UTC (rev 266621)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2020-09-04 18:23:01 UTC (rev 266622)
@@ -681,7 +681,10 @@
 localizedStrings["Hide transparency grid"] = "Hide transparency grid";
 localizedStrings["Hide type information"] = "Hide type information";
 localizedStrings["Hierarchy Level"] = "Hierarchy Level";
-localizedStrings["High"] = "High";
+/* High network request priority */
+localizedStrings["High @ Network Priority"] = "High";
+/* Energy Impact: High */
+localizedStrings["High @ Timeline Energy Impact"] = "High";
 localizedStrings["Highest: %s"] = "Highest: %s";
 localizedStrings["Host"] = "Host";
 localizedStrings["ICO"] = "ICO";
@@ -792,7 +795,10 @@
 localizedStrings["Log WebSocket"] = "Log WebSocket";
 localizedStrings["Log: "] = "Log: ";
 localizedStrings["Logs"] = "Logs";
-localizedStrings["Low"] = "Low";
+/* Low network request priority */
+localizedStrings["Low @ Network Priority"] = "Low";
+/* Energy Impact: Low */
+localizedStrings["Low @ Timeline Energy Impact"] = "Low";
 localizedStrings["Lowest: %s"] = "Lowest: %s";
 localizedStrings["MIME Type"] = "MIME Type";
 localizedStrings["MIME Type:"] = "MIME Type:";
@@ -813,7 +819,10 @@
 localizedStrings["Media Event"] = "Media Event";
 localizedStrings["Media Logging:"] = "Media Logging:";
 localizedStrings["MediaSource"] = "MediaSource";
-localizedStrings["Medium"] = "Medium";
+/* Medium network request priority */
+localizedStrings["Medium @ Network Priority"] = "Medium";
+/* Energy Impact: Medium */
+localizedStrings["Medium @ Timeline Energy Impact"] = "Medium";
 localizedStrings["Memory"] = "Memory";
 localizedStrings["Memory Cache"] = "Memory Cache";
 localizedStrings["Memory usage of this canvas"] = "Memory usage of this canvas";
@@ -1416,7 +1425,8 @@
 localizedStrings["Vertex"] = "Vertex";
 localizedStrings["Vertex Shader"] = "Vertex Shader";
 localizedStrings["Vertex/Fragment Shader"] = "Vertex/Fragment Shader";
-localizedStrings["Very High"] = "Very High";
+/* Energy Impact: Very High */
+localizedStrings["Very High @ Timeline Energy Impact"] = "Very High";
 localizedStrings["View Image"] = "View Image";
 localizedStrings["View Recording"] = "View Recording";
 localizedStrings["View Shader"] = "View Shader";


Modified: trunk/Source/WebInspectorUI/UserInterface/Models/Resource.js (266621 => 266622)

--- trunk/Source/WebInspectorUI/UserInterface/Models/Resource.js	2020-09-04 18:06:25 UTC (rev 266621)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/Resource.js	2020-09-04 18:23:01 UTC (rev 266622)
@@ -239,11 +239,11 @@
 {
   

[webkit-changes] [266537] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [266537] trunk/Source/WebInspectorUI








Revision 266537
Author nvasil...@apple.com
Date 2020-09-03 12:17:00 -0700 (Thu, 03 Sep 2020)


Log Message
Web Inspector: Timelines: record button disappears when UI is narrow
https://bugs.webkit.org/show_bug.cgi?id=216133

Reviewed by Devin Rousso.

The record button is one of the most important items on Timelines toolbar.
It should always be visible.

* UserInterface/Views/TimelineTabContentView.js:
(WI.TimelineTabContentView):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/TimelineTabContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (266536 => 266537)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-09-03 18:42:32 UTC (rev 266536)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-09-03 19:17:00 UTC (rev 266537)
@@ -1,3 +1,16 @@
+2020-09-03  Nikita Vasilyev  
+
+Web Inspector: Timelines: record button disappears when UI is narrow
+https://bugs.webkit.org/show_bug.cgi?id=216133
+
+Reviewed by Devin Rousso.
+
+The record button is one of the most important items on Timelines toolbar.
+It should always be visible.
+
+* UserInterface/Views/TimelineTabContentView.js:
+(WI.TimelineTabContentView):
+
 2020-09-03  Devin Rousso  
 
 Web Inspector: allow special _javascript_ breakpoints to be configured


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineTabContentView.js (266536 => 266537)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineTabContentView.js	2020-09-03 18:42:32 UTC (rev 266536)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineTabContentView.js	2020-09-03 19:17:00 UTC (rev 266537)
@@ -46,11 +46,11 @@
 let toolTip = WI.UIString("Start recording (%s)\nCreate new recording (%s)").format(this._toggleRecordingShortcut.displayName, this._toggleNewRecordingShortcut.displayName);
 let altToolTip = WI.UIString("Stop recording (%s)").format(this._toggleRecordingShortcut.displayName);
 this._recordButton = new WI.ToggleButtonNavigationItem("record-start-stop", toolTip, altToolTip, "Images/Record.svg", "Images/Stop.svg", 13, 13);
-this._recordButton.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
+this._recordButton.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
 this._recordButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._recordButtonClicked, this);
 
 this._continueButton = new WI.ButtonNavigationItem("record-continue", WI.UIString("Continue without automatically stopping"), "Images/Resume.svg", 13, 13);
-this._continueButton.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
+this._continueButton.visibilityPriority = WI.NavigationItem.VisibilityPriority.High;
 this._continueButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._continueButtonClicked, this);
 this._continueButton.hidden = true;
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [266499] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [266499] trunk/Source/WebInspectorUI








Revision 266499
Author nvasil...@apple.com
Date 2020-09-02 19:08:10 -0700 (Wed, 02 Sep 2020)


Log Message
REGRESSION (r251254): Web Inspector: Text insertion point is invisible when editing DOM nodes
https://bugs.webkit.org/show_bug.cgi?id=210197


Reviewed by Devin Rousso.

r251254 promoted the selection area into a layer on top the the tree outline item.
Combined with the existing WebKit bug (https://webkit.org/b/213501), it introduced the regression.

This patch is largely a workaround for the WebKit bug.

Revert r251254 and instead change the background color of the shadow DOM items from
the semi-transparent gray to black (white in the dark mode) with 5% transparency, which
produced the same gray color overlayed on top of the white background of the DOM tree outline.

* UserInterface/Views/DOMTreeOutline.css:
(.tree-outline.dom):
(.tree-outline.dom li .selection-area):

(.tree-outline.dom li > :not(.selection-area)): Deleted.
Don't introduce a layer for every DOM node.

(.tree-outline.dom li.parent.shadow::after):
(.tree-outline.dom li.parent.shadow + ol.children.expanded):
(@media (prefers-color-scheme: dark) .tree-outline.dom):
(@media (prefers-color-scheme: dark) .tree-outline.dom .shadow):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (266498 => 266499)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-09-03 01:32:41 UTC (rev 266498)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-09-03 02:08:10 UTC (rev 266499)
@@ -1,3 +1,32 @@
+2020-09-02  Nikita Vasilyev  
+
+REGRESSION (r251254): Web Inspector: Text insertion point is invisible when editing DOM nodes
+https://bugs.webkit.org/show_bug.cgi?id=210197
+
+
+Reviewed by Devin Rousso.
+
+r251254 promoted the selection area into a layer on top the the tree outline item.
+Combined with the existing WebKit bug (https://webkit.org/b/213501), it introduced the regression.
+
+This patch is largely a workaround for the WebKit bug.
+
+Revert r251254 and instead change the background color of the shadow DOM items from
+the semi-transparent gray to black (white in the dark mode) with 5% transparency, which
+produced the same gray color overlayed on top of the white background of the DOM tree outline.
+
+* UserInterface/Views/DOMTreeOutline.css:
+(.tree-outline.dom):
+(.tree-outline.dom li .selection-area):
+
+(.tree-outline.dom li > :not(.selection-area)): Deleted.
+Don't introduce a layer for every DOM node.
+
+(.tree-outline.dom li.parent.shadow::after):
+(.tree-outline.dom li.parent.shadow + ol.children.expanded):
+(@media (prefers-color-scheme: dark) .tree-outline.dom):
+(@media (prefers-color-scheme: dark) .tree-outline.dom .shadow):
+
 2020-09-02  Devin Rousso  
 
 Web Inspector: allow event breakpoints to be configured when they're added


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css (266498 => 266499)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css	2020-09-03 01:32:41 UTC (rev 266498)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css	2020-09-03 02:08:10 UTC (rev 266499)
@@ -43,6 +43,8 @@
 --sublist-margin-start: 4px;
 --sublist-padding-start: 1px;
 --sublist-border-width-start: 9px;
+
+--shadow-subtree-background-color: hsla(0, 0%, 0%, 0.05);
 }
 
 .tree-outline.dom.non-selectable {
@@ -54,6 +56,7 @@
 left: 0;
 right: 0;
 height: 15px;
+z-index: -1;
 }
 
 .tree-outline.dom li.selected .selection-area {
@@ -74,11 +77,6 @@
 opacity: 0.3;
 }
 
-.tree-outline.dom li > :not(.selection-area) {
-position: relative;
-z-index: 1;
-}
-
 .tree-outline.dom li.inspected-node > span::after {
 content: " = " var(--console-saved-result-prefix) "0";
 color: var(--console-secondary-text-color);
@@ -241,11 +239,11 @@
 margin-top: -13px;
 margin-left: -2px;
 content: "";
-background-color: hsla(0, 0%, 90%, 0.5);
+background-color: var(--shadow-subtree-background-color);
 }
 
 .tree-outline.dom li.parent.shadow + ol.children.expanded {
-background-color: hsla(0, 0%, 90%, 0.5);
+background-color: var(--shadow-subtree-background-color);
 }
 
 .showing-find-banner .tree-outline.dom .search-highlight {
@@ -276,17 +274,14 @@
 }
 
 @media (prefers-color-scheme: dark) {
+.tree-outline.dom {
+--shadow-subtree-background-color: hsla(0, 0%, 100%, 0.05);
+}
+
 .tree-outline.dom .shadow {
 color: var(--text-color);
 }
 
-/* FIXME: extract this as a variable. It's slightly different from var(background-color-secondary),
-but close enough for now. It needs to use partial translucency so that the selection area shines through. */
-.tree-outline.dom 

[webkit-changes] [266451] trunk

[nvasilyev]

Title: [266451] trunk








Revision 266451
Author nvasil...@apple.com
Date 2020-09-01 23:57:07 -0700 (Tue, 01 Sep 2020)


Log Message
REGRESSION(r243264): Web Inspector: Style pane doesn't update after toggling CSS class
https://bugs.webkit.org/show_bug.cgi?id=202065


Reviewed by Brian Burg.

Source/WebInspectorUI:

* UserInterface/Models/DOMNodeStyles.js:
(WI.DOMNodeStyles.prototype.refresh.fetchedMatchedStyles):
(WI.DOMNodeStyles.prototype.refresh.fetchedComputedStyle):
(WI.DOMNodeStyles.prototype.refresh):
(WI.DOMNodeStyles.prototype._parseStyleDeclarationPayload):
r243264 introduced this bug by never clearing `_styleMap` making it impossible to diff old
and new style declarations. Create and clear `_styleMap` at the same place as it was before r243264.

* UserInterface/Views/SpreadsheetRulesStyleDetailsPanel.js:
(WI.SpreadsheetRulesStyleDetailsPanel):
(WI.SpreadsheetRulesStyleDetailsPanel.prototype.layout):
Layout now always re-layouts everything. Rules with modified selectors are now preserved by
exiting layout early.

(WI.SpreadsheetRulesStyleDetailsPanel.prototype._handleSectionSelectorWillChange):
Remove logic that tried to preserve indexes of CSS rules with modified selectors that
don't match (SectionIndexSymbol and everything related to it). Instead, avoid re-layout after
editing a selector.

LayoutTests:

Added a test to verify that WI.DOMNodeStyles.Event.Refreshed fires with appropriate
`significantChange` flag.

* inspector/css/node-styles-refreshed-expected.txt: Added.
* inspector/css/node-styles-refreshed.html: Added.

Modified Paths

trunk/LayoutTests/ChangeLog
trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/DOMNodeStyles.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetRulesStyleDetailsPanel.js


Added Paths

trunk/LayoutTests/inspector/css/node-styles-refreshed-expected.txt
trunk/LayoutTests/inspector/css/node-styles-refreshed.html




Diff

Modified: trunk/LayoutTests/ChangeLog (266450 => 266451)

--- trunk/LayoutTests/ChangeLog	2020-09-02 04:50:35 UTC (rev 266450)
+++ trunk/LayoutTests/ChangeLog	2020-09-02 06:57:07 UTC (rev 266451)
@@ -1,3 +1,17 @@
+2020-09-01  Nikita Vasilyev  
+
+REGRESSION(r243264): Web Inspector: Style pane doesn't update after toggling CSS class
+https://bugs.webkit.org/show_bug.cgi?id=202065
+
+
+Reviewed by Brian Burg.
+
+Added a test to verify that WI.DOMNodeStyles.Event.Refreshed fires with appropriate
+`significantChange` flag.
+
+* inspector/css/node-styles-refreshed-expected.txt: Added.
+* inspector/css/node-styles-refreshed.html: Added.
+
 2020-09-01  Yusuke Suzuki  
 
 Skip fast/css-custom-paint/out-of-memory-while-adding-worklet-module.html if Gigacage is not enabled


Added: trunk/LayoutTests/inspector/css/node-styles-refreshed-expected.txt (0 => 266451)

--- trunk/LayoutTests/inspector/css/node-styles-refreshed-expected.txt	(rev 0)
+++ trunk/LayoutTests/inspector/css/node-styles-refreshed-expected.txt	2020-09-02 06:57:07 UTC (rev 266451)
@@ -0,0 +1,16 @@
+Testing that WI.DOMNodeStyles.Event.Refreshed event dispatches with correct significantChange flag.
+
+
+== Running test suite: NodeStylesRefreshed
+-- Running test case: NodeStylesRefreshed.ClassAdded
+PASS: Adding '.baz' class should cause a significant change.
+
+-- Running test case: NodeStylesRefreshed.ClassRemoved
+PASS: Removing '.foo' class should cause a significant change.
+
+-- Running test case: NodeStylesRefreshed.IrrelevantClassAdded
+PASS: Adding '.blah' class shouldn't cause a significant change.
+
+-- Running test case: NodeStylesRefreshed.IrrelevantClassRemoved
+PASS: Removing '.blah' class shouldn't cause a significant change.
+


Added: trunk/LayoutTests/inspector/css/node-styles-refreshed.html (0 => 266451)

--- trunk/LayoutTests/inspector/css/node-styles-refreshed.html	(rev 0)
+++ trunk/LayoutTests/inspector/css/node-styles-refreshed.html	2020-09-02 06:57:07 UTC (rev 266451)
@@ -0,0 +1,84 @@
+
+
+
+function test()
+{
+let nodeStyles = null;
+let suite = InspectorTest.createAsyncSuite("NodeStylesRefreshed");
+
+suite.addTestCase({
+name: "NodeStylesRefreshed.ClassAdded",
+async test() {
+nodeStyles.singleFireEventListener(WI.DOMNodeStyles.Event.Refreshed, (event) => {
+InspectorTest.expectTrue(event.data.significantChange, `Adding '.baz' class should cause a significant change.`);
+});
+
+InspectorTest.evaluateInPage(`document.body.classList.add("baz")`);
+await nodeStyles.refresh();
+}
+});
+
+suite.addTestCase({
+name: "NodeStylesRefreshed.ClassRemoved",
+async test() {
+nodeStyles.singleFireEventListener(WI.DOMNodeStyles.Event.Refreshed, (event) => {
+InspectorTest.expectTrue(event.data.significantChange, `Removing '.foo' class should cause a significant 

[webkit-changes] [265507] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [265507] trunk/Source/WebInspectorUI








Revision 265507
Author nvasil...@apple.com
Date 2020-08-11 11:12:31 -0700 (Tue, 11 Aug 2020)


Log Message
Web Inspector: Clicking on sortable Table headers should expand vertical borders
https://bugs.webkit.org/show_bug.cgi?id=215140

Reviewed by Devin Rousso.

* UserInterface/Views/Table.css:
(.table > .header .cell:not(:first-child):active::before,):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/Table.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (265506 => 265507)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-08-11 17:30:56 UTC (rev 265506)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-08-11 18:12:31 UTC (rev 265507)
@@ -1,5 +1,15 @@
 2020-08-11  Nikita Vasilyev  
 
+Web Inspector: Clicking on sortable Table headers should expand vertical borders
+https://bugs.webkit.org/show_bug.cgi?id=215140
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/Table.css:
+(.table > .header .cell:not(:first-child):active::before,):
+
+2020-08-11  Nikita Vasilyev  
+
 Web Inspector: Dark Mode: Timelines: wrong background colors of even/odd items
 https://bugs.webkit.org/show_bug.cgi?id=214565
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Table.css (265506 => 265507)

--- trunk/Source/WebInspectorUI/UserInterface/Views/Table.css	2020-08-11 17:30:56 UTC (rev 265506)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Table.css	2020-08-11 18:12:31 UTC (rev 265507)
@@ -166,6 +166,12 @@
 background-color: var(--separator-color);
 }
 
+.table > .header .cell:not(:first-child):active::before,
+.table > .header .cell:active + .cell::before {
+top: 0;
+bottom: 0;
+}
+
 body[dir=ltr] .table > .header .cell:not(:first-child)::before {
 left: 0;
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [265498] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [265498] trunk/Source/WebInspectorUI








Revision 265498
Author nvasil...@apple.com
Date 2020-08-11 08:54:57 -0700 (Tue, 11 Aug 2020)


Log Message
Web Inspector: Dark Mode: Timelines: wrong background colors of even/odd items
https://bugs.webkit.org/show_bug.cgi?id=214565


Reviewed by Darin Adler.

* UserInterface/Views/TimelineOverview.css:
(.timeline-overview.edit-instruments > .tree-outline.timelines .item:nth-child(even),):
(.timeline-overview:not(.frames) > .graphs-container > .timeline-overview-graph:not(:first-child)):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (265497 => 265498)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-08-11 15:22:27 UTC (rev 265497)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-08-11 15:54:57 UTC (rev 265498)
@@ -1,3 +1,15 @@
+2020-08-11  Nikita Vasilyev  
+
+Web Inspector: Dark Mode: Timelines: wrong background colors of even/odd items
+https://bugs.webkit.org/show_bug.cgi?id=214565
+
+
+Reviewed by Darin Adler.
+
+* UserInterface/Views/TimelineOverview.css:
+(.timeline-overview.edit-instruments > .tree-outline.timelines .item:nth-child(even),):
+(.timeline-overview:not(.frames) > .graphs-container > .timeline-overview-graph:not(:first-child)):
+
 2020-08-06  Nikita Vasilyev  
 
 Web Inspector: Media & Animations timeline shouldn't shift when sorting


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css (265497 => 265498)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css	2020-08-11 15:22:27 UTC (rev 265497)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css	2020-08-11 15:54:57 UTC (rev 265498)
@@ -107,7 +107,7 @@
 
 .timeline-overview.edit-instruments > .tree-outline.timelines .item:nth-child(even),
 .timeline-overview > .tree-outline.timelines .item:not(.selected):nth-child(even) {
-background-color: hsla(0, 0%, 0%, 0.03);
+background-color: hsla(0, 0%, var(--foreground-lightness), 0.03);
 background-clip: padding-box;
 }
 
@@ -211,7 +211,7 @@
 }
 
 .timeline-overview:not(.frames) > .graphs-container > .timeline-overview-graph:not(:first-child) {
-border-top: 1px solid hsla(0, 0%, 0%, 0.09);
+border-top: 1px solid hsla(0, 0%, var(--foreground-lightness), 0.09);
 }
 
 .timeline-overview:not(.has-scrollbar) > .scroll-container {






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [265356] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [265356] trunk/Source/WebInspectorUI








Revision 265356
Author nvasil...@apple.com
Date 2020-08-06 17:19:15 -0700 (Thu, 06 Aug 2020)


Log Message
Web Inspector: Media & Animations timeline shouldn't shift when sorting
https://bugs.webkit.org/show_bug.cgi?id=215085

Reviewed by Devin Rousso.

* UserInterface/Views/DataGrid.css:
(.data-grid):
(.data-grid th):
(.data-grid th:matches(.sort-ascending, .sort-descending) > .header-cell-content:first-child::after):
* UserInterface/Views/TimelineDataGrid.css:
(.data-grid.timeline th.graph-column > .timeline-ruler):
Override padding defined in `.data-grid th > .header-cell-content`.

(.data-grid.timeline th > .header-cell-content.timeline-ruler > .markers):
(.data-grid.timeline th:matches(.sort-ascending, .sort-descending) > .header-cell-content.timeline-ruler:first-child::after):
`.header-cell-content.timeline-ruler` is different from `.header-cell-content` in the sense that the former takes the entire
height of DataGrid and has no padding. Place the chevron in the middle of `--data-grid-header-height`.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css
trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (265355 => 265356)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-08-07 00:00:54 UTC (rev 265355)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-08-07 00:19:15 UTC (rev 265356)
@@ -1,3 +1,23 @@
+2020-08-06  Nikita Vasilyev  
+
+Web Inspector: Media & Animations timeline shouldn't shift when sorting
+https://bugs.webkit.org/show_bug.cgi?id=215085
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/DataGrid.css:
+(.data-grid):
+(.data-grid th):
+(.data-grid th:matches(.sort-ascending, .sort-descending) > .header-cell-content:first-child::after):
+* UserInterface/Views/TimelineDataGrid.css:
+(.data-grid.timeline th.graph-column > .timeline-ruler):
+Override padding defined in `.data-grid th > .header-cell-content`.
+
+(.data-grid.timeline th > .header-cell-content.timeline-ruler > .markers):
+(.data-grid.timeline th:matches(.sort-ascending, .sort-descending) > .header-cell-content.timeline-ruler:first-child::after):
+`.header-cell-content.timeline-ruler` is different from `.header-cell-content` in the sense that the former takes the entire
+height of DataGrid and has no padding. Place the chevron in the middle of `--data-grid-header-height`.
+
 2020-08-05  Tim Horton  
 
 Remove all references to non-existent 10.16


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css (265355 => 265356)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css	2020-08-07 00:00:54 UTC (rev 265355)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css	2020-08-07 00:19:15 UTC (rev 265356)
@@ -28,6 +28,8 @@
 outline: none;
 
 --data-grid-header-horizontal-padding: 6px;
+--data-grid-header-height: 22px;
+--data-grid-sorting-indicator-height: 8px;
 }
 
 .data-grid .highlight {
@@ -77,7 +79,7 @@
 }
 
 .data-grid th {
-height: 22px;
+height: var(--data-grid-header-height);
 padding: 0;
 text-align: start;
 vertical-align: middle;
@@ -227,7 +229,7 @@
 top: 1px;
 bottom: 0;
 width: 9px;
-height: 8px;
+height: var(--data-grid-sorting-indicator-height);
 margin-bottom: auto;
 margin-top: auto;
 content: "";


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.css (265355 => 265356)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.css	2020-08-07 00:00:54 UTC (rev 265355)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.css	2020-08-07 00:19:15 UTC (rev 265356)
@@ -46,8 +46,18 @@
 top: 0;
 bottom: 0;
 margin: 0;
+padding: 0;
 }
 
+.data-grid.timeline th > .header-cell-content.timeline-ruler > .markers {
+position: absolute;
+}
+
+.data-grid.timeline th:matches(.sort-ascending, .sort-descending) > .header-cell-content.timeline-ruler:first-child::after {
+top: calc(var(--data-grid-header-height) / 2 - var(--data-grid-sorting-indicator-height) / 2);
+bottom: unset;
+}
+
 .data-grid.timeline td.graph-column {
 padding: 2px 0;
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [265262] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [265262] trunk/Source/WebInspectorUI








Revision 265262
Author nvasil...@apple.com
Date 2020-08-04 15:18:21 -0700 (Tue, 04 Aug 2020)


Log Message
Web Inspector: Use border-inline-start/end properties instead of border-left/right for DataGrid and Table
https://bugs.webkit.org/show_bug.cgi?id=215138

Reviewed by Devin Rousso.

Simplify LTR/RTL CSS code by using logical CSS properties. This patch doesn't introduce any visual changes.

* UserInterface/Views/DataGrid.css:
(.data-grid):
(.data-grid th:not(:last-child) > .header-cell-content):
(.data-grid:focus tr.selected td:not(:last-child)):
(body[dir=ltr] .data-grid th:not(:last-child) > .header-cell-content): Deleted.
(body[dir=rtl] .data-grid th:not(:last-child) > .header-cell-content): Deleted.
(body[dir=ltr] .data-grid:focus tr.selected td:not(:last-child)): Deleted.
(body[dir=rtl] .data-grid:focus tr.selected td:not(:last-child)): Deleted.
* UserInterface/Views/NetworkDetailView.css:
(.network-table.showing-detail .network-detail):
(body[dir=ltr] .network-table.showing-detail .network-detail): Deleted.
(body[dir=rtl] .network-table.showing-detail .network-detail): Deleted.
* UserInterface/Views/TimelineDataGrid.css:
(.data-grid.timeline td.graph-column):
(body[dir=ltr] .data-grid.timeline td.graph-column): Deleted.
(body[dir=rtl] .data-grid.timeline td.graph-column): Deleted.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css
trunk/Source/WebInspectorUI/UserInterface/Views/NetworkDetailView.css
trunk/Source/WebInspectorUI/UserInterface/Views/TimelineDataGrid.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (265261 => 265262)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-08-04 22:02:26 UTC (rev 265261)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-08-04 22:18:21 UTC (rev 265262)
@@ -1,3 +1,29 @@
+2020-08-04  Nikita Vasilyev  
+
+Web Inspector: Use border-inline-start/end properties instead of border-left/right for DataGrid and Table
+https://bugs.webkit.org/show_bug.cgi?id=215138
+
+Reviewed by Devin Rousso.
+
+Simplify LTR/RTL CSS code by using logical CSS properties. This patch doesn't introduce any visual changes.
+
+* UserInterface/Views/DataGrid.css:
+(.data-grid):
+(.data-grid th:not(:last-child) > .header-cell-content):
+(.data-grid:focus tr.selected td:not(:last-child)):
+(body[dir=ltr] .data-grid th:not(:last-child) > .header-cell-content): Deleted.
+(body[dir=rtl] .data-grid th:not(:last-child) > .header-cell-content): Deleted.
+(body[dir=ltr] .data-grid:focus tr.selected td:not(:last-child)): Deleted.
+(body[dir=rtl] .data-grid:focus tr.selected td:not(:last-child)): Deleted.
+* UserInterface/Views/NetworkDetailView.css:
+(.network-table.showing-detail .network-detail):
+(body[dir=ltr] .network-table.showing-detail .network-detail): Deleted.
+(body[dir=rtl] .network-table.showing-detail .network-detail): Deleted.
+* UserInterface/Views/TimelineDataGrid.css:
+(.data-grid.timeline td.graph-column):
+(body[dir=ltr] .data-grid.timeline td.graph-column): Deleted.
+(body[dir=rtl] .data-grid.timeline td.graph-column): Deleted.
+
 2020-08-03  Nikita Vasilyev  
 
 Web Inspector: Change DataGrid and Table styles to closer match macOS


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css (265261 => 265262)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css	2020-08-04 22:02:26 UTC (rev 265261)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DataGrid.css	2020-08-04 22:18:21 UTC (rev 265262)
@@ -28,7 +28,6 @@
 outline: none;
 
 --data-grid-header-horizontal-padding: 6px;
---data-grid-column-border-end: 1px solid var(--border-color);
 }
 
 .data-grid .highlight {
@@ -93,14 +92,10 @@
 padding: 0 var(--data-grid-header-horizontal-padding);
 }
 
-body[dir=ltr] .data-grid th:not(:last-child) > .header-cell-content {
-border-right: var(--data-grid-column-border-end);
+.data-grid th:not(:last-child) > .header-cell-content {
+border-inline-end: 1px solid var(--border-color);
 }
 
-body[dir=rtl] .data-grid th:not(:last-child) > .header-cell-content {
-border-left: var(--data-grid-column-border-end);
-}
-
 .data-grid th.sortable:active {
 background-color: var(--background-color-pressed);
 }
@@ -196,14 +191,10 @@
 --border-end-color: hsla(0, 0%, var(--foreground-lightness), 0.05);
 }
 
-body[dir=ltr] .data-grid:focus tr.selected td:not(:last-child) {
-border-right-color: var(--border-end-color);
+.data-grid:focus tr.selected td:not(:last-child) {
+border-inline-end-color: var(--border-end-color);
 }
 
-body[dir=rtl] .data-grid:focus tr.selected td:not(:last-child) {
-border-left-color: var(--border-end-color);
-}
-
 .data-grid :matches(th, td) > div {
 white-space: nowrap;
 text-overflow: ellipsis;


Modified: 

[webkit-changes] [265237] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [265237] trunk/Source/WebInspectorUI








Revision 265237
Author nvasil...@apple.com
Date 2020-08-03 18:51:14 -0700 (Mon, 03 Aug 2020)


Log Message
Web Inspector: Change DataGrid and Table styles to closer match macOS
https://bugs.webkit.org/show_bug.cgi?id=214563


Reviewed by Devin Rousso.

- Remove vertical borders from table contents and only keep them on the table headers.
- Use 1px borders instead of hairline (0.5px) borders to closer match macOS.
- Refactoring: add "sorted" CSS class on sorted header columns to replace `th:matches(.sort-ascending, .sort-descending)`
  that is used 10 times with `.sorted`.

* UserInterface/Views/CPUTimelineView.css:
(.timeline-view.cpu :matches(.area-chart, .stacked-area-chart) .markers > div):

* UserInterface/Views/DataGrid.css:
(.data-grid):
--data-grid-column-border-start is no longer used, remove it.

(.data-grid.inline):
(.data-grid th):
(.data-grid th > .header-cell-content):
(body[dir=ltr] .data-grid th:not(:last-child) > .header-cell-content):
(body[dir=rtl] .data-grid th:not(:last-child) > .header-cell-content):
(.data-grid th.sortable:active):
(.data-grid th:matches(.sort-ascending, .sort-descending)):
(.data-grid th:matches(.sort-ascending, .sort-descending) > .header-cell-content:first-child):
(.data-grid th:matches(.sort-ascending, .sort-descending) > .header-cell-content:first-child::after):
(body[dir=ltr] .data-grid th:matches(.sort-ascending, .sort-descending) > .header-cell-content:first-child::after):
(body[dir=rtl] .data-grid th:matches(.sort-ascending, .sort-descending) > .header-cell-content:first-child::after):
Remove styles that are no longer relevant because columns don't have vertical borders anymore.

(.data-grid th.sort-ascending > .header-cell-content:first-child::after):
(.data-grid th.sort-descending > .header-cell-content:first-child::after):
(@media (prefers-color-scheme: dark) .data-grid th:matches(.sort-ascending, .sort-descending) > .header-cell-content:first-child::after):
Don't change the background color of the sorted header cells to match macOS.

(body[dir=ltr] .data-grid :matches(th, td):not(:last-child)): Deleted.
(body[dir=rtl] .data-grid :matches(th, td):not(:last-child)): Deleted.
(.data-grid th:matches(.sort-ascending, .sort-descending) > div:first-child): Deleted.
(.data-grid th:matches(.sort-ascending, .sort-descending) > div:first-child::after): Deleted.
(body[dir=ltr] .data-grid th:matches(.sort-ascending, .sort-descending) > div:first-child::after): Deleted.
(body[dir=rtl] .data-grid th:matches(.sort-ascending, .sort-descending) > div:first-child::after): Deleted.
(.data-grid th.sort-ascending > div:first-child::after): Deleted.
(.data-grid th.sort-descending > div:first-child::after): Deleted.
(.data-grid table:matches(.header, .data)): Deleted.
(body[dir=ltr] .data-grid :matches(th, td):first-child): Deleted.
(body[dir=rtl] .data-grid :matches(th, td):first-child): Deleted.
(@media (-webkit-min-device-pixel-ratio: 2) .data-grid table:matches(.header, .data)): Deleted.
(@media (-webkit-min-device-pixel-ratio: 2) .data-grid :matches(th, td):first-child): Deleted.
(@media (prefers-color-scheme: dark) .data-grid th.sortable:active): Deleted.
(@media (prefers-color-scheme: dark) .data-grid th.sort-ascending > div:first-child::after,): Deleted.
* UserInterface/Views/DataGrid.js:
(WI.DataGrid.prototype.insertColumn):

* UserInterface/Views/NetworkDetailView.css:
(body[dir=ltr] .network-table.showing-detail .network-detail):
(body[dir=rtl] .network-table.showing-detail .network-detail):
Now that columns don't have borders, add a vertical border to the Network details pane.

* UserInterface/Views/NetworkTableContentView.css:
(.network-table > .table .header .cell.waterfall:matches(.sort-ascending, .sort-descending)):
(body[dir=ltr] .network-table > .table :not(.header) .cell.waterfall):
(body[dir=rtl] .network-table > .table :not(.header) .cell.waterfall):
Add a vertical border for the zeroth mark of the graph.

* UserInterface/Views/RenderingFrameTimelineOverviewGraph.css:
(.timeline-overview-graph.rendering-frame > .divider):
* UserInterface/Views/Table.css:
(.table):
(.table > .header > .sortable:active):
(.table > .header > :matches(.sort-ascending, .sort-descending)):
(.table > .header .cell):
(.table > .header .cell:not(:first-child)::before):
(body[dir=ltr] .table > .header .cell:not(:first-child)::before):
(body[dir=rtl] .table > .header .cell:not(:first-child)::before):
(body[dir=ltr] .table .cell:not(:last-child)): Deleted.
(body[dir=rtl] .table .cell:not(:last-child)): Deleted.
(body[dir=ltr] .table .cell:first-child): Deleted.
(body[dir=rtl] .table .cell:first-child): Deleted.
(@media (prefers-color-scheme: dark) .table > .header > .sortable:active): Deleted.
(@media (prefers-color-scheme: dark) .table > .header > :matches(.sort-ascending, .sort-descending)): Deleted.
* UserInterface/Views/TimelineDataGrid.css:
(.data-grid th.graph-column:matches(.sort-ascending, .sort-descending)):

[webkit-changes] [265125] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [265125] trunk/Source/WebInspectorUI








Revision 265125
Author nvasil...@apple.com
Date 2020-07-30 18:44:55 -0700 (Thu, 30 Jul 2020)


Log Message
REGRESSION (r?): Web Inspector: Timelines: blue border below selected timeline when in edit mode
https://bugs.webkit.org/show_bug.cgi?id=214979


Reviewed by Devin Rousso.

Color the top border after the selected item with the same background as the selected item.
When editing, don't color that border with the selected item background.

* UserInterface/Views/TimelineOverview.css:
(.timeline-overview.edit-instruments > .tree-outline.timelines .item:not(:first-child),):
(body:matches(.window-inactive, .window-docked-inactive) .timeline-overview:not(.edit-instruments) > .tree-outline.timelines .item.selected + .item):
(body:not(.window-inactive, .window-docked-inactive) .timeline-overview:not(.edit-instruments) > .tree-outline.timelines:focus-within .item.selected + .item):
(@media (prefers-color-scheme: dark) .timeline-overview:not(.frames) > .graphs-container > .timeline-overview-graph:nth-child(even)):
(.timeline-overview > .tree-outline.timelines .item.selected + .item): Deleted.
(body:not(.window-inactive, .window-docked-inactive) .timeline-overview > .tree-outline.timelines:focus-within .item.selected + .item): Deleted.
(@media (prefers-color-scheme: dark) .timeline-overview.edit-instruments > .tree-outline.timelines .item:not(:first-child),): Deleted.
(@media (prefers-color-scheme: dark) .timeline-overview > .tree-outline.timelines .item.selected + .item): Deleted.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (265124 => 265125)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-07-31 01:14:26 UTC (rev 265124)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-07-31 01:44:55 UTC (rev 265125)
@@ -1,3 +1,24 @@
+2020-07-30  Nikita Vasilyev  
+
+REGRESSION (r?): Web Inspector: Timelines: blue border below selected timeline when in edit mode
+https://bugs.webkit.org/show_bug.cgi?id=214979
+
+
+Reviewed by Devin Rousso.
+
+Color the top border after the selected item with the same background as the selected item.
+When editing, don't color that border with the selected item background.
+
+* UserInterface/Views/TimelineOverview.css:
+(.timeline-overview.edit-instruments > .tree-outline.timelines .item:not(:first-child),):
+(body:matches(.window-inactive, .window-docked-inactive) .timeline-overview:not(.edit-instruments) > .tree-outline.timelines .item.selected + .item):
+(body:not(.window-inactive, .window-docked-inactive) .timeline-overview:not(.edit-instruments) > .tree-outline.timelines:focus-within .item.selected + .item):
+(@media (prefers-color-scheme: dark) .timeline-overview:not(.frames) > .graphs-container > .timeline-overview-graph:nth-child(even)):
+(.timeline-overview > .tree-outline.timelines .item.selected + .item): Deleted.
+(body:not(.window-inactive, .window-docked-inactive) .timeline-overview > .tree-outline.timelines:focus-within .item.selected + .item): Deleted.
+(@media (prefers-color-scheme: dark) .timeline-overview.edit-instruments > .tree-outline.timelines .item:not(:first-child),): Deleted.
+(@media (prefers-color-scheme: dark) .timeline-overview > .tree-outline.timelines .item.selected + .item): Deleted.
+
 2020-07-30  Devin Rousso  
 
 Web Inspector: Add another Protocol Version (iOS 14.0)


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css (265124 => 265125)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css	2020-07-31 01:14:26 UTC (rev 265124)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TimelineOverview.css	2020-07-31 01:44:55 UTC (rev 265125)
@@ -113,15 +113,15 @@
 
 .timeline-overview.edit-instruments > .tree-outline.timelines .item:not(:first-child),
 .timeline-overview > .tree-outline.timelines .item:not(.selected):not(:first-child) {
-border-top: 1px solid hsla(0, 0%, 0%, 0.09);
+border-top-color: hsla(0, 0%, var(--foreground-lightness), 0.09);
 }
 
-.timeline-overview > .tree-outline.timelines .item.selected + .item {
-border-top-color: hsl(0, 0%, 83%);
+body:matches(.window-inactive, .window-docked-inactive) .timeline-overview:not(.edit-instruments) > .tree-outline.timelines .item.selected + .item {
+border-top-color: var(--selected-background-color-unfocused);
 }
 
-body:not(.window-inactive, .window-docked-inactive) .timeline-overview > .tree-outline.timelines:focus-within .item.selected + .item {
-border-top-color: hsl(209, 100%, 49%);
+body:not(.window-inactive, .window-docked-inactive) .timeline-overview:not(.edit-instruments) > .tree-outline.timelines:focus-within .item.selected + .item {
+border-top-color: var(--selected-background-color);
 }
 
 .timeline-overview > 

[webkit-changes] [265120] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [265120] trunk/Source/WebInspectorUI








Revision 265120
Author nvasil...@apple.com
Date 2020-07-30 17:12:06 -0700 (Thu, 30 Jul 2020)


Log Message
Web Inspector: on Big Sur, match OS background, text, and border colors
https://bugs.webkit.org/show_bug.cgi?id=214366


Reviewed by Devin Rousso.

Refactoring:
- Remove --background-color-code because it was always the same value as --background-color-content.
- Replace commonly hardcoded `hsl(0, 0%, 97%)` background with --background-color-intermediate.

* UserInterface/Views/AnimationDetailsSidebarPanel.css:
(.sidebar > .panel.details.animation > .content > .details-section.animation-keyframes .details-section):
(.sidebar > .panel.details.animation > .content > .details-section.animation-keyframes .details-section .row.styles .CodeMirror):
* UserInterface/Views/BoxShadowEditor.css:
(.box-shadow-editor > table > tr > td > input[type="text"]):
* UserInterface/Views/BreakpointActionView.css:
(@media (prefers-color-scheme: dark) .breakpoint-action-eval-editor):
* UserInterface/Views/BreakpointPopoverController.css:
(.edit-breakpoint-popover-condition):
* UserInterface/Views/ChangesDetailsSidebarPanel.css:
(.sidebar > .panel.changes-panel .css-rule):
* UserInterface/Views/ComputedStyleSection.css:
(.computed-style-section .computed-property-item.expanded):
(.computed-style-properties.details-section > .content,):
* UserInterface/Views/ConsolePrompt.css:
(.console-prompt):
(.console-prompt > .CodeMirror-scroll):
* UserInterface/Views/CookiePopover.css:
(.popover .cookie-popover-content > table > tr > td > input:matches([type="text"], [type="datetime-local"])):

* UserInterface/Views/DetailsSection.css:
(.details-section .details-section):
(.details-section .details-section > .header):
Refactor. --background-color-content is the same color value.

(.details-section .details-section:not(.collapsed) > .header):
Refactor. --border-color-secondary is the same color value.

(.details-section > .content > .group:nth-child(even)):
(.details-section > .content > .group > .row:matches(.empty, .text)):
(@media (prefers-color-scheme: dark) .details-section > .header > label,):

* UserInterface/Views/DividerNavigationItem.css:
(.navigation-bar .item.divider):
Don't use hairline dividers. MacOS Catalina and Big Sur don't use hairline borders.

* UserInterface/Views/GraphicsOverviewContentView.css:
(.content-view.graphics-overview > section > .header):
(@media (prefers-color-scheme: dark) .content-view.graphics-overview):
* UserInterface/Views/LocalResourceOverridePopover.css:
(.popover .local-resource-override-popover-content .editor):
* UserInterface/Views/LogContentView.css:
(@media (prefers-color-scheme: dark) .console-messages):
* UserInterface/Views/QuickConsole.css:
(.quick-console):
* UserInterface/Views/ScopeChainDetailsSidebarPanel.css:
(@media (prefers-color-scheme: dark) .watch-_expression_-editor):
* UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.css:
(.spreadsheet-css-declaration):
(.spreadsheet-css-declaration.locked):
* UserInterface/Views/SyntaxHighlightingDefaultTheme.css:
(@media (prefers-color-scheme: dark) .cm-s-default,):
* UserInterface/Views/TabBar.css:
(body.big-sur.docked .tab-bar > .border.bottom):
* UserInterface/Views/URLBreakpointPopover.css:
(.popover .url-breakpoint-content > .editor-wrapper > .editor):

* UserInterface/Views/Variables.css:
(:root):
Add --separator-color, which has the same semantics as `separator` color from Apple HIG
(https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/color/#dynamic-system-colors).
--border-color-secondary was only defined in the dark mode. Define it in the light mode, too.

(body.window-inactive):
Remove unused variable.

(body.big-sur):
(@media (prefers-color-scheme: dark) :root):
(@media (prefers-color-scheme: dark) body.big-sur):
(@media (prefers-color-scheme: dark) body.window-inactive):
(body.window-inactive *): Remove unnecessarily greedy selector.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/AnimationDetailsSidebarPanel.css
trunk/Source/WebInspectorUI/UserInterface/Views/BoxShadowEditor.css
trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointActionView.css
trunk/Source/WebInspectorUI/UserInterface/Views/BreakpointPopoverController.css
trunk/Source/WebInspectorUI/UserInterface/Views/ChangesDetailsSidebarPanel.css
trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleSection.css
trunk/Source/WebInspectorUI/UserInterface/Views/ConsolePrompt.css
trunk/Source/WebInspectorUI/UserInterface/Views/CookiePopover.css
trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css
trunk/Source/WebInspectorUI/UserInterface/Views/DividerNavigationItem.css
trunk/Source/WebInspectorUI/UserInterface/Views/GraphicsOverviewContentView.css
trunk/Source/WebInspectorUI/UserInterface/Views/LocalResourceOverridePopover.css
trunk/Source/WebInspectorUI/UserInterface/Views/LogContentView.css

[webkit-changes] [264959] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [264959] trunk/Source/WebInspectorUI








Revision 264959
Author nvasil...@apple.com
Date 2020-07-27 17:05:42 -0700 (Mon, 27 Jul 2020)


Log Message
Web Inspector: Change default tab order to display most commonly used tabs first
https://bugs.webkit.org/show_bug.cgi?id=212189


Reviewed by Timothy Hatcher.

Changet the default tab order to:
Elements, Console, Sources, Network, Timelines, Storage, Graphics, Layers, Audit.

* UserInterface/Base/Main.js:
(WI.loaded):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Main.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (264958 => 264959)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-07-28 00:05:05 UTC (rev 264958)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-07-28 00:05:42 UTC (rev 264959)
@@ -1,3 +1,17 @@
+2020-07-27  Nikita Vasilyev  
+
+Web Inspector: Change default tab order to display most commonly used tabs first
+https://bugs.webkit.org/show_bug.cgi?id=212189
+
+
+Reviewed by Timothy Hatcher.
+
+Changet the default tab order to:
+Elements, Console, Sources, Network, Timelines, Storage, Graphics, Layers, Audit.
+
+* UserInterface/Base/Main.js:
+(WI.loaded):
+
 2020-07-22  Conrad Shultz  
 
 Update macOS Version macros


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Main.js (264958 => 264959)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2020-07-28 00:05:05 UTC (rev 264958)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2020-07-28 00:05:42 UTC (rev 264959)
@@ -147,14 +147,14 @@
 WI._showingSplitConsoleSetting = new WI.Setting("showing-split-console", false);
 WI._openTabsSetting = new WI.Setting("open-tab-types", [
 WI.ElementsTabContentView.Type,
+WI.ConsoleTabContentView.Type,
+WI.SourcesTabContentView.Type,
 WI.NetworkTabContentView.Type,
-WI.SourcesTabContentView.Type,
 WI.TimelineTabContentView.Type,
 WI.StorageTabContentView.Type,
 WI.GraphicsTabContentView.Type,
 WI.LayersTabContentView.Type,
 WI.AuditTabContentView.Type,
-WI.ConsoleTabContentView.Type,
 ]);
 WI._selectedTabIndexSetting = new WI.Setting("selected-tab-index", 0);
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [264410] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [264410] trunk/Source/WebInspectorUI








Revision 264410
Author nvasil...@apple.com
Date 2020-07-15 12:04:00 -0700 (Wed, 15 Jul 2020)


Log Message
Web Inspector: Tab bar colors of undocked Inspector should match Safari in Big Sur
https://bugs.webkit.org/show_bug.cgi?id=214163


Reviewed by Brian Burg.

* UserInterface/Views/Main.css:
(#undocked-title-area):
(body.big-sur #undocked-title-area):
(body:not(.big-sur) #undocked-title-area):
(body.window-inactive #undocked-title-area):
(@media (prefers-color-scheme: dark) body.big-sur #undocked-title-area):
(@media (prefers-color-scheme: dark) body:not(.big-sur) #undocked-title-area):
(@media (prefers-color-scheme: dark) body.big-sur.window-inactive #undocked-title-area):
(@media (prefers-color-scheme: dark) body:not(.big-sur).window-inactive #undocked-title-area):
* UserInterface/Views/TabBar.css:
(.tab-bar):
(body.big-sur .tab-bar):
(body:not(.docked) .tab-bar):
(body.big-sur:not(.docked) .tab-bar):
(body:not(.big-sur):not(.docked) .tab-bar):
(body.big-sur:not(.docked).window-inactive .tab-bar,):
(.tab-bar > .border):
(.tab-bar > .tabs > .item):
(body:not(.docked) .tab-bar > .tabs > .item):
(body.big-sur:not(.docked) .tab-bar > .tabs > .item):
(body:not(.big-sur):not(.docked) .tab-bar > .tabs > .item):
(body.big-sur:not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected):
(body:not(.big-sur):not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected):
(body.big-sur:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover):
(body:not(.big-sur):not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover):
(body:not(.docked).window-inactive .tab-bar > .tabs > .item):
(body.big-sur:not(.docked).window-inactive .tab-bar > .tabs > .item,):
(body:not(.docked).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected):
(.tab-bar > .tabs.animating.inserting-tab > .item.being-inserted):
(.tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected):
(@media (prefers-color-scheme: dark) body.big-sur .tab-bar,):
(@media (prefers-color-scheme: dark) body.big-sur:not(.docked) .tab-bar):
(@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked) .tab-bar):
(@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked) .tab-bar > .tabs > .item):
(@media (prefers-color-scheme: dark) body.big-sur:not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected):
(@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected):
(@media (prefers-color-scheme: dark) body.big-sur:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover):
(@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover):
(@media (prefers-color-scheme: dark) body:not(.docked).window-inactive .tab-bar):
(@media (prefers-color-scheme: dark) body.big-sur:not(.docked).window-inactive .tab-bar,):
(@media (prefers-color-scheme: dark) body.big-sur:not(.docked).window-inactive .tab-bar > .tabs > .item):
(@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked).window-inactive .tab-bar > .tabs > .item):
(@media (prefers-color-scheme: dark) body.big-sur:not(.docked).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected):
(@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/Main.css
trunk/Source/WebInspectorUI/UserInterface/Views/TabBar.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (264409 => 264410)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-07-15 18:39:23 UTC (rev 264409)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-07-15 19:04:00 UTC (rev 264410)
@@ -1,3 +1,56 @@
+2020-07-15  Nikita Vasilyev  
+
+Web Inspector: Tab bar colors of undocked Inspector should match Safari in Big Sur
+https://bugs.webkit.org/show_bug.cgi?id=214163
+
+
+Reviewed by Brian Burg.
+
+* UserInterface/Views/Main.css:
+(#undocked-title-area):
+(body.big-sur #undocked-title-area):
+(body:not(.big-sur) #undocked-title-area):
+(body.window-inactive #undocked-title-area):
+(@media (prefers-color-scheme: dark) body.big-sur #undocked-title-area):
+(@media (prefers-color-scheme: dark) body:not(.big-sur) #undocked-title-area):
+(@media (prefers-color-scheme: dark) body.big-sur.window-inactive #undocked-title-area):
+(@media (prefers-color-scheme: dark) body:not(.big-sur).window-inactive #undocked-title-area):
+* UserInterface/Views/TabBar.css:
+(.tab-bar):
+(body.big-sur .tab-bar):
+(body:not(.docked) .tab-bar):
+(body.big-sur:not(.docked) .tab-bar):
+(body:not(.big-sur):not(.docked) .tab-bar):
+

[webkit-changes] [264204] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [264204] trunk/Source/WebInspectorUI








Revision 264204
Author nvasil...@apple.com
Date 2020-07-09 17:05:06 -0700 (Thu, 09 Jul 2020)


Log Message
Web Inspector: title bar of undocked inspector should be white in BigSur
https://bugs.webkit.org/show_bug.cgi?id=214161


Reviewed by Brian Burg.

Make the title bar white when the window is focused.

When the window is unfocused, the title bar background is
the same on Big Sur and Catalina. No changes were needed.

* UserInterface/Views/Main.css:
(#undocked-title-area):
(body.big-sur #undocked-title-area):
(body:not(.big-sur) #undocked-title-area):
(@media (prefers-color-scheme: dark) #undocked-title-area):
(@media (prefers-color-scheme: dark) body.big-sur #undocked-title-area):
(@media (prefers-color-scheme: dark) body:not(.big-sur) #undocked-title-area):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/Main.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (264203 => 264204)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-07-09 23:37:38 UTC (rev 264203)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-07-10 00:05:06 UTC (rev 264204)
@@ -1,3 +1,24 @@
+2020-07-09  Nikita Vasilyev  
+
+Web Inspector: title bar of undocked inspector should be white in BigSur
+https://bugs.webkit.org/show_bug.cgi?id=214161
+
+
+Reviewed by Brian Burg.
+
+Make the title bar white when the window is focused.
+
+When the window is unfocused, the title bar background is
+the same on Big Sur and Catalina. No changes were needed.
+
+* UserInterface/Views/Main.css:
+(#undocked-title-area):
+(body.big-sur #undocked-title-area):
+(body:not(.big-sur) #undocked-title-area):
+(@media (prefers-color-scheme: dark) #undocked-title-area):
+(@media (prefers-color-scheme: dark) body.big-sur #undocked-title-area):
+(@media (prefers-color-scheme: dark) body:not(.big-sur) #undocked-title-area):
+
 2020-07-08  Christopher Reid  
 
 Heap Snapshot Object Graph view doesn't get populated in some cases when inspecting a JSContext


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Main.css (264203 => 264204)

--- trunk/Source/WebInspectorUI/UserInterface/Views/Main.css	2020-07-09 23:37:38 UTC (rev 264203)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Main.css	2020-07-10 00:05:06 UTC (rev 264204)
@@ -115,6 +115,13 @@
 right: 0;
 left: 0;
 height: var(--undocked-title-area-height);
+}
+
+body.big-sur #undocked-title-area {
+background-color: white;
+}
+
+body:not(.big-sur) #undocked-title-area {
 background-image: linear-gradient(to bottom, hsl(0, 0%, 92%), hsl(0, 0%, 87%));
 box-shadow: inset hsla(0, 0%, 100%, 0.5) 0 1px 1px;
 }
@@ -558,10 +565,17 @@
 
 @media (prefers-color-scheme: dark) {
 #undocked-title-area {
-background-image: linear-gradient(to bottom, hsl(0, 0%, 26%), hsl(0, 0%, 23%));
 box-shadow: none;
 }
 
+body.big-sur #undocked-title-area {
+background-color: hsl(0, 0%, 19%);
+}
+
+body:not(.big-sur) #undocked-title-area {
+background-image: linear-gradient(to bottom, hsl(0, 0%, 26%), hsl(0, 0%, 23%));
+}
+
 body.window-inactive #undocked-title-area {
 background-color: var(--background-color);
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [263872] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [263872] trunk/Source/WebInspectorUI








Revision 263872
Author nvasil...@apple.com
Date 2020-07-02 15:49:37 -0700 (Thu, 02 Jul 2020)


Log Message
Web Inspector: Allow selecting text of Response (DOM Tree)
https://bugs.webkit.org/show_bug.cgi?id=213617

Reviewed by Joseph Pecoraro.

* UserInterface/Views/DOMTreeOutline.css:
(.tree-outline.dom.non-selectable):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (263871 => 263872)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-07-02 22:49:35 UTC (rev 263871)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-07-02 22:49:37 UTC (rev 263872)
@@ -1,3 +1,13 @@
+2020-07-02  Nikita Vasilyev  
+
+Web Inspector: Allow selecting text of Response (DOM Tree)
+https://bugs.webkit.org/show_bug.cgi?id=213617
+
+Reviewed by Joseph Pecoraro.
+
+* UserInterface/Views/DOMTreeOutline.css:
+(.tree-outline.dom.non-selectable):
+
 2020-07-01  Devin Rousso  
 
 Web Inspector: add back support for 10.3.1


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css (263871 => 263872)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css	2020-07-02 22:49:35 UTC (rev 263871)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css	2020-07-02 22:49:37 UTC (rev 263872)
@@ -45,6 +45,10 @@
 --sublist-border-width-start: 9px;
 }
 
+.tree-outline.dom.non-selectable {
+-webkit-user-select: text;
+}
+
 .tree-outline.dom li .selection-area {
 position: absolute;
 left: 0;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [262397] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [262397] trunk/Source/WebInspectorUI








Revision 262397
Author nvasil...@apple.com
Date 2020-06-01 15:19:50 -0700 (Mon, 01 Jun 2020)


Log Message
Web Inspector: Timelines: Edit button has wrong outline
https://bugs.webkit.org/show_bug.cgi?id=211105


Reviewed by Devin Rousso.

* UserInterface/Views/ButtonNavigationItem.css:
(.navigation-bar .item.button.text-only:focus):
Add `.text-only` to the selector to make specificity higher than of the button selector.

* UserInterface/Views/RadioButtonNavigationItem.css:
(.navigation-bar .item.radio.button.text-only:focus):
Add `.text-only` to the selector to make specificity higher than of the button selector.

(.navigation-bar .item.radio.button:not(.text-only)): Deleted.
(.navigation-bar.collapsed .item.radio.button:not(.text-only)): Deleted.
Remove dead code. We only have text-only buttons now.

* UserInterface/Views/RadioButtonNavigationItem.js:
(WI.RadioButtonNavigationItem):
(WI.RadioButtonNavigationItem.prototype.get buttonStyle):
(WI.RadioButtonNavigationItem.prototype.set buttonStyle):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.css
trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.css
trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (262396 => 262397)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-06-01 22:15:59 UTC (rev 262396)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-06-01 22:19:50 UTC (rev 262397)
@@ -1,3 +1,28 @@
+2020-06-01  Nikita Vasilyev  
+
+Web Inspector: Timelines: Edit button has wrong outline
+https://bugs.webkit.org/show_bug.cgi?id=211105
+
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/ButtonNavigationItem.css:
+(.navigation-bar .item.button.text-only:focus):
+Add `.text-only` to the selector to make specificity higher than of the button selector.
+
+* UserInterface/Views/RadioButtonNavigationItem.css:
+(.navigation-bar .item.radio.button.text-only:focus):
+Add `.text-only` to the selector to make specificity higher than of the button selector.
+
+(.navigation-bar .item.radio.button:not(.text-only)): Deleted.
+(.navigation-bar.collapsed .item.radio.button:not(.text-only)): Deleted.
+Remove dead code. We only have text-only buttons now.
+
+* UserInterface/Views/RadioButtonNavigationItem.js:
+(WI.RadioButtonNavigationItem):
+(WI.RadioButtonNavigationItem.prototype.get buttonStyle):
+(WI.RadioButtonNavigationItem.prototype.set buttonStyle):
+
 2020-05-29  Devin Rousso  
 
 Web Inspector: Graphics: text editors in Keyframes section don't populate when sidebar is first shown


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.css (262396 => 262397)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.css	2020-06-01 22:15:59 UTC (rev 262396)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.css	2020-06-01 22:19:50 UTC (rev 262397)
@@ -65,6 +65,10 @@
 text-align: center;
 }
 
+.navigation-bar .item.button.text-only:focus {
+outline-offset: var(--focus-ring-outline-offset);
+}
+
 .navigation-bar .item.button > .glyph {
 color: var(--glyph-color);
 opacity: var(--glyph-opacity);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.css (262396 => 262397)

--- trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.css	2020-06-01 22:15:59 UTC (rev 262396)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.css	2020-06-01 22:19:50 UTC (rev 262397)
@@ -23,15 +23,7 @@
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-.navigation-bar .item.radio.button:not(.text-only) {
-width: 32px;
-}
-
-.navigation-bar.collapsed .item.radio.button:not(.text-only) {
-width: 24px;
-}
-
-.navigation-bar .item.radio.button:focus {
+.navigation-bar .item.radio.button.text-only:focus {
 outline-offset: -1px;
 }
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js (262396 => 262397)

--- trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js	2020-06-01 22:15:59 UTC (rev 262396)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js	2020-06-01 22:19:50 UTC (rev 262397)
@@ -28,6 +28,8 @@
 constructor(identifier, toolTip, image, imageWidth, imageHeight)
 {
 super(identifier, toolTip, image, imageWidth, imageHeight, "tab");
+
+console.assert(this.buttonStyle === WI.ButtonNavigationItem.Style.Text);
 }
 
 // Public
@@ -60,6 +62,19 @@
 this.element.classList.toggle(WI.RadioButtonNavigationItem.ActiveStyleClassName, flag);
 }
 
+get buttonStyle()
+{
+return super.buttonStyle;
+}
+
+set 

[webkit-changes] [261962] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [261962] trunk/Source/WebInspectorUI








Revision 261962
Author nvasil...@apple.com
Date 2020-05-20 15:08:13 -0700 (Wed, 20 May 2020)


Log Message
Web Inspector: Left/Right arrow keys should collapse/expand details sections
https://bugs.webkit.org/show_bug.cgi?id=212064


Reviewed by Devin Rousso.

* UserInterface/Views/DetailsSection.js:
(WI.DetailsSection):
(WI.DetailsSection.prototype._headerElementClicked):
(WI.DetailsSection.prototype._handleHeaderElementKeyDown):
Use keydown event instead of keypress because the latter doesn't fire for arrow keys.
Drive-by: remove unused `expandedByUser`.

* UserInterface/Views/ExpandableView.js:
(WI.ExpandableView):
(WI.ExpandableView.prototype._handleDisclosureButtonKeyDown):
Computed panel items should also collapse/expand by pressing Left/Right keys.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js
trunk/Source/WebInspectorUI/UserInterface/Views/ExpandableView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (261961 => 261962)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-05-20 21:51:57 UTC (rev 261961)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-05-20 22:08:13 UTC (rev 261962)
@@ -1,5 +1,25 @@
 2020-05-20  Nikita Vasilyev  
 
+Web Inspector: Left/Right arrow keys should collapse/expand details sections
+https://bugs.webkit.org/show_bug.cgi?id=212064
+
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/DetailsSection.js:
+(WI.DetailsSection):
+(WI.DetailsSection.prototype._headerElementClicked):
+(WI.DetailsSection.prototype._handleHeaderElementKeyDown):
+Use keydown event instead of keypress because the latter doesn't fire for arrow keys.
+Drive-by: remove unused `expandedByUser`.
+
+* UserInterface/Views/ExpandableView.js:
+(WI.ExpandableView):
+(WI.ExpandableView.prototype._handleDisclosureButtonKeyDown):
+Computed panel items should also collapse/expand by pressing Left/Right keys.
+
+2020-05-20  Nikita Vasilyev  
+
 REGRESSION(r260978): Web Inspector: Styles: Pressing Space no longer toggles selected properties
 https://bugs.webkit.org/show_bug.cgi?id=212121
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js (261961 => 261962)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js	2020-05-20 21:51:57 UTC (rev 261961)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js	2020-05-20 22:08:13 UTC (rev 261962)
@@ -37,7 +37,7 @@
 this._headerElement = document.createElement("div");
 this._headerElement.addEventListener("mousedown", this._headerElementMouseDown.bind(this));
 this._headerElement.addEventListener("click", this._headerElementClicked.bind(this));
-this._headerElement.addEventListener("keypress", this._headerElementKeyPress.bind(this));
+this._headerElement.addEventListener("keydown", this._handleHeaderElementKeyDown.bind(this));
 this._headerElement.className = "header";
 this._headerElement.tabIndex = 0;
 this._element.appendChild(this._headerElement);
@@ -63,7 +63,6 @@
 
 this._collapsedSetting = new WI.Setting(identifier + "-details-section-collapsed", !!defaultCollapsedSettingValue);
 this.collapsed = this._collapsedSetting.value;
-this._expandedByUser = false;
 }
 
 // Public
@@ -127,11 +126,6 @@
 this._contentElement.appendChild(this._groups[i].element);
 }
 
-get expandedByUser()
-{
-return this._expandedByUser;
-}
-
 // Private
 
 _headerElementMouseDown(event)
@@ -153,21 +147,32 @@
 
 let collapsed = this.collapsed;
 this.collapsed = !collapsed;
-this._expandedByUser = collapsed;
 
 this._element.scrollIntoViewIfNeeded(false);
 }
 
-_headerElementKeyPress(event)
+_handleHeaderElementKeyDown(event)
 {
-if (event.code === "Space" || event.code === "Enter") {
-if (this._optionsElement?.contains(event.target))
-return;
+let isSpaceOrEnterKey = event.code === "Space" || event.code === "Enter";
+if (!isSpaceOrEnterKey && event.code !== "ArrowLeft" && event.code !== "ArrowRight")
+return;
 
-let collapsed = this.collapsed;
-this.collapsed = !collapsed;
-this._expandedByUser = collapsed;
+if (this._optionsElement?.contains(event.target))
+return;
+
+event.preventDefault();
+
+if (isSpaceOrEnterKey) {
+this.collapsed = !this.collapsed;
+return;
 }
+
+let collapsed = event.code === "ArrowLeft";
+
+if (WI.resolveLayoutDirectionForElement(this._headerElement) === WI.LayoutDirection.RTL)
+collapsed = !collapsed;
+
+this.collapsed = collapsed;
 }
 
 

[webkit-changes] [261933] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [261933] trunk/Source/WebInspectorUI








Revision 261933
Author nvasil...@apple.com
Date 2020-05-20 11:01:49 -0700 (Wed, 20 May 2020)


Log Message
REGRESSION(r260978): Web Inspector: Styles: Pressing Space no longer toggles selected properties
https://bugs.webkit.org/show_bug.cgi?id=212121

Reviewed by Devin Rousso.

r260978 removed `tabIndex = -1` from the style property element so it wouldn't have a focus outline
when in the Computed panel. However, this also made style properties non-focusable in the Styles panel.

This patch sets `tabIndex = -1` on style property elements when they can be selected (e.g. in the Styles panel).
It doesn't set any tabIndex for style property elements in Computed or Changes panels.

* UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js:
(WI.SpreadsheetCSSStyleDeclarationEditor.prototype.layout):
* UserInterface/Views/SpreadsheetStyleProperty.js:

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (261932 => 261933)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-05-20 17:59:59 UTC (rev 261932)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-05-20 18:01:49 UTC (rev 261933)
@@ -1,3 +1,20 @@
+2020-05-20  Nikita Vasilyev  
+
+REGRESSION(r260978): Web Inspector: Styles: Pressing Space no longer toggles selected properties
+https://bugs.webkit.org/show_bug.cgi?id=212121
+
+Reviewed by Devin Rousso.
+
+r260978 removed `tabIndex = -1` from the style property element so it wouldn't have a focus outline
+when in the Computed panel. However, this also made style properties non-focusable in the Styles panel.
+
+This patch sets `tabIndex = -1` on style property elements when they can be selected (e.g. in the Styles panel).
+It doesn't set any tabIndex for style property elements in Computed or Changes panels.
+
+* UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js:
+(WI.SpreadsheetCSSStyleDeclarationEditor.prototype.layout):
+* UserInterface/Views/SpreadsheetStyleProperty.js:
+
 2020-05-15  Devin Rousso  
 
 Web Inspector: Fails to pretty-print a particular CSS file


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js (261932 => 261933)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js	2020-05-20 17:59:59 UTC (rev 261932)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js	2020-05-20 18:01:49 UTC (rev 261933)
@@ -95,7 +95,7 @@
 let propertyViewPendingStartEditing = null;
 for (let index = 0; index < properties.length; index++) {
 let property = properties[index];
-let propertyView = new WI.SpreadsheetStyleProperty(this, property);
+let propertyView = new WI.SpreadsheetStyleProperty(this, property, {selectable: true});
 propertyView.index = index;
 this.element.append(propertyView.element);
 this._propertyViews.push(propertyView);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js (261932 => 261933)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js	2020-05-20 17:59:59 UTC (rev 261932)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js	2020-05-20 18:01:49 UTC (rev 261933)
@@ -36,6 +36,9 @@
 this._readOnly = options.readOnly || false;
 this._element = document.createElement("div");
 
+if (options.selectable)
+this._element.tabIndex = -1;
+
 this._contentElement = null;
 this._nameElement = null;
 this._valueElement = null;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [261716] trunk/LayoutTests

[nvasilyev]

Title: [261716] trunk/LayoutTests








Revision 261716
Author nvasil...@apple.com
Date 2020-05-14 15:42:45 -0700 (Thu, 14 May 2020)


Log Message
REGRESSION (r261703): [ Mac ] inspector/css/getMatchedStylesForNode.html is failing
https://bugs.webkit.org/show_bug.cgi?id=211918


Reviewed by Timothy Hatcher.

Rebaseline tests after CSS.StyleSheetOrigin.Regular was renamed to CSS.StyleSheetOrigin.Author.

* inspector/css/getMatchedStylesForNode-expected.txt:

Modified Paths

trunk/LayoutTests/ChangeLog
trunk/LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt




Diff

Modified: trunk/LayoutTests/ChangeLog (261715 => 261716)

--- trunk/LayoutTests/ChangeLog	2020-05-14 22:41:26 UTC (rev 261715)
+++ trunk/LayoutTests/ChangeLog	2020-05-14 22:42:45 UTC (rev 261716)
@@ -1,3 +1,15 @@
+2020-05-14  Nikita Vasilyev  
+
+REGRESSION (r261703): [ Mac ] inspector/css/getMatchedStylesForNode.html is failing
+https://bugs.webkit.org/show_bug.cgi?id=211918
+
+
+Reviewed by Timothy Hatcher.
+
+Rebaseline tests after CSS.StyleSheetOrigin.Regular was renamed to CSS.StyleSheetOrigin.Author.
+
+* inspector/css/getMatchedStylesForNode-expected.txt:
+
 2020-05-14  Truitt Savell  
 
 (r260169) [ iOS ] http/tests/resourceLoadStatistics/standalone-web-application-exempt-from-website-data-deletion-database.html is a flaky timeout


Modified: trunk/LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt (261715 => 261716)

--- trunk/LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt	2020-05-14 22:41:26 UTC (rev 261715)
+++ trunk/LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt	2020-05-14 22:42:45 UTC (rev 261716)
@@ -93,7 +93,7 @@
 "text": "div"
   },
   "sourceLine": "",
-  "origin": "regular",
+  "origin": "author",
   "style": {
 "cssProperties": [
   {
@@ -129,7 +129,7 @@
 "text": "div"
   },
   "sourceLine": "",
-  "origin": "regular",
+  "origin": "author",
   "style": {
 "cssProperties": [
   {






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [261703] trunk

[nvasilyev]

Title: [261703] trunk








Revision 261703
Author nvasil...@apple.com
Date 2020-05-14 12:28:41 -0700 (Thu, 14 May 2020)


Log Message
Web Inspector: front-end shouldn't change the order of User Style Sheet rules
https://bugs.webkit.org/show_bug.cgi?id=210893


Reviewed by Devin Rousso.

Source/WebCore:

Previously, some style sheets were falsly detected as Inspector::Protocol::CSS::StyleSheetOrigin::User
causing incorrect order of style rules in Web Inspector.

Test: inspector/css/getMatchedStylesForNode.html

* inspector/agents/InspectorCSSAgent.cpp:
(WebCore::InspectorCSSAgent::detectOrigin):

LayoutTests:

Test that AuthorCSS and UserCSS are correctly arranged.

* inspector/css/getMatchedStylesForNode-expected.txt:
* inspector/css/getMatchedStylesForNode.html:

Modified Paths

trunk/LayoutTests/ChangeLog
trunk/LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt
trunk/LayoutTests/inspector/css/getMatchedStylesForNode.html
trunk/Source/WebCore/ChangeLog
trunk/Source/WebCore/inspector/agents/InspectorCSSAgent.cpp




Diff

Modified: trunk/LayoutTests/ChangeLog (261702 => 261703)

--- trunk/LayoutTests/ChangeLog	2020-05-14 19:04:30 UTC (rev 261702)
+++ trunk/LayoutTests/ChangeLog	2020-05-14 19:28:41 UTC (rev 261703)
@@ -1,3 +1,16 @@
+2020-05-14  Nikita Vasilyev  
+
+Web Inspector: front-end shouldn't change the order of User Style Sheet rules
+https://bugs.webkit.org/show_bug.cgi?id=210893
+
+
+Reviewed by Devin Rousso.
+
+Test that AuthorCSS and UserCSS are correctly arranged.
+
+* inspector/css/getMatchedStylesForNode-expected.txt:
+* inspector/css/getMatchedStylesForNode.html:
+
 2020-05-14  Ryan Haddad  
 
 Unreviewed test gardening, remove expectations for tests that are no longer failing.


Modified: trunk/LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt (261702 => 261703)

--- trunk/LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt	2020-05-14 19:04:30 UTC (rev 261702)
+++ trunk/LayoutTests/inspector/css/getMatchedStylesForNode-expected.txt	2020-05-14 19:28:41 UTC (rev 261703)
@@ -20,6 +20,148 @@
 ]
   }
 ],
+"text": "div"
+  },
+  "sourceLine": "",
+  "origin": "user",
+  "style": {
+"cssProperties": [
+  {
+"name": "z-index",
+"value": "600"
+  }
+],
+"shorthandEntries": [],
+"styleId": "",
+"width": "",
+"height": ""
+  },
+  "sourceURL": ""
+},
+"matchingSelectors": [
+  0
+]
+  },
+  {
+"rule": {
+  "selectorList": {
+"selectors": [
+  {
+"text": "div",
+"specificity": [
+  0,
+  0,
+  1
+]
+  }
+],
+"text": "div"
+  },
+  "sourceLine": "",
+  "origin": "user",
+  "style": {
+"cssProperties": [
+  {
+"name": "z-index",
+"value": "500"
+  }
+],
+"shorthandEntries": [],
+"styleId": "",
+"width": "",
+"height": ""
+  },
+  "sourceURL": ""
+},
+"matchingSelectors": [
+  0
+]
+  },
+  {
+"rule": {
+  "selectorList": {
+"selectors": [
+  {
+"text": "div",
+"specificity": [
+  0,
+  0,
+  1
+]
+  }
+],
+"text": "div"
+  },
+  "sourceLine": "",
+  "origin": "regular",
+  "style": {
+"cssProperties": [
+  {
+"name": "z-index",
+"value": "400"
+  }
+],
+"shorthandEntries": [],
+"styleId": "",
+"width": "",
+"height": ""
+  },
+  "sourceURL": "",
+  "ruleId": ""
+},
+"matchingSelectors": [
+  0
+]
+  },
+  {
+"rule": {
+  "selectorList": {
+"selectors": [
+  {
+"text": "div",
+"specificity": [
+  0,
+  0,
+  1
+]
+  }
+],
+"text": "div"
+  },
+  "sourceLine": "",
+  "origin": "regular",
+  "style": {
+"cssProperties": [
+  {
+"name": "z-index",
+"value": "300"
+  }
+],
+"shorthandEntries": [],
+"styleId": "",
+"width": "",
+"height": ""
+  },
+  "sourceURL": "",
+  "ruleId": ""
+},
+"matchingSelectors": [
+  0
+]
+  },
+  {
+"rule": {
+  "selectorList": {
+"selectors": [
+  {
+"text": "div",
+"specificity": [
+  0,
+  0,
+  1
+]
+  }
+],
 "text": "div",
 "range": ""
   },


Modified: trunk/LayoutTests/inspector/css/getMatchedStylesForNode.html (261702 => 261703)

--- 

[webkit-changes] [261362] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [261362] trunk/Source/WebInspectorUI








Revision 261362
Author nvasil...@apple.com
Date 2020-05-07 18:04:02 -0700 (Thu, 07 May 2020)


Log Message
Web Inspector: Timelines: visible outline after clicking the close X button
https://bugs.webkit.org/show_bug.cgi?id=211604


Reviewed by Timothy Hatcher.

Never display focus outline for TreeOutline items.

* UserInterface/Views/TreeOutline.css:
(.tree-outline .item):
(body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.selected):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (261361 => 261362)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-05-08 00:39:24 UTC (rev 261361)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-05-08 01:04:02 UTC (rev 261362)
@@ -1,3 +1,17 @@
+2020-05-07  Nikita Vasilyev  
+
+Web Inspector: Timelines: visible outline after clicking the close X button
+https://bugs.webkit.org/show_bug.cgi?id=211604
+
+
+Reviewed by Timothy Hatcher.
+
+Never display focus outline for TreeOutline items.
+
+* UserInterface/Views/TreeOutline.css:
+(.tree-outline .item):
+(body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.selected):
+
 2020-05-07  Devin Rousso  
 
 Web Inspector: Uncaught Exception: TypeError: null is not an object (evaluating 'mimeType.endsWith')


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.css (261361 => 261362)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.css	2020-05-08 00:39:24 UTC (rev 261361)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.css	2020-05-08 01:04:02 UTC (rev 261362)
@@ -52,6 +52,7 @@
 border-top: 1px solid transparent;
 
 white-space: nowrap;
+outline: none;
 }
 
 .tree-outline.compact .item {
@@ -178,7 +179,6 @@
 body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.selected {
 color: var(--selected-foreground-color);
 background-color: var(--selected-background-color);
-outline: none;
 }
 
 .tree-outline .item .titles {






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [261127] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [261127] trunk/Source/WebInspectorUI








Revision 261127
Author nvasil...@apple.com
Date 2020-05-04 17:03:54 -0700 (Mon, 04 May 2020)


Log Message
Web Inspector: Tabs jiggle on click
https://bugs.webkit.org/show_bug.cgi?id=211177


Reviewed by Devin Rousso.

Currently, tab dragging starts immediately after mouse down. With this patch,
dragging starts only after the mouse cursor moving 12 pixels. This roughly matches
macOS Safari tabs.

* UserInterface/Views/TabBar.js:
(WI.TabBar):
(WI.TabBar.prototype._handleTabContainerMouseDown):
(WI.TabBar.prototype._handleMouseUp):
(WI.TabBar.prototype._handleTabContainerMouseLeave):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/TabBar.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (261126 => 261127)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-05-04 23:55:06 UTC (rev 261126)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-05-05 00:03:54 UTC (rev 261127)
@@ -1,3 +1,21 @@
+2020-05-04  Nikita Vasilyev  
+
+Web Inspector: Tabs jiggle on click
+https://bugs.webkit.org/show_bug.cgi?id=211177
+
+
+Reviewed by Devin Rousso.
+
+Currently, tab dragging starts immediately after mouse down. With this patch,
+dragging starts only after the mouse cursor moving 12 pixels. This roughly matches
+macOS Safari tabs.
+
+* UserInterface/Views/TabBar.js:
+(WI.TabBar):
+(WI.TabBar.prototype._handleTabContainerMouseDown):
+(WI.TabBar.prototype._handleMouseUp):
+(WI.TabBar.prototype._handleTabContainerMouseLeave):
+
 2020-05-04  Devin Rousso  
 
 Web Inspector: drop support for iOS 9.*


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TabBar.js (261126 => 261127)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TabBar.js	2020-05-04 23:55:06 UTC (rev 261126)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TabBar.js	2020-05-05 00:03:54 UTC (rev 261127)
@@ -66,6 +66,9 @@
 this._tabPickerTabBarItem.hidden = true;
 this._tabPickerTabBarItem.element.classList.add("tab-picker");
 this.addTabBarItem(this._tabPickerTabBarItem, {suppressAnimations: true});
+
+this._mouseDownPageX = NaN;
+this._isDragging = false;
 }
 
 // Static
@@ -732,7 +735,7 @@
 break;
 }
 
-this._mouseIsDown = true;
+this._mouseDownPageX = event.pageX;
 
 this._mouseMovedEventListener = this._handleMouseMoved.bind(this);
 this._mouseUpEventListener = this._handleMouseUp.bind(this);
@@ -784,8 +787,8 @@
 _handleMouseMoved(event)
 {
 console.assert(event.button === 0);
-console.assert(this._mouseIsDown);
-if (!this._mouseIsDown)
+console.assert(typeof this._mouseDownPageX === "number" && !isNaN(this._mouseDownPageX));
+if (isNaN(this._mouseDownPageX))
 return;
 
 console.assert(this._selectedTabBarItem);
@@ -792,6 +795,17 @@
 if (!this._selectedTabBarItem)
 return;
 
+if (this._mouseOffset === undefined)
+this._mouseOffset = event.pageX - this._selectedTabBarItem.element.totalOffsetLeft;
+
+if (!this._isDragging) {
+const dragThreshold = 12;
+if (Math.abs(this._mouseDownPageX - event.pageX) < dragThreshold)
+return;
+
+this._isDragging = true;
+}
+
 const tabBarLeftPadding = WI.TabBar.horizontalPadding / 2;
 const tabBarItemHorizontalMargin = WI.TabBarItem.horizontalMargin;
 
@@ -806,9 +820,6 @@
 
 let containerOffset = this._tabContainer.totalOffsetLeft;
 
-if (this._mouseOffset === undefined)
-this._mouseOffset = event.pageX - this._selectedTabBarItem.element.totalOffsetLeft;
-
 let tabBarMouseOffset = event.pageX - containerOffset;
 var newLeft = tabBarMouseOffset - this._mouseOffset;
 
@@ -882,8 +893,8 @@
 _handleMouseUp(event)
 {
 console.assert(event.button === 0);
-console.assert(this._mouseIsDown);
-if (!this._mouseIsDown)
+console.assert(typeof this._mouseDownPageX === "number" && !isNaN(this._mouseDownPageX));
+if (isNaN(this._mouseDownPageX))
 return;
 
 this._tabContainer.classList.remove("dragging-tab");
@@ -900,7 +911,8 @@
 }
 }
 
-this._mouseIsDown = false;
+this._isDragging = false;
+this._mouseDownPageX = NaN;
 this._mouseOffset = undefined;
 
 document.removeEventListener("mousemove", this._mouseMovedEventListener, true);
@@ -917,7 +929,7 @@
 
 _handleTabContainerMouseLeave(event)
 {
-if (this._mouseIsDown || !this._tabAnimatedClosedSinceMouseEnter || !this._tabContainer.classList.contains("static-layout") || this._tabContainer.classList.contains("animating"))
+if (!isNaN(this._mouseDownPageX) || 

[webkit-changes] [260978] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [260978] trunk/Source/WebInspectorUI








Revision 260978
Author nvasil...@apple.com
Date 2020-04-30 19:20:44 -0700 (Thu, 30 Apr 2020)


Log Message
Web Inspector: Computed: shouldn't display focus outline on click
https://bugs.webkit.org/show_bug.cgi?id=28


Reviewed by Devin Rousso.

- CSS property view is no longer focusable.
- Disclosure triangle is now tabbable.

* UserInterface/Views/ComputedStyleSection.css:
(.computed-style-section .computed-property-item):
(.computed-style-section .computed-property-item.expanded):
(.computed-style-section .computed-property-item > .disclosure-button:focus):
* UserInterface/Views/ExpandableView.js:
(WI.ExpandableView):
(WI.ExpandableView.prototype._onDisclosureButtonClick):
(WI.ExpandableView.prototype._update):
Drive-by: add `ariaExpanded` so VoiceOver reads whether it's expanded or collapsed.

* UserInterface/Views/SpreadsheetStyleProperty.js:
Remove tabIndex so we don't show any focus outline around the entire CSS property view.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleSection.css
trunk/Source/WebInspectorUI/UserInterface/Views/ExpandableView.js
trunk/Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (260977 => 260978)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-05-01 01:47:47 UTC (rev 260977)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-05-01 02:20:44 UTC (rev 260978)
@@ -1,3 +1,27 @@
+2020-04-30  Nikita Vasilyev  
+
+Web Inspector: Computed: shouldn't display focus outline on click
+https://bugs.webkit.org/show_bug.cgi?id=28
+
+
+Reviewed by Devin Rousso.
+
+- CSS property view is no longer focusable.
+- Disclosure triangle is now tabbable.
+
+* UserInterface/Views/ComputedStyleSection.css:
+(.computed-style-section .computed-property-item):
+(.computed-style-section .computed-property-item.expanded):
+(.computed-style-section .computed-property-item > .disclosure-button:focus):
+* UserInterface/Views/ExpandableView.js:
+(WI.ExpandableView):
+(WI.ExpandableView.prototype._onDisclosureButtonClick):
+(WI.ExpandableView.prototype._update):
+Drive-by: add `ariaExpanded` so VoiceOver reads whether it's expanded or collapsed.
+
+* UserInterface/Views/SpreadsheetStyleProperty.js:
+Remove tabIndex so we don't show any focus outline around the entire CSS property view.
+
 2020-04-30  Devin Rousso  
 
 WebKit.WebContent process crashes when web developer tools are opened in Safari


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleSection.css (260977 => 260978)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleSection.css	2020-05-01 01:47:47 UTC (rev 260977)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ComputedStyleSection.css	2020-05-01 02:20:44 UTC (rev 260978)
@@ -32,10 +32,9 @@
 .computed-style-section .computed-property-item {
 box-sizing: border-box;
 max-width: 100%;
-min-height: var(--disclosure-button-size);
+min-height: calc(var(--disclosure-button-size));
 padding-left: calc(var(--disclosure-button-size) + 6px);
 padding-right: var(--css-declaration-horizontal-padding);
-border-top: 0.5px solid transparent;
 overflow: hidden;
 text-overflow: ellipsis;
 }
@@ -43,13 +42,20 @@
 .computed-style-section .computed-property-item.expanded {
 padding-bottom: 2px;
 background-color: hsl(0, 0%, 97%);
-border-top-color: var(--text-color-quaternary);
+border-top: 0.5px solid var(--text-color-quaternary);
+border-bottom: 0.5px solid var(--text-color-quaternary);
 }
 
-.computed-style-section .computed-property-item.expanded + .computed-property-item {
-border-top-color: var(--text-color-quaternary);
+.computed-style-section .computed-property-item.expanded + .computed-property-item.expanded {
+border-top: none;
 }
 
+.computed-style-section .computed-property-item > .disclosure-button:focus {
+outline: auto -webkit-focus-ring-color;
+outline-offset: -3px; /* Make focus outline smaller than usual so it doesn't get clipped here. */
+border-radius: calc((var(--disclosure-button-size) / 2) - 2px);
+}
+
 .computed-style-section .computed-property-item .disclosure-button {
 display: inline-block;
 width: var(--disclosure-button-size);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ExpandableView.js (260977 => 260978)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ExpandableView.js	2020-05-01 01:47:47 UTC (rev 260977)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ExpandableView.js	2020-05-01 02:20:44 UTC (rev 260978)
@@ -30,19 +30,17 @@
 this._element = document.createElement("div");
 
 if (childElement) {
-let disclosureButton = document.createElement("button");
-

[webkit-changes] [260853] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [260853] trunk/Source/WebInspectorUI








Revision 260853
Author nvasil...@apple.com
Date 2020-04-28 15:57:27 -0700 (Tue, 28 Apr 2020)


Log Message
Web Inspector: Debug: "Outline focused element" should also outline elements with tabIndex=0
https://bugs.webkit.org/show_bug.cgi?id=211109

Reviewed by Devin Rousso.

* UserInterface/Debug/Bootstrap.css:
(body.focus-debug [tabindex="0"]):
(body.focus-debug *:focus):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Debug/Bootstrap.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (260852 => 260853)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-04-28 22:42:23 UTC (rev 260852)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-04-28 22:57:27 UTC (rev 260853)
@@ -1,3 +1,14 @@
+2020-04-28  Nikita Vasilyev  
+
+Web Inspector: Debug: "Outline focused element" should also outline elements with tabIndex=0
+https://bugs.webkit.org/show_bug.cgi?id=211109
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Debug/Bootstrap.css:
+(body.focus-debug [tabindex="0"]):
+(body.focus-debug *:focus):
+
 2020-04-28  Devin Rousso  
 
 Web Inspector: find dialog does not populate search string from system find pasteboard


Modified: trunk/Source/WebInspectorUI/UserInterface/Debug/Bootstrap.css (260852 => 260853)

--- trunk/Source/WebInspectorUI/UserInterface/Debug/Bootstrap.css	2020-04-28 22:42:23 UTC (rev 260852)
+++ trunk/Source/WebInspectorUI/UserInterface/Debug/Bootstrap.css	2020-04-28 22:57:27 UTC (rev 260853)
@@ -23,8 +23,13 @@
  * THE POSSIBILITY OF SUCH DAMAGE.
  */
 
+body.focus-debug [tabindex="0"] {
+outline: 1px solid hsla(300, 100%, 50%, 0.4) !important;
+outline-offset: -2px !important;
+}
+
 body.focus-debug *:focus {
-outline: 2px solid fuchsia !important;
+outline: 2px solid hsl(300, 100%, 50%) !important;
 outline-offset: -1px !important;
 }
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [260839] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [260839] trunk/Source/WebInspectorUI








Revision 260839
Author nvasil...@apple.com
Date 2020-04-28 12:18:42 -0700 (Tue, 28 Apr 2020)


Log Message
Web Inspector: Elements: Classes toggle button has wrong outline on focus
https://bugs.webkit.org/show_bug.cgi?id=211104


Reviewed by Devin Rousso.

* UserInterface/Views/GeneralStyleDetailsSidebarPanel.css:
(.sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle:focus):
* UserInterface/Views/Variables.css:
(:root):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.css
trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (260838 => 260839)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-04-28 19:07:30 UTC (rev 260838)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-04-28 19:18:42 UTC (rev 260839)
@@ -1,3 +1,16 @@
+2020-04-28  Nikita Vasilyev  
+
+Web Inspector: Elements: Classes toggle button has wrong outline on focus
+https://bugs.webkit.org/show_bug.cgi?id=211104
+
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/GeneralStyleDetailsSidebarPanel.css:
+(.sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle:focus):
+* UserInterface/Views/Variables.css:
+(:root):
+
 2020-04-27  Nikita Vasilyev  
 
 REGRESSION (r258730): Web Inspector: Sidebar tabs have incorrect tabIndex


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.css (260838 => 260839)

--- trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.css	2020-04-28 19:07:30 UTC (rev 260838)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.css	2020-04-28 19:18:42 UTC (rev 260839)
@@ -106,6 +106,10 @@
 -webkit-appearance: none;
 }
 
+.sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle:focus {
+outline-offset: var(--focus-ring-outline-offset);
+}
+
 .sidebar > .panel.details.css-style > .content ~ .options-container > .toggle-class-toggle::before {
 position: absolute;
 content: "";


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css (260838 => 260839)

--- trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css	2020-04-28 19:07:30 UTC (rev 260838)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css	2020-04-28 19:18:42 UTC (rev 260839)
@@ -183,6 +183,8 @@
 --odd-zebra-stripe-row-background-color: white;
 --transparent-stripe-background-gradient: linear-gradient(to bottom, transparent, transparent 50%, hsla(0, 0%, 0%, 0.03) 50%, hsla(0, 0%, 0%, 0.03)) top left / 100% 40px;
 
+--focus-ring-outline-offset: -2px;
+
 --undocked-title-area-height: 0px;
 --tab-bar-height: var(--navigation-bar-height);
 --navigation-bar-height: 29px;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [260761] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [260761] trunk/Source/WebInspectorUI








Revision 260761
Author nvasil...@apple.com
Date 2020-04-27 09:31:30 -0700 (Mon, 27 Apr 2020)


Log Message
REGRESSION (r258730): Web Inspector: Sidebar tabs have incorrect tabIndex
https://bugs.webkit.org/show_bug.cgi?id=211072


Reviewed by Brian Burg.

Only selected radio button should be focusable. This matches native macOS radio buttons.

* UserInterface/Views/RadioButtonNavigationItem.js:
(WI.RadioButtonNavigationItem.prototype.get tabbable):
This getter was incorrectly returning -1 or 0 instead of a boolean value.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (260760 => 260761)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-04-27 16:18:09 UTC (rev 260760)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-04-27 16:31:30 UTC (rev 260761)
@@ -1,3 +1,17 @@
+2020-04-27  Nikita Vasilyev  
+
+REGRESSION (r258730): Web Inspector: Sidebar tabs have incorrect tabIndex
+https://bugs.webkit.org/show_bug.cgi?id=211072
+
+
+Reviewed by Brian Burg.
+
+Only selected radio button should be focusable. This matches native macOS radio buttons.
+
+* UserInterface/Views/RadioButtonNavigationItem.js:
+(WI.RadioButtonNavigationItem.prototype.get tabbable):
+This getter was incorrectly returning -1 or 0 instead of a boolean value.
+
 2020-04-27  Diego Pino Garcia  
 
 Unreviewed, reverting r260672.


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js (260760 => 260761)

--- trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js	2020-04-27 16:18:09 UTC (rev 260760)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js	2020-04-27 16:31:30 UTC (rev 260761)
@@ -69,7 +69,7 @@
 
 get tabbable()
 {
-return this.selected ? 0 : -1;
+return this.selected;
 }
 };
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [260108] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [260108] trunk/Source/WebInspectorUI








Revision 260108
Author nvasil...@apple.com
Date 2020-04-14 16:58:32 -0700 (Tue, 14 Apr 2020)


Log Message
Web Inspector: Don't show tooltips for tabs
https://bugs.webkit.org/show_bug.cgi?id=210464

Reviewed by Devin Rousso.

Don't show tooltips when they match the name of the tab. We no longer truncate tab names
so the tooltip is redundant.

Only show tooltips for settings and search (pinned tabs).

* UserInterface/Views/TabBarItem.js:
(WI.TabBarItem):
(WI.TabBarItem.prototype.set title):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/TabBarItem.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (260107 => 260108)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-04-14 23:57:49 UTC (rev 260107)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-04-14 23:58:32 UTC (rev 260108)
@@ -1,3 +1,19 @@
+2020-04-14  Nikita Vasilyev  
+
+Web Inspector: Don't show tooltips for tabs
+https://bugs.webkit.org/show_bug.cgi?id=210464
+
+Reviewed by Devin Rousso.
+
+Don't show tooltips when they match the name of the tab. We no longer truncate tab names
+so the tooltip is redundant.
+
+Only show tooltips for settings and search (pinned tabs).
+
+* UserInterface/Views/TabBarItem.js:
+(WI.TabBarItem):
+(WI.TabBarItem.prototype.set title):
+
 2020-04-14  Devin Rousso  
 
 Web Inspector: Elements: Computed: de-indent items in the Variables section so that wrapped content doesn't line up with the `--`


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TabBarItem.js (260107 => 260108)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TabBarItem.js	2020-04-14 23:57:49 UTC (rev 260107)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TabBarItem.js	2020-04-14 23:58:32 UTC (rev 260108)
@@ -46,7 +46,7 @@
 this._element.createChild("div", "flex-space");
 
 this.displayName = displayName;
-this.title = title || displayName;
+this.title = title;
 this.image = image;
 }
 
@@ -130,7 +130,10 @@
 
 this._title = title;
 
-this._element.title = this._title;
+if (!this._title)
+this._element.removeAttribute("title");
+else
+this._element.title = this._title;
 }
 };
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [259666] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [259666] trunk/Source/WebInspectorUI








Revision 259666
Author nvasil...@apple.com
Date 2020-04-07 13:17:53 -0700 (Tue, 07 Apr 2020)


Log Message
Web Inspector: focus outline of scope bar is clipped
https://bugs.webkit.org/show_bug.cgi?id=209877


Reviewed by Timothy Hatcher.

* UserInterface/Views/ScopeBar.css:
(.scope-bar):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (259665 => 259666)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-04-07 20:07:46 UTC (rev 259665)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-04-07 20:17:53 UTC (rev 259666)
@@ -1,3 +1,14 @@
+2020-04-07  Nikita Vasilyev  
+
+Web Inspector: focus outline of scope bar is clipped
+https://bugs.webkit.org/show_bug.cgi?id=209877
+
+
+Reviewed by Timothy Hatcher.
+
+* UserInterface/Views/ScopeBar.css:
+(.scope-bar):
+
 2020-04-03  Devin Rousso  
 
 Web Inspector: Sources: disclosure arrows should be shown if a folder is added to the navigation sidebar


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css (259665 => 259666)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css	2020-04-07 20:07:46 UTC (rev 259665)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css	2020-04-07 20:17:53 UTC (rev 259666)
@@ -25,7 +25,6 @@
 
 .scope-bar {
 padding: 0 3px;
-overflow: hidden;
 
 --scope-bar-margin-default: 2px;
 --scope-bar-padding-default: 6px;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [259423] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [259423] trunk/Source/WebInspectorUI








Revision 259423
Author nvasil...@apple.com
Date 2020-04-02 16:18:50 -0700 (Thu, 02 Apr 2020)


Log Message
Web Inspector: Network tab summary bar jiggles
https://bugs.webkit.org/show_bug.cgi?id=209927

Reviewed by Timothy Hatcher.

* UserInterface/Views/NetworkTableContentView.css:
(.network-table > .statistics > .statistic > .text):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (259422 => 259423)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-04-02 22:52:12 UTC (rev 259422)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-04-02 23:18:50 UTC (rev 259423)
@@ -1,3 +1,13 @@
+2020-04-02  Nikita Vasilyev  
+
+Web Inspector: Network tab summary bar jiggles
+https://bugs.webkit.org/show_bug.cgi?id=209927
+
+Reviewed by Timothy Hatcher.
+
+* UserInterface/Views/NetworkTableContentView.css:
+(.network-table > .statistics > .statistic > .text):
+
 2020-04-01  Nikita Vasilyev  
 
 Web Inspector: Use ECMAScript Numeric Separators for numbers with 5 or more digits


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css (259422 => 259423)

--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css	2020-04-02 22:52:12 UTC (rev 259422)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css	2020-04-02 23:18:50 UTC (rev 259423)
@@ -349,6 +349,7 @@
 padding-top: 1px;
 -webkit-padding-start: 4px;
 -webkit-user-select: all;
+font-variant-numeric: tabular-nums;
 }
 
 @media (prefers-color-scheme: dark) {
@@ -367,4 +368,4 @@
 .network-table > .table .cell.dom-node.name .icon {
 content: url(../Images/TypeIcons.svg#DOMElement-dark);
 }
-}
\ No newline at end of file
+}






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [259368] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [259368] trunk/Source/WebInspectorUI








Revision 259368
Author nvasil...@apple.com
Date 2020-04-01 15:50:16 -0700 (Wed, 01 Apr 2020)


Log Message
Web Inspector: Use ECMAScript Numeric Separators for numbers with 5 or more digits
https://bugs.webkit.org/show_bug.cgi?id=209879

Reviewed by Joseph Pecoraro.

Instead of `100` write `1_000_000` so it's easier to read.

* UserInterface/Base/Utilities.js:
* UserInterface/Controllers/_javascript_LogViewController.js:
* UserInterface/Controllers/TimelineManager.js:
* UserInterface/Models/Gradient.js:
(WI.Gradient.prototype.stringFromStops):
* UserInterface/Models/HeapAllocationsInstrument.js:
(WI.HeapAllocationsInstrument.prototype.startInstrumentation):
* UserInterface/Protocol/Connection.js:
(InspectorBackend.Connection.prototype._dispatchResponse):
* UserInterface/Views/Layers3DContentView.js:
(WI.Layers3DContentView.prototype.initialLayout):
* UserInterface/Views/NetworkTableContentView.js:
(WI.NetworkTableContentView.prototype._updateLoadTimeStatistic):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js
trunk/Source/WebInspectorUI/UserInterface/Controllers/_javascript_LogViewController.js
trunk/Source/WebInspectorUI/UserInterface/Controllers/TimelineManager.js
trunk/Source/WebInspectorUI/UserInterface/Models/Gradient.js
trunk/Source/WebInspectorUI/UserInterface/Models/HeapAllocationsInstrument.js
trunk/Source/WebInspectorUI/UserInterface/Protocol/Connection.js
trunk/Source/WebInspectorUI/UserInterface/Views/Layers3DContentView.js
trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (259367 => 259368)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-04-01 22:32:39 UTC (rev 259367)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-04-01 22:50:16 UTC (rev 259368)
@@ -1,3 +1,26 @@
+2020-04-01  Nikita Vasilyev  
+
+Web Inspector: Use ECMAScript Numeric Separators for numbers with 5 or more digits
+https://bugs.webkit.org/show_bug.cgi?id=209879
+
+Reviewed by Joseph Pecoraro.
+
+Instead of `100` write `1_000_000` so it's easier to read.
+
+* UserInterface/Base/Utilities.js:
+* UserInterface/Controllers/_javascript_LogViewController.js:
+* UserInterface/Controllers/TimelineManager.js:
+* UserInterface/Models/Gradient.js:
+(WI.Gradient.prototype.stringFromStops):
+* UserInterface/Models/HeapAllocationsInstrument.js:
+(WI.HeapAllocationsInstrument.prototype.startInstrumentation):
+* UserInterface/Protocol/Connection.js:
+(InspectorBackend.Connection.prototype._dispatchResponse):
+* UserInterface/Views/Layers3DContentView.js:
+(WI.Layers3DContentView.prototype.initialLayout):
+* UserInterface/Views/NetworkTableContentView.js:
+(WI.NetworkTableContentView.prototype._updateLoadTimeStatistic):
+
 2020-03-31  Jon Davis  
 
 Added new WebSocket icon


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js (259367 => 259368)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js	2020-04-01 22:32:39 UTC (rev 259367)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Utilities.js	2020-04-01 22:50:16 UTC (rev 259368)
@@ -1348,13 +1348,13 @@
 if (num < 1000)
 return num.toLocaleString();
 
-if (num < 100)
+if (num < 1_000_000)
 return WI.UIString("%.1fK").format(Math.round(num / 100) / 10);
 
-if (num < 10)
-return WI.UIString("%.1fM").format(Math.round(num / 10) / 10);
+if (num < 1_000_000_000)
+return WI.UIString("%.1fM").format(Math.round(num / 100_000) / 10);
 
-return WI.UIString("%.1fB").format(Math.round(num / 1) / 10);
+return WI.UIString("%.1fB").format(Math.round(num / 100_000_000) / 10);
 }
 });
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Controllers/_javascript_LogViewController.js (259367 => 259368)

--- trunk/Source/WebInspectorUI/UserInterface/Controllers/_javascript_LogViewController.js	2020-04-01 22:32:39 UTC (rev 259367)
+++ trunk/Source/WebInspectorUI/UserInterface/Controllers/_javascript_LogViewController.js	2020-04-01 22:50:16 UTC (rev 259368)
@@ -362,5 +362,5 @@
 }
 };
 
-WI._javascript_LogViewController.CachedPropertiesDuration = 3;
+WI._javascript_LogViewController.CachedPropertiesDuration = 30_000;
 WI._javascript_LogViewController.IgnoredRepeatCount = Symbol("ignored-repeat-count");


Modified: trunk/Source/WebInspectorUI/UserInterface/Controllers/TimelineManager.js (259367 => 259368)

--- trunk/Source/WebInspectorUI/UserInterface/Controllers/TimelineManager.js	2020-04-01 22:32:39 UTC (rev 259367)
+++ trunk/Source/WebInspectorUI/UserInterface/Controllers/TimelineManager.js	2020-04-01 22:50:16 UTC (rev 259368)
@@ -1440,6 +1440,6 @@
 RecordingImported: 

[webkit-changes] [259277] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [259277] trunk/Source/WebInspectorUI








Revision 259277
Author nvasil...@apple.com
Date 2020-03-30 20:32:05 -0700 (Mon, 30 Mar 2020)


Log Message
Web Inspector: the Dock Side navigation item is automatically focused when Web Inspector is opened detached, preventing any global spacebar shortcuts from working
https://bugs.webkit.org/show_bug.cgi?id=209760

Reviewed by Devin Rousso.

When undocking, Web Inspector focuses on the first visible focusable element. I don't know why.
This patch restores the focus to the previously focused element.

* UserInterface/Base/Main.js:

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Main.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (259276 => 259277)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-31 03:12:12 UTC (rev 259276)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-31 03:32:05 UTC (rev 259277)
@@ -1,3 +1,15 @@
+2020-03-30  Nikita Vasilyev  
+
+Web Inspector: the Dock Side navigation item is automatically focused when Web Inspector is opened detached, preventing any global spacebar shortcuts from working
+https://bugs.webkit.org/show_bug.cgi?id=209760
+
+Reviewed by Devin Rousso.
+
+When undocking, Web Inspector focuses on the first visible focusable element. I don't know why.
+This patch restores the focus to the previously focused element.
+
+* UserInterface/Base/Main.js:
+
 2020-03-30  Devin Rousso  
 
 Web Inspector: REGRESSION(r259101): items in the contextmenu of the tab bar don't have any text


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Main.js (259276 => 259277)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2020-03-31 03:12:12 UTC (rev 259276)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2020-03-31 03:32:05 UTC (rev 259277)
@@ -901,6 +901,19 @@
 
 if (!WI.dockedConfigurationSupportsSplitContentBrowser() && !WI.doesCurrentTabSupportSplitContentBrowser())
 WI.hideSplitConsole();
+
+if (side === WI.DockConfiguration.Undocked && WI.Platform.name === "mac") {
+// When undocking, the first visible focusable element steals focus. Undo this.
+document.body.addEventListener("focusin", function(event) {
+let firstFocusableElement = document.querySelector("[tabindex='0']:not(.hidden)");
+if (firstFocusableElement === event.target) {
+if (WI.previousFocusElement)
+WI.previousFocusElement.focus();
+else
+event.target.blur();
+}
+}, {once: true, capture: true});
+}
 };
 
 WI.resizeDockedFrameMouseDown = function(event)






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [259168] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [259168] trunk/Source/WebInspectorUI








Revision 259168
Author nvasil...@apple.com
Date 2020-03-28 19:52:35 -0700 (Sat, 28 Mar 2020)


Log Message
Web Inspector: Network: pressing RightArrow or LeftArrow unexpectedly changes panels
https://bugs.webkit.org/show_bug.cgi?id=209625


Reviewed by Timothy Hatcher.

* UserInterface/Views/NavigationBar.js:
(WI.NavigationBar.prototype._keyDown):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (259167 => 259168)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-29 02:50:19 UTC (rev 259167)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-29 02:52:35 UTC (rev 259168)
@@ -1,3 +1,14 @@
+2020-03-28  Nikita Vasilyev  
+
+Web Inspector: Network: pressing RightArrow or LeftArrow unexpectedly changes panels
+https://bugs.webkit.org/show_bug.cgi?id=209625
+
+
+Reviewed by Timothy Hatcher.
+
+* UserInterface/Views/NavigationBar.js:
+(WI.NavigationBar.prototype._keyDown):
+
 2020-03-27  Devin Rousso  
 
 Web Inspector: should also escape the method when Copy as cURL


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js (259167 => 259168)

--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js	2020-03-29 02:50:19 UTC (rev 259167)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js	2020-03-29 02:52:35 UTC (rev 259168)
@@ -372,6 +372,9 @@
 if (!isLeftArrow && event.code !== "ArrowRight")
 return;
 
+if (this._selectedNavigationItem?.element !== document.activeElement)
+return;
+
 event.preventDefault();
 event.stopPropagation();
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [259094] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [259094] trunk/Source/WebInspectorUI








Revision 259094
Author nvasil...@apple.com
Date 2020-03-26 17:11:31 -0700 (Thu, 26 Mar 2020)


Log Message
Web Inspector: RTL: ArrowLeft and ArrowRight keys select wrong navigation bar items
https://bugs.webkit.org/show_bug.cgi?id=209617

Reviewed by Devin Rousso.

* UserInterface/Views/NavigationBar.js:
(WI.NavigationBar.prototype._keyDown):
Reverse direction for RTL mode.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (259093 => 259094)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-26 23:54:19 UTC (rev 259093)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-27 00:11:31 UTC (rev 259094)
@@ -1,3 +1,14 @@
+2020-03-26  Nikita Vasilyev  
+
+Web Inspector: RTL: ArrowLeft and ArrowRight keys select wrong navigation bar items
+https://bugs.webkit.org/show_bug.cgi?id=209617
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/NavigationBar.js:
+(WI.NavigationBar.prototype._keyDown):
+Reverse direction for RTL mode.
+
 2020-03-23  Devin Rousso  
 
 Web Inspector: REGRESSION(r257791): event breakpoint icon should be [E]


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js (259093 => 259094)

--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js	2020-03-26 23:54:19 UTC (rev 259093)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js	2020-03-27 00:11:31 UTC (rev 259094)
@@ -368,32 +368,35 @@
 
 _keyDown(event)
 {
-if (event.keyIdentifier !== "Left" && event.keyIdentifier !== "Right")
+let isLeftArrow = event.code === "ArrowLeft";
+if (!isLeftArrow && event.code !== "ArrowRight")
 return;
 
 event.preventDefault();
 event.stopPropagation();
 
-var selectedNavigationItemIndex = this._navigationItems.indexOf(this._selectedNavigationItem);
+let delta = isLeftArrow ? -1 : 1;
+if (WI.resolveLayoutDirectionForElement(this._element) === WI.LayoutDirection.RTL)
+delta *= -1;
 
-if (event.keyIdentifier === "Left") {
-if (selectedNavigationItemIndex === -1)
-selectedNavigationItemIndex = this._navigationItems.length;
+let selectedIndex = this._navigationItems.indexOf(this._selectedNavigationItem);
 
-do {
-selectedNavigationItemIndex = Math.max(0, selectedNavigationItemIndex - 1);
-} while (selectedNavigationItemIndex && !(this._navigationItems[selectedNavigationItemIndex] instanceof WI.RadioButtonNavigationItem));
-} else if (event.keyIdentifier === "Right") {
-do {
-selectedNavigationItemIndex = Math.min(selectedNavigationItemIndex + 1, this._navigationItems.length - 1);
-} while (selectedNavigationItemIndex < this._navigationItems.length - 1 && !(this._navigationItems[selectedNavigationItemIndex] instanceof WI.RadioButtonNavigationItem));
-}
+if (selectedIndex === -1)
+selectedIndex = (this._navigationItems.length + delta) % this._navigationItems.length;
 
-if (!(this._navigationItems[selectedNavigationItemIndex] instanceof WI.RadioButtonNavigationItem))
-return;
+while (true) {
+selectedIndex += delta;
 
-this.selectedNavigationItem = this._navigationItems[selectedNavigationItemIndex];
-this.selectedNavigationItem?.element.focus();
+if (selectedIndex < 0 || selectedIndex >= this._navigationItems.length)
+break;
+
+let selectedItemCandidate = this._navigationItems[selectedIndex];
+if (selectedItemCandidate instanceof WI.RadioButtonNavigationItem) {
+this.selectedNavigationItem = selectedItemCandidate;
+this.selectedNavigationItem.element.focus();
+break;
+}
+}
 }
 
 _calculateMinimumWidth()






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [258730] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [258730] trunk/Source/WebInspectorUI








Revision 258730
Author nvasil...@apple.com
Date 2020-03-19 14:41:33 -0700 (Thu, 19 Mar 2020)


Log Message
Web Inspector: AXI: disabled buttons shouldn't be focusable
https://bugs.webkit.org/show_bug.cgi?id=208283


Reviewed by Devin Rousso.

Set tabIndex to "-1" when button becomes disabled.

* UserInterface/Views/ActivateButtonNavigationItem.js:
(WI.ActivateButtonNavigationItem):
* UserInterface/Views/ButtonNavigationItem.js:
`_role` is defined in the parent class now.

(WI.ButtonNavigationItem):
(WI.ButtonNavigationItem.prototype.set enabled):
(WI.ButtonNavigationItem.prototype.get tabbable):
(WI.ButtonNavigationItem.prototype._updateTabIndex):
* UserInterface/Views/RadioButtonNavigationItem.js:
(WI.RadioButtonNavigationItem.prototype.get tabbable):
(WI.RadioButtonNavigationItem):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ActivateButtonNavigationItem.js
trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js
trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (258729 => 258730)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-19 21:35:47 UTC (rev 258729)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-19 21:41:33 UTC (rev 258730)
@@ -1,5 +1,28 @@
 2020-03-19  Nikita Vasilyev  
 
+Web Inspector: AXI: disabled buttons shouldn't be focusable
+https://bugs.webkit.org/show_bug.cgi?id=208283
+
+
+Reviewed by Devin Rousso.
+
+Set tabIndex to "-1" when button becomes disabled.
+
+* UserInterface/Views/ActivateButtonNavigationItem.js:
+(WI.ActivateButtonNavigationItem):
+* UserInterface/Views/ButtonNavigationItem.js:
+`_role` is defined in the parent class now.
+
+(WI.ButtonNavigationItem):
+(WI.ButtonNavigationItem.prototype.set enabled):
+(WI.ButtonNavigationItem.prototype.get tabbable):
+(WI.ButtonNavigationItem.prototype._updateTabIndex):
+* UserInterface/Views/RadioButtonNavigationItem.js:
+(WI.RadioButtonNavigationItem.prototype.get tabbable):
+(WI.RadioButtonNavigationItem):
+
+2020-03-19  Nikita Vasilyev  
+
 Web Inspector: remove redundant code in TreeOutline.prototype.removeChildAtIndex
 https://bugs.webkit.org/show_bug.cgi?id=209301
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ActivateButtonNavigationItem.js (258729 => 258730)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ActivateButtonNavigationItem.js	2020-03-19 21:35:47 UTC (rev 258729)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ActivateButtonNavigationItem.js	2020-03-19 21:41:33 UTC (rev 258730)
@@ -31,7 +31,6 @@
 
 this._defaultToolTip = defaultToolTip;
 this._activatedToolTip = activatedToolTip || defaultToolTip;
-this._role = role;
 }
 
 // Public


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js (258729 => 258730)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js	2020-03-19 21:35:47 UTC (rev 258729)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js	2020-03-19 21:41:33 UTC (rev 258730)
@@ -40,10 +40,9 @@
 // Don't move the focus on the button when clicking on it. This matches macOS behavior.
 this.element.addEventListener("mousedown", this._handleMouseDown.bind(this), true);
 
-if (role === "button") {
-this.element.tabIndex = 0;
+this._role = role;
+if (this._role === "button")
 this.element.addEventListener("keydown", this._handleKeyDown.bind(this));
-}
 
 if (label)
 this.element.setAttribute("aria-label", label);
@@ -55,6 +54,8 @@
 this._imageHeight = imageHeight || 16;
 this._label = toolTipOrLabel;
 
+this._updateTabIndex();
+
 this.buttonStyle = this._image ? WI.ButtonNavigationItem.Style.Image : WI.ButtonNavigationItem.Style.Text;
 
 this.imageType = this._image ? WI.ButtonNavigationItem.ImageType.SVG : null;
@@ -111,6 +112,9 @@
 
 this._enabled = flag;
 this.element.classList.toggle("disabled", !this._enabled);
+this.element.ariaDisabled = !this._enabled;
+
+this._updateTabIndex();
 }
 
 get buttonStyle()
@@ -170,6 +174,11 @@
 return ["button"];
 }
 
+get tabbable()
+{
+return this._role === "button";
+}
+
 // Private
 
 _mouseClicked(event)
@@ -228,6 +237,16 @@
 }
 }
 }
+
+_updateTabIndex()
+{
+if (!this._enabled) {
+this.element.tabIndex = -1;
+return;
+}
+
+this.element.tabIndex = this.tabbable ? 0 : -1;
+}
 };
 
 WI.ButtonNavigationItem.Event = {


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js 

[webkit-changes] [258729] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [258729] trunk/Source/WebInspectorUI








Revision 258729
Author nvasil...@apple.com
Date 2020-03-19 14:35:47 -0700 (Thu, 19 Mar 2020)


Log Message
Web Inspector: remove redundant code in TreeOutline.prototype.removeChildAtIndex
https://bugs.webkit.org/show_bug.cgi?id=209301

Reviewed by Joseph Pecoraro.

* UserInterface/Views/TreeOutline.js:
(WI.TreeOutline.prototype.removeChildAtIndex):
Check `suppressSelectSibling` once instead of three times.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (258728 => 258729)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-19 21:18:56 UTC (rev 258728)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-19 21:35:47 UTC (rev 258729)
@@ -1,3 +1,14 @@
+2020-03-19  Nikita Vasilyev  
+
+Web Inspector: remove redundant code in TreeOutline.prototype.removeChildAtIndex
+https://bugs.webkit.org/show_bug.cgi?id=209301
+
+Reviewed by Joseph Pecoraro.
+
+* UserInterface/Views/TreeOutline.js:
+(WI.TreeOutline.prototype.removeChildAtIndex):
+Check `suppressSelectSibling` once instead of three times.
+
 2020-03-17  Devin Rousso  
 
 Web Inspector: the width of `WI.TabBarItem` can change if the detached window is resized


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js (258728 => 258729)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js	2020-03-19 21:18:56 UTC (rev 258728)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js	2020-03-19 21:35:47 UTC (rev 258729)
@@ -360,12 +360,12 @@
 let child = this.children[childIndex];
 let parent = child.parent;
 
-if (child.deselect(suppressOnDeselect)) {
-if (child.previousSibling && !suppressSelectSibling)
+if (child.deselect(suppressOnDeselect) && !suppressSelectSibling) {
+if (child.previousSibling)
 child.previousSibling.select(true, false);
-else if (child.nextSibling && !suppressSelectSibling)
+else if (child.nextSibling)
 child.nextSibling.select(true, false);
-else if (!suppressSelectSibling)
+else
 parent.select(true, false);
 }
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [258536] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [258536] trunk/Source/WebInspectorUI








Revision 258536
Author nvasil...@apple.com
Date 2020-03-16 18:01:16 -0700 (Mon, 16 Mar 2020)


Log Message
REGRESSION(r257380): Web Inspector: deleting node causes TreeOutline to lose focus
https://bugs.webkit.org/show_bug.cgi?id=208364


Reviewed by Devin Rousso.

Maintain keyboard focus within TreeOutline when selection changes.

* UserInterface/Views/TreeElement.js:
(WI.TreeElement.prototype.select):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (258535 => 258536)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-17 00:32:42 UTC (rev 258535)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-17 01:01:16 UTC (rev 258536)
@@ -1,3 +1,16 @@
+2020-03-16  Nikita Vasilyev  
+
+REGRESSION(r257380): Web Inspector: deleting node causes TreeOutline to lose focus
+https://bugs.webkit.org/show_bug.cgi?id=208364
+
+
+Reviewed by Devin Rousso.
+
+Maintain keyboard focus within TreeOutline when selection changes.
+
+* UserInterface/Views/TreeElement.js:
+(WI.TreeElement.prototype.select):
+
 2020-03-15  Yusuke Suzuki  
 
 Should not use variable-length-array (VLA)


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js (258535 => 258536)

--- trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js	2020-03-17 00:32:42 UTC (rev 258535)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js	2020-03-17 01:01:16 UTC (rev 258536)
@@ -520,17 +520,22 @@
 
 select(omitFocus, selectedByUser, suppressNotification)
 {
-if (!this.treeOutline || !this.selectable)
+let treeOutline = this.treeOutline;
+if (!treeOutline || !this.selectable)
 return;
 
 if (!omitFocus)
 this.focus();
+else if (treeOutline.element.contains(document.activeElement)) {
+// When treeOutline has focus, focus on the newly selected treeElement.
+this.focus();
+}
 
 if (this.selected && !this.treeOutline.allowsRepeatSelection)
 return;
 
 // Focusing on another node may detach "this" from tree.
-let treeOutline = this.treeOutline;
+treeOutline = this.treeOutline;
 if (!treeOutline)
 return;
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [258058] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [258058] trunk/Source/WebInspectorUI








Revision 258058
Author nvasil...@apple.com
Date 2020-03-06 21:22:57 -0800 (Fri, 06 Mar 2020)


Log Message
Web Inspector: AXI: no way to expand/collapse sidebar sections with Tab navigation
https://bugs.webkit.org/show_bug.cgi?id=208562


Reviewed by Devin Rousso.

* UserInterface/Views/DetailsSection.css:
(.details-section > .header):
(.details-section > .header::before):
Increase the height of the clickble area so it matches the height
of the header section.

(.details-section .header:focus):
(.details-section .header:focus::before):
Adjust the focus ring around the expand/collapse triangle so it has rounded corners.

* UserInterface/Views/DetailsSection.js:
(WI.DetailsSection):
(WI.DetailsSection.prototype._headerElementClicked):
(WI.DetailsSection.prototype._headerElementMouseDown):
(WI.DetailsSection.prototype._headerElementKeyPress):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css
trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (258057 => 258058)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-07 05:11:56 UTC (rev 258057)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-07 05:22:57 UTC (rev 258058)
@@ -1,5 +1,29 @@
 2020-03-06  Nikita Vasilyev  
 
+Web Inspector: AXI: no way to expand/collapse sidebar sections with Tab navigation
+https://bugs.webkit.org/show_bug.cgi?id=208562
+
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Views/DetailsSection.css:
+(.details-section > .header):
+(.details-section > .header::before):
+Increase the height of the clickble area so it matches the height
+of the header section.
+
+(.details-section .header:focus):
+(.details-section .header:focus::before):
+Adjust the focus ring around the expand/collapse triangle so it has rounded corners.
+
+* UserInterface/Views/DetailsSection.js:
+(WI.DetailsSection):
+(WI.DetailsSection.prototype._headerElementClicked):
+(WI.DetailsSection.prototype._headerElementMouseDown):
+(WI.DetailsSection.prototype._headerElementKeyPress):
+
+2020-03-06  Nikita Vasilyev  
+
 Web Inspector: AXI: scope bars should be focusable when navigating by pressing Tab
 https://bugs.webkit.org/show_bug.cgi?id=208277
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css (258057 => 258058)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css	2020-03-07 05:11:56 UTC (rev 258057)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.css	2020-03-07 05:22:57 UTC (rev 258058)
@@ -48,8 +48,8 @@
 .details-section > .header {
 position: sticky;
 top: var(--details-section-header-top);
-height: 23px;
-padding: 4px 0;
+height: var(--details-section-header-height);
+padding: var(--details-section-header-vertical-padding) 0;
 -webkit-padding-end: 5px;
 font-size: 11px;
 font-weight: bold;
@@ -61,6 +61,9 @@
 
 /* Ensure the headers are displayed above scrollbars. */
 z-index: var(--z-index-header);
+
+--details-section-header-height: 23px;
+--details-section-header-vertical-padding: 4px;
 }
 
 .details-section > .header > .options > .navigation-bar {
@@ -100,7 +103,8 @@
 .details-section > .header::before {
 display: block;
 width: 21px;
-height: 100%;
+height: var(--details-section-header-height);
+margin-top: calc(-1 * var(--details-section-header-vertical-padding));
 content: "";
 background-image: url(../Images/DisclosureTriangles.svg#open-normal);
 background-repeat: no-repeat;
@@ -108,6 +112,16 @@
 background-size: 13px 13px;
 }
 
+.details-section .header:focus {
+outline: none;
+}
+
+.details-section .header:focus::before {
+outline: auto -webkit-focus-ring-color;
+outline-offset: -5px;
+border-radius: 9px;
+}
+
 body[dir=rtl] .details-section > .header::before {
 transform: scaleX(-1);
 }


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js (258057 => 258058)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js	2020-03-07 05:11:56 UTC (rev 258057)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DetailsSection.js	2020-03-07 05:22:57 UTC (rev 258058)
@@ -35,8 +35,11 @@
 this._element.classList.add(identifier, "details-section");
 
 this._headerElement = document.createElement("div");
+this._headerElement.addEventListener("mousedown", this._headerElementMouseDown.bind(this));
 this._headerElement.addEventListener("click", this._headerElementClicked.bind(this));
+this._headerElement.addEventListener("keypress", this._headerElementKeyPress.bind(this));
 this._headerElement.className = "header";
+this._headerElement.tabIndex = 0;
 

[webkit-changes] [258057] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [258057] trunk/Source/WebInspectorUI








Revision 258057
Author nvasil...@apple.com
Date 2020-03-06 21:11:56 -0800 (Fri, 06 Mar 2020)


Log Message
Web Inspector: AXI: scope bars should be focusable when navigating by pressing Tab
https://bugs.webkit.org/show_bug.cgi?id=208277


Reviewed by Devin Rousso.

Make resource type filter in the Network tab and message type filter in the Console tab focusable.

* UserInterface/Views/AuditTestGroupContentView.css:
(.content-view.audit-test-group > header > nav):
(.content-view.audit-test-group > header > nav > .scope-bar):
Prevent outline of the focused scope bar item from clipping.

* UserInterface/Views/ScopeBar.css:
(.scope-bar > li:focus):
(.scope-bar > li:focus::after,):
* UserInterface/Views/ScopeBar.js:
(WI.ScopeBar):
(WI.ScopeBar.prototype._handleKeyDown):
Make Arrow Left an Arrow Right keys move focus within the scope bar.
This matches the behavior of macOS radio buttons.

* UserInterface/Views/ScopeBarItem.js:
(WI.ScopeBarItem.prototype.get scopeBar):
(WI.ScopeBarItem.prototype.set scopeBar):
(WI.ScopeBarItem.prototype.toggle):
(WI.ScopeBarItem.prototype._updateSelected):
(WI.ScopeBarItem.prototype._handleMouseDown):

(WI.ScopeBarItem.prototype._handleKeyDown):
Allow to toggle focused scope bar item by pressing Space or Enter.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.css
trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css
trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.js
trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBarItem.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (258056 => 258057)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-07 05:05:08 UTC (rev 258056)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-07 05:11:56 UTC (rev 258057)
@@ -1,3 +1,37 @@
+2020-03-06  Nikita Vasilyev  
+
+Web Inspector: AXI: scope bars should be focusable when navigating by pressing Tab
+https://bugs.webkit.org/show_bug.cgi?id=208277
+
+
+Reviewed by Devin Rousso.
+
+Make resource type filter in the Network tab and message type filter in the Console tab focusable.
+
+* UserInterface/Views/AuditTestGroupContentView.css:
+(.content-view.audit-test-group > header > nav):
+(.content-view.audit-test-group > header > nav > .scope-bar):
+Prevent outline of the focused scope bar item from clipping.
+
+* UserInterface/Views/ScopeBar.css:
+(.scope-bar > li:focus):
+(.scope-bar > li:focus::after,):
+* UserInterface/Views/ScopeBar.js:
+(WI.ScopeBar):
+(WI.ScopeBar.prototype._handleKeyDown):
+Make Arrow Left an Arrow Right keys move focus within the scope bar.
+This matches the behavior of macOS radio buttons.
+
+* UserInterface/Views/ScopeBarItem.js:
+(WI.ScopeBarItem.prototype.get scopeBar):
+(WI.ScopeBarItem.prototype.set scopeBar):
+(WI.ScopeBarItem.prototype.toggle):
+(WI.ScopeBarItem.prototype._updateSelected):
+(WI.ScopeBarItem.prototype._handleMouseDown):
+
+(WI.ScopeBarItem.prototype._handleKeyDown):
+Allow to toggle focused scope bar item by pressing Space or Enter.
+
 2020-03-06  Jon Davis  
 
 Fixed missing icons for WI.ThreadTreeElement and selected Heap Snapshots


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.css (258056 => 258057)

--- trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.css	2020-03-07 05:05:08 UTC (rev 258056)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.css	2020-03-07 05:11:56 UTC (rev 258057)
@@ -68,8 +68,13 @@
 display: inline-flex;
 height: auto;
 border-bottom: none;
+overflow: visible;
 }
 
+.content-view.audit-test-group > header > nav > .scope-bar {
+overflow: visible;
+}
+
 .content-view.audit-test-group > header > nav:empty {
 display: none;
 }


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css (258056 => 258057)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css	2020-03-07 05:05:08 UTC (rev 258056)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ScopeBar.css	2020-03-07 05:11:56 UTC (rev 258057)
@@ -68,6 +68,10 @@
 opacity: var(--scope-bar-background-opacity);
 }
 
+.scope-bar > li:focus {
+outline: none;
+}
+
 .scope-bar > li:matches(.selected, :hover) {
 --scope-bar-text-color-default: var(--selected-foreground-color);
 --scope-bar-background-color-default: var(--glyph-color-active);
@@ -96,6 +100,12 @@
 pointer-events: none;
 }
 
+.scope-bar > li:focus::after,
+.scope-bar > li.multiple > select:focus {
+outline: auto -webkit-focus-ring-color;
+outline-offset: -1px;
+}
+
 body[dir=ltr] .scope-bar > li.multiple > select {
 left: calc(var(--scope-bar-padding) - var(--scope-bar-padding-default) - 2px);
 }

[webkit-changes] [257965] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [257965] trunk/Source/WebInspectorUI








Revision 257965
Author nvasil...@apple.com
Date 2020-03-05 19:57:30 -0800 (Thu, 05 Mar 2020)


Log Message
Web Inspector: AXI: annotate tab panels
https://bugs.webkit.org/show_bug.cgi?id=208542

Reviewed by Devin Rousso.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Base/Main.js:
Remove `role=main` since it was providing very generic and not useful description to VoiceOver.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
trunk/Source/WebInspectorUI/UserInterface/Base/Main.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (257964 => 257965)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-06 03:00:01 UTC (rev 257964)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-06 03:57:30 UTC (rev 257965)
@@ -1,5 +1,16 @@
 2020-03-05  Nikita Vasilyev  
 
+Web Inspector: AXI: annotate tab panels
+https://bugs.webkit.org/show_bug.cgi?id=208542
+
+Reviewed by Devin Rousso.
+
+* Localizations/en.lproj/localizedStrings.js:
+* UserInterface/Base/Main.js:
+Remove `role=main` since it was providing very generic and not useful description to VoiceOver.
+
+2020-03-05  Nikita Vasilyev  
+
 Web Inspector: AXI: can't leave Styles and Computed panels by pressing Tab
 https://bugs.webkit.org/show_bug.cgi?id=208549
 


Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (257964 => 257965)

--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2020-03-06 03:00:01 UTC (rev 257964)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2020-03-06 03:57:30 UTC (rev 257965)
@@ -320,7 +320,6 @@
 localizedStrings["Console opened at %s"] = "Console opened at %s";
 localizedStrings["Console prompt"] = "Console prompt";
 localizedStrings["Containing"] = "Containing";
-localizedStrings["Content"] = "Content";
 localizedStrings["Content Security Policy violation of directive: %s"] = "Content Security Policy violation of directive: %s";
 localizedStrings["Continuation Frame"] = "Continuation Frame";
 localizedStrings["Continue script execution (%s or %s)"] = "Continue script execution (%s or %s)";


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Main.js (257964 => 257965)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2020-03-06 03:00:01 UTC (rev 257964)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Main.js	2020-03-06 03:57:30 UTC (rev 257965)
@@ -286,8 +286,7 @@
 WI.tabBar = new WI.TabBar(document.getElementById("tab-bar"));
 
 WI._contentElement = document.getElementById("content");
-WI._contentElement.setAttribute("role", "main");
-WI._contentElement.setAttribute("aria-label", WI.UIString("Content"));
+WI._contentElement.role = "tabpanel";
 
 WI.clearKeyboardShortcut = new WI.KeyboardShortcut(WI.KeyboardShortcut.Modifier.CommandOrControl, "K", WI._clear);
 
@@ -1924,9 +1923,14 @@
 
 WI._tabBrowserSelectedTabContentViewDidChange = function(event)
 {
-if (WI.tabBar.selectedTabBarItem && WI.tabBar.selectedTabBarItem.representedObject.constructor.shouldSaveTab())
-WI._selectedTabIndexSetting.value = WI.tabBar.tabBarItems.indexOf(WI.tabBar.selectedTabBarItem);
+let selectedTabBarItem = WI.tabBar.selectedTabBarItem;
+if (selectedTabBarItem) {
+WI._contentElement.ariaLabel = selectedTabBarItem.title || "";
 
+if (selectedTabBarItem.representedObject.constructor.shouldSaveTab())
+WI._selectedTabIndexSetting.value = WI.tabBar.tabBarItems.indexOf(selectedTabBarItem);
+}
+
 if (WI.doesCurrentTabSupportSplitContentBrowser()) {
 if (WI._shouldRevealSpitConsoleIfSupported) {
 WI._shouldRevealSpitConsoleIfSupported = false;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [257959] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [257959] trunk/Source/WebInspectorUI








Revision 257959
Author nvasil...@apple.com
Date 2020-03-05 16:46:58 -0800 (Thu, 05 Mar 2020)


Log Message
Web Inspector: AXI: can't leave Styles and Computed panels by pressing Tab
https://bugs.webkit.org/show_bug.cgi?id=208549


Reviewed by Devin Rousso.

Remove focus cycling inside of the Styles and Computed panels.

* UserInterface/Views/GeneralStyleDetailsSidebarPanel.js:
(WI.GeneralStyleDetailsSidebarPanel.prototype._handleForcedPseudoClassCheckboxKeydown):
(WI.GeneralStyleDetailsSidebarPanel.prototype._handleFilterBarInputFieldKeyDown):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (257958 => 257959)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-03-06 00:30:37 UTC (rev 257958)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-03-06 00:46:58 UTC (rev 257959)
@@ -1,3 +1,17 @@
+2020-03-05  Nikita Vasilyev  
+
+Web Inspector: AXI: can't leave Styles and Computed panels by pressing Tab
+https://bugs.webkit.org/show_bug.cgi?id=208549
+
+
+Reviewed by Devin Rousso.
+
+Remove focus cycling inside of the Styles and Computed panels.
+
+* UserInterface/Views/GeneralStyleDetailsSidebarPanel.js:
+(WI.GeneralStyleDetailsSidebarPanel.prototype._handleForcedPseudoClassCheckboxKeydown):
+(WI.GeneralStyleDetailsSidebarPanel.prototype._handleFilterBarInputFieldKeyDown):
+
 2020-03-04  Devin Rousso  
 
 Web Inspector: the execution context picker is shown on pages with only one execution context if there are internal execution contexts


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.js (257958 => 257959)

--- trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.js	2020-03-06 00:30:37 UTC (rev 257958)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/GeneralStyleDetailsSidebarPanel.js	2020-03-06 00:46:58 UTC (rev 257959)
@@ -236,24 +236,12 @@
 
 _handleForcedPseudoClassCheckboxKeydown(pseudoClass, event)
 {
-if (event.key !== "Tab")
+if (event.key !== "Tab" || event.shiftKey)
 return;
 
-let pseudoClasses = WI.CSSManager.ForceablePseudoClasses;
-let index = pseudoClasses.indexOf(pseudoClass);
-if (event.shiftKey) {
-if (index > 0) {
-this._forcedPseudoClassCheckboxes[pseudoClasses[index - 1]].focus();
-event.preventDefault();
-} else {
-this._filterBar.inputField.focus();
-event.preventDefault();
-}
-} else {
-if (index < pseudoClasses.length - 1) {
-this._forcedPseudoClassCheckboxes[pseudoClasses[index + 1]].focus();
-event.preventDefault();
-} else if (this._panel.focusFirstSection) {
+if (WI.CSSManager.ForceablePseudoClasses.lastValue === pseudoClass) {
+// Last checkbox is currently focused.
+if (this._panel.focusFirstSection) {
 this._panel.focusFirstSection();
 event.preventDefault();
 }
@@ -425,16 +413,11 @@
 
 _handleFilterBarInputFieldKeyDown(event)
 {
-if (event.key !== "Tab")
+if (event.key !== "Tab" || !event.shiftKey)
 return;
 
-if (event.shiftKey) {
-if (this._panel.focusLastSection) {
-this._panel.focusLastSection();
-event.preventDefault();
-}
-} else {
-this._forcedPseudoClassCheckboxes[WI.CSSManager.ForceablePseudoClasses[0]].focus();
+if (this._panel.focusLastSection) {
+this._panel.focusLastSection();
 event.preventDefault();
 }
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [257622] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [257622] trunk/Source/WebInspectorUI








Revision 257622
Author nvasil...@apple.com
Date 2020-02-28 00:44:59 -0800 (Fri, 28 Feb 2020)


Log Message
REGRESSION(r257411): Web Inspector: Can't add a breakpoint by pressing the plus button
https://bugs.webkit.org/show_bug.cgi?id=208359


Reviewed by Brian Burg.

In r257411 I added event.stop() (which is a shortcut for event.preventDefault() and
event.stopImmediatePropagation()) to mousedown handler. Calling event.stopImmediatePropagation()
prevented other mousedown event handlers from running.

This patch no longer calls event.stopImmediatePropagation().

* UserInterface/Views/ButtonNavigationItem.js:
(WI.ButtonNavigationItem.prototype._handleMouseDown):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (257621 => 257622)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-28 08:33:14 UTC (rev 257621)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-28 08:44:59 UTC (rev 257622)
@@ -1,3 +1,20 @@
+2020-02-28  Nikita Vasilyev  
+
+REGRESSION(r257411): Web Inspector: Can't add a breakpoint by pressing the plus button
+https://bugs.webkit.org/show_bug.cgi?id=208359
+
+
+Reviewed by Brian Burg.
+
+In r257411 I added event.stop() (which is a shortcut for event.preventDefault() and
+event.stopImmediatePropagation()) to mousedown handler. Calling event.stopImmediatePropagation()
+prevented other mousedown event handlers from running.
+
+This patch no longer calls event.stopImmediatePropagation().
+
+* UserInterface/Views/ButtonNavigationItem.js:
+(WI.ButtonNavigationItem.prototype._handleMouseDown):
+
 2020-02-27  Devin Rousso  
 
 Web Inspector: allow use of dark mode theme independently from system-wide theme


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js (257621 => 257622)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js	2020-02-28 08:33:14 UTC (rev 257621)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js	2020-02-28 08:44:59 UTC (rev 257622)
@@ -157,7 +157,7 @@
 _handleMouseDown(event)
 {
 // Clicking on a button should NOT focus on it.
-event.stop();
+event.preventDefault();
 }
 
 _handleKeyDown(event)






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [257411] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [257411] trunk/Source/WebInspectorUI








Revision 257411
Author nvasil...@apple.com
Date 2020-02-25 23:18:43 -0800 (Tue, 25 Feb 2020)


Log Message
Web Inspector: AXI: buttons should be focusable when navigating by pressing Tab
https://bugs.webkit.org/show_bug.cgi?id=208163


Reviewed by Brian Burg.

Buttons now accessible with Tab navigation. The focused button has the native focus outline.

Clicking on the button does NOT move the focus. For example, when you're focused on the
console prompt, clicking on the icon to hide the right sidebar keeps you focused where
you were — the console prompt. This behavior matches macOS.

Convert WI.NavigationItem with role=button from `` to `` elements.
Button elements have implicit tabIndex=0. When focused, pressing Space or Enter
triggers "click" event.

* UserInterface/Views/ActivateButtonNavigationItem.js:
(WI.ActivateButtonNavigationItem.prototype.set activated):
Add "aria-pressed" and "aria-label" attributes for VoiceOver.

* UserInterface/Views/ButtonNavigationItem.css:
(.navigation-bar .item.button:not(.image-only):focus,):
(.navigation-bar .item.button.image-only:focus):
(.navigation-bar .item.button:not(.disabled):matches(.activate.activated, .radio.selected) > .glyph):
(.navigation-bar .item.button:not(.disabled):active:matches(.activate.activated, .radio.selected) > .glyph):
Before this patch, focused button looked the same as activated buttons.
For example, the focused (non-active) bullseye icon looked exactly the
same as unfocused active bullseye icon, which was misleading.

* UserInterface/Views/ButtonNavigationItem.js:
(WI.ButtonNavigationItem):
(WI.ButtonNavigationItem.prototype._mouseClicked):
(WI.ButtonNavigationItem.prototype._handleMouseDown):
Clicking on a button shouldn't move focus. For example, when you're focused on the console prompt,
clicking on the icon to hide the right sidebar should keep you focused where you were - the console prompt.

(WI.ButtonNavigationItem.prototype._handleKeyDown):
* UserInterface/Views/ButtonToolbarItem.css:
(.toolbar .item.button):
Adjust outline offset to remove the gap between the outline and the border of the button.

(.toolbar .item.button:not(.disabled).activate.activated):
(@media (prefers-color-scheme: dark) body:not(.window-inactive) .toolbar .item.button:not(.disabled).activate.activated > .glyph):
* UserInterface/Views/ControlToolbarItem.css:
(.toolbar .item.control:focus):
(.toolbar .item.control:focus > .glyph):
Draw the outline around the X (close button) glyph, not the button itself (which is much wider than the glyph).

* UserInterface/Views/NavigationBar.css:
(.navigation-bar .item):
(.navigation-bar .item:focus):
* UserInterface/Views/NavigationBar.js:
(WI.NavigationBar):
"focus" and "blur" events don't bubble. These event handlers didn't capture the event.

(WI.NavigationBar.prototype._mouseDown):
(WI.NavigationBar.prototype._keyDown):
* UserInterface/Views/NavigationItem.js:
(WI.NavigationItem):
* UserInterface/Views/RadioButtonNavigationItem.css:
(.navigation-bar .item.radio.button:focus):
* UserInterface/Views/Toolbar.css:
(.toolbar .item):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ActivateButtonNavigationItem.js
trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.css
trunk/Source/WebInspectorUI/UserInterface/Views/ButtonNavigationItem.js
trunk/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.css
trunk/Source/WebInspectorUI/UserInterface/Views/ControlToolbarItem.css
trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.css
trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js
trunk/Source/WebInspectorUI/UserInterface/Views/NavigationItem.js
trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.css
trunk/Source/WebInspectorUI/UserInterface/Views/Toolbar.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (257410 => 257411)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-26 06:05:13 UTC (rev 257410)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-26 07:18:43 UTC (rev 257411)
@@ -1,3 +1,69 @@
+2020-02-25  Nikita Vasilyev  
+
+Web Inspector: AXI: buttons should be focusable when navigating by pressing Tab
+https://bugs.webkit.org/show_bug.cgi?id=208163
+
+
+Reviewed by Brian Burg.
+
+Buttons now accessible with Tab navigation. The focused button has the native focus outline.
+
+Clicking on the button does NOT move the focus. For example, when you're focused on the
+console prompt, clicking on the icon to hide the right sidebar keeps you focused where
+you were — the console prompt. This behavior matches macOS.
+
+Convert WI.NavigationItem with role=button from `` to `` elements.
+Button elements have implicit tabIndex=0. When focused, pressing Space or Enter
+triggers "click" event.
+
+* UserInterface/Views/ActivateButtonNavigationItem.js:
+

[webkit-changes] [257396] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [257396] trunk/Source/WebInspectorUI








Revision 257396
Author nvasil...@apple.com
Date 2020-02-25 17:18:21 -0800 (Tue, 25 Feb 2020)


Log Message
Web Inspector: VoiceOver should read "Console prompt" when focusing on it
https://bugs.webkit.org/show_bug.cgi?id=208028


Reviewed by Brian Burg.

Before this change, VoiceOver read "edit text blank" when focusing on the console prompt.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Views/ConsolePrompt.js:
(WI.ConsolePrompt):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
trunk/Source/WebInspectorUI/UserInterface/Views/ConsolePrompt.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (257395 => 257396)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-26 01:13:20 UTC (rev 257395)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-26 01:18:21 UTC (rev 257396)
@@ -1,5 +1,19 @@
 2020-02-25  Nikita Vasilyev  
 
+Web Inspector: VoiceOver should read "Console prompt" when focusing on it
+https://bugs.webkit.org/show_bug.cgi?id=208028
+
+
+Reviewed by Brian Burg.
+
+Before this change, VoiceOver read "edit text blank" when focusing on the console prompt.
+
+* Localizations/en.lproj/localizedStrings.js:
+* UserInterface/Views/ConsolePrompt.js:
+(WI.ConsolePrompt):
+
+2020-02-25  Nikita Vasilyev  
+
 Web Inspector: VoiceOver: TreeOutline does not correctly indicate selected item
 https://bugs.webkit.org/show_bug.cgi?id=207968
 


Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (257395 => 257396)

--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2020-02-26 01:13:20 UTC (rev 257395)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2020-02-26 01:18:21 UTC (rev 257396)
@@ -306,6 +306,7 @@
 localizedStrings["Console Profile Recorded"] = "Console Profile Recorded";
 localizedStrings["Console cleared at %s"] = "Console cleared at %s";
 localizedStrings["Console opened at %s"] = "Console opened at %s";
+localizedStrings["Console prompt"] = "Console prompt";
 localizedStrings["Containing"] = "Containing";
 localizedStrings["Content"] = "Content";
 localizedStrings["Content Security Policy violation of directive: %s"] = "Content Security Policy violation of directive: %s";


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ConsolePrompt.js (257395 => 257396)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ConsolePrompt.js	2020-02-26 01:13:20 UTC (rev 257395)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ConsolePrompt.js	2020-02-26 01:18:21 UTC (rev 257396)
@@ -59,6 +59,10 @@
 this._completionController = new WI.CodeMirrorCompletionController(this._codeMirror, this);
 this._completionController.addExtendedCompletionProvider("_javascript_", WI._javascript_RuntimeCompletionProvider);
 
+let textarea = this._codeMirror.getInputField();
+if (textarea)
+textarea.ariaLabel = WI.UIString("Console prompt");
+
 this._history = [{}];
 this._historyIndex = 0;
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [257380] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [257380] trunk/Source/WebInspectorUI








Revision 257380
Author nvasil...@apple.com
Date 2020-02-25 15:12:47 -0800 (Tue, 25 Feb 2020)


Log Message
Web Inspector: VoiceOver: TreeOutline does not correctly indicate selected item
https://bugs.webkit.org/show_bug.cgi?id=207968

Reviewed by Brian Burg.

Previously, the entire TreeOutline's DOM element had focus. With this patch,
selected item DOM element has focus instead. When clicking on the treeElement,
set tabIndex to 0 and focus on it.

* UserInterface/Views/DOMTreeOutline.css:
(.tree-outline.dom): Fix indentation.

(.tree-outline.dom:not(.non-selectable):focus-within li.selected .selection-area):
(.tree-outline.dom:not(.non-selectable) li.hovered:not(.selected) .selection-area):
(.tree-outline.dom:focus-within li.inspected-node.selected > span::after):
(.tree-outline.dom li):
Remove outline - selection is already indicated by the background.

(.tree-outline.dom:focus-within li.selected .pseudo-class-indicator):
(.tree-outline.dom:focus-within li.selected):
(.tree-outline.dom:focus-within li.selected *):
(.tree-outline.dom:focus-within li.parent.selected::before):
(.tree-outline.dom:focus-within li.parent.expanded.selected::before):
* UserInterface/Views/DOMTreeOutline.js:
* UserInterface/Views/TreeElement.js:
(WI.TreeElement.prototype._attach):
(WI.TreeElement.prototype.collapse):
(WI.TreeElement.prototype.expand):
(WI.TreeElement.prototype.select):
(WI.TreeElement.prototype.deselect):
(WI.TreeElement.prototype.focus):
(WI.TreeElement.prototype.unfocus):
* UserInterface/Views/TreeOutline.css:
(.tree-outline .item.selected:focus .disclosure-button):
(.tree-outline .item.selected.expanded:focus .disclosure-button):
(.tree-outline .item.selected:focus):
(.tree-outline .item.selected:focus .subtitle):
(.tree-outline:not(.large) .item.selected:focus .status .indeterminate-progress-spinner):
* UserInterface/Views/TreeOutline.js:
(WI.TreeOutline.prototype._treeKeyDown):
(WI.TreeOutline.prototype._handleMouseDown):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.js
trunk/Source/WebInspectorUI/UserInterface/Views/TreeElement.js
trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.css
trunk/Source/WebInspectorUI/UserInterface/Views/TreeOutline.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (257379 => 257380)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-25 23:12:12 UTC (rev 257379)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-25 23:12:47 UTC (rev 257380)
@@ -1,3 +1,47 @@
+2020-02-25  Nikita Vasilyev  
+
+Web Inspector: VoiceOver: TreeOutline does not correctly indicate selected item
+https://bugs.webkit.org/show_bug.cgi?id=207968
+
+Reviewed by Brian Burg.
+
+Previously, the entire TreeOutline's DOM element had focus. With this patch,
+selected item DOM element has focus instead. When clicking on the treeElement,
+set tabIndex to 0 and focus on it.
+
+* UserInterface/Views/DOMTreeOutline.css:
+(.tree-outline.dom): Fix indentation.
+
+(.tree-outline.dom:not(.non-selectable):focus-within li.selected .selection-area):
+(.tree-outline.dom:not(.non-selectable) li.hovered:not(.selected) .selection-area):
+(.tree-outline.dom:focus-within li.inspected-node.selected > span::after):
+(.tree-outline.dom li):
+Remove outline - selection is already indicated by the background.
+
+(.tree-outline.dom:focus-within li.selected .pseudo-class-indicator):
+(.tree-outline.dom:focus-within li.selected):
+(.tree-outline.dom:focus-within li.selected *):
+(.tree-outline.dom:focus-within li.parent.selected::before):
+(.tree-outline.dom:focus-within li.parent.expanded.selected::before):
+* UserInterface/Views/DOMTreeOutline.js:
+* UserInterface/Views/TreeElement.js:
+(WI.TreeElement.prototype._attach):
+(WI.TreeElement.prototype.collapse):
+(WI.TreeElement.prototype.expand):
+(WI.TreeElement.prototype.select):
+(WI.TreeElement.prototype.deselect):
+(WI.TreeElement.prototype.focus):
+(WI.TreeElement.prototype.unfocus):
+* UserInterface/Views/TreeOutline.css:
+(.tree-outline .item.selected:focus .disclosure-button):
+(.tree-outline .item.selected.expanded:focus .disclosure-button):
+(.tree-outline .item.selected:focus):
+(.tree-outline .item.selected:focus .subtitle):
+(.tree-outline:not(.large) .item.selected:focus .status .indeterminate-progress-spinner):
+* UserInterface/Views/TreeOutline.js:
+(WI.TreeOutline.prototype._treeKeyDown):
+(WI.TreeOutline.prototype._handleMouseDown):
+
 2020-02-19  Jon Davis  
 
 Fixed object trees using the wrong theme of type icon


Modified: 

[webkit-changes] [256788] trunk/Source/WebInspectorUI

[nvasilyev]

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


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

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Main.js
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Views/Main.css
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js




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  
+
+Web Inspector: Add "outline focused element" debug setting
+https://bugs.webkit.org/show_bug.cgi?id=207819
+
+
+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  
 
 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();
 
-

[webkit-changes] [256652] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [256652] trunk/Source/WebInspectorUI








Revision 256652
Author nvasil...@apple.com
Date 2020-02-14 15:18:34 -0800 (Fri, 14 Feb 2020)


Log Message
Web Inspector: VoiceOver doesn't read selected panel tab
https://bugs.webkit.org/show_bug.cgi?id=207735


Reviewed by Timothy Hatcher.

* UserInterface/Views/NavigationBar.js:
(WI.NavigationBar):
(WI.NavigationBar.prototype._mouseDown):
(WI.NavigationBar.prototype._mouseUp):
Navigation bar itself shouldn't receive focus - its items should.

* UserInterface/Views/RadioButtonNavigationItem.js:
(WI.RadioButtonNavigationItem):
"tab" was passed as a label by mistake. VoiceOver read every tab as "tab" instead of it's actual label.

(WI.RadioButtonNavigationItem.prototype.set selected):
When clicking on a tab, focus on it so VoiceOver could read it.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js
trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (256651 => 256652)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-14 23:17:39 UTC (rev 256651)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-14 23:18:34 UTC (rev 256652)
@@ -1,5 +1,26 @@
 2020-02-14  Nikita Vasilyev  
 
+Web Inspector: VoiceOver doesn't read selected panel tab
+https://bugs.webkit.org/show_bug.cgi?id=207735
+
+
+Reviewed by Timothy Hatcher.
+
+* UserInterface/Views/NavigationBar.js:
+(WI.NavigationBar):
+(WI.NavigationBar.prototype._mouseDown):
+(WI.NavigationBar.prototype._mouseUp):
+Navigation bar itself shouldn't receive focus - its items should.
+
+* UserInterface/Views/RadioButtonNavigationItem.js:
+(WI.RadioButtonNavigationItem):
+"tab" was passed as a label by mistake. VoiceOver read every tab as "tab" instead of it's actual label.
+
+(WI.RadioButtonNavigationItem.prototype.set selected):
+When clicking on a tab, focus on it so VoiceOver could read it.
+
+2020-02-14  Nikita Vasilyev  
+
 Web Inspector: Bezier editor popover should be strictly LTR
 https://bugs.webkit.org/show_bug.cgi?id=206968
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js (256651 => 256652)

--- trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js	2020-02-14 23:17:39 UTC (rev 256651)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NavigationBar.js	2020-02-14 23:18:34 UTC (rev 256652)
@@ -30,7 +30,6 @@
 super(element);
 
 this.element.classList.add(this.constructor.StyleClassName || "navigation-bar");
-this.element.tabIndex = 0;
 
 if (role)
 this.element.setAttribute("role", role);
@@ -312,7 +311,6 @@
 document.addEventListener("mousemove", this._mouseMovedEventListener, false);
 document.addEventListener("mouseup", this._mouseUpEventListener, false);
 
-event.preventDefault();
 event.stopPropagation();
 }
 
@@ -362,9 +360,6 @@
 document.removeEventListener("mousemove", this._mouseMovedEventListener, false);
 document.removeEventListener("mouseup", this._mouseUpEventListener, false);
 
-// Restore the tabIndex so the navigation bar can be in the keyboard tab loop.
-this.element.tabIndex = 0;
-
 // Dispatch the selected event here since the selectedNavigationItem setter surpresses it
 // while the mouse is down to prevent sending it while scrubbing the bar.
 if (this._previousSelectedNavigationItem !== this.selectedNavigationItem)


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js (256651 => 256652)

--- trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js	2020-02-14 23:17:39 UTC (rev 256651)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/RadioButtonNavigationItem.js	2020-02-14 23:18:34 UTC (rev 256652)
@@ -27,7 +27,7 @@
 {
 constructor(identifier, toolTip, image, imageWidth, imageHeight)
 {
-super(identifier, toolTip, image, imageWidth, imageHeight, null, "tab");
+super(identifier, toolTip, image, imageWidth, imageHeight, "tab");
 }
 
 // Public
@@ -42,9 +42,11 @@
 if (flag) {
 this.element.classList.add(WI.RadioButtonNavigationItem.SelectedStyleClassName);
 this.element.setAttribute("aria-selected", "true");
+this.element.tabIndex = 0;
 } else {
 this.element.classList.remove(WI.RadioButtonNavigationItem.SelectedStyleClassName);
 this.element.setAttribute("aria-selected", "false");
+this.element.tabIndex = -1;
 }
 }
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [256647] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [256647] trunk/Source/WebInspectorUI








Revision 256647
Author nvasil...@apple.com
Date 2020-02-14 14:45:08 -0800 (Fri, 14 Feb 2020)


Log Message
Web Inspector: Bezier editor popover should be strictly LTR
https://bugs.webkit.org/show_bug.cgi?id=206968


Reviewed by Timothy Hatcher.

webkitConvertPointFromPageToNode does not work correctly with the zoom level other than 1.
Replace all uses of webkitConvertPointFromPageToNode with getBoundingClientRect.

* UserInterface/Models/Geometry.js:
(WI.Point.fromEventInElement):
* UserInterface/Views/ColorSquare.js:
(WI.ColorSquare.prototype._updateColorForMouseEvent):
* UserInterface/Views/GradientSlider.js:
(WI.GradientSlider.prototype._updateShadowKnob):
* UserInterface/Views/Slider.js:
(WI.Slider.prototype._localPointForEvent):
(WI.Slider):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/Geometry.js
trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js
trunk/Source/WebInspectorUI/UserInterface/Views/GradientSlider.js
trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (256646 => 256647)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-14 22:37:44 UTC (rev 256646)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-14 22:45:08 UTC (rev 256647)
@@ -1,3 +1,24 @@
+2020-02-14  Nikita Vasilyev  
+
+Web Inspector: Bezier editor popover should be strictly LTR
+https://bugs.webkit.org/show_bug.cgi?id=206968
+
+
+Reviewed by Timothy Hatcher.
+
+webkitConvertPointFromPageToNode does not work correctly with the zoom level other than 1.
+Replace all uses of webkitConvertPointFromPageToNode with getBoundingClientRect.
+
+* UserInterface/Models/Geometry.js:
+(WI.Point.fromEventInElement):
+* UserInterface/Views/ColorSquare.js:
+(WI.ColorSquare.prototype._updateColorForMouseEvent):
+* UserInterface/Views/GradientSlider.js:
+(WI.GradientSlider.prototype._updateShadowKnob):
+* UserInterface/Views/Slider.js:
+(WI.Slider.prototype._localPointForEvent):
+(WI.Slider):
+
 2020-02-12  Pavel Feldman  
 
 Web Inspector: encode binary web socket frames using base64


Modified: trunk/Source/WebInspectorUI/UserInterface/Models/Geometry.js (256646 => 256647)

--- trunk/Source/WebInspectorUI/UserInterface/Models/Geometry.js	2020-02-14 22:37:44 UTC (rev 256646)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/Geometry.js	2020-02-14 22:45:08 UTC (rev 256647)
@@ -40,8 +40,8 @@
 
 static fromEventInElement(event, element)
 {
-var wkPoint = window.webkitConvertPointFromPageToNode(element, new WebKitPoint(event.pageX, event.pageY));
-return new WI.Point(wkPoint.x, wkPoint.y);
+let rect = element.getBoundingClientRect();
+return new WI.Point(event.pageX - rect.x, event.pageY - rect.y);
 }
 
 // Public


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js (256646 => 256647)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js	2020-02-14 22:37:44 UTC (rev 256646)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js	2020-02-14 22:45:08 UTC (rev 256647)
@@ -205,8 +205,11 @@
 
 _updateColorForMouseEvent(event)
 {
-let point = window.webkitConvertPointFromPageToNode(this._element, new WebKitPoint(event.pageX, event.pageY));
-this._setCrosshairPosition(point);
+let rect = this._element.getBoundingClientRect();
+this._setCrosshairPosition({
+x: event.pageX - rect.x,
+y: event.pageY - rect.y,
+});
 
 if (this._delegate && this._delegate.colorSquareColorDidChange)
 this._delegate.colorSquareColorDidChange(this);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/GradientSlider.js (256646 => 256647)

--- trunk/Source/WebInspectorUI/UserInterface/Views/GradientSlider.js	2020-02-14 22:37:44 UTC (rev 256646)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/GradientSlider.js	2020-02-14 22:45:08 UTC (rev 256647)
@@ -195,7 +195,7 @@
 this.element.appendChild(this._shadowKnob.element);
 }
 
-this._shadowKnob.x = window.webkitConvertPointFromPageToNode(this.element, new WebKitPoint(event.pageX, event.pageY)).x;
+this._shadowKnob.x = event.pageX - this.element.getBoundingClientRect().x;
 
 var colorData = this._canvas.getContext("2d").getImageData(this._shadowKnob.x - 1, 0, 1, 1).data;
 this._shadowKnob.wellColor = new WI.Color(WI.Color.Format.RGB, [colorData[0], colorData[1], colorData[2], colorData[3] / 255]);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js (256646 => 256647)

--- trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js	2020-02-14 22:37:44 UTC (rev 256646)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js	2020-02-14 22:45:08 UTC (rev 256647)
@@ 

[webkit-changes] [256374] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [256374] trunk/Source/WebInspectorUI








Revision 256374
Author nvasil...@apple.com
Date 2020-02-11 14:38:23 -0800 (Tue, 11 Feb 2020)


Log Message
Web Inspector RTL: Elements closing tag is reversed
https://bugs.webkit.org/show_bug.cgi?id=207214

Reviewed by Timothy Hatcher.

Wrap text nodes in `unicode-bidi: isolate-override`. From MDN:

isolate-override:
This keyword applies the isolation behavior of the isolate
keyword to the surrounding content and the override behavior
of the bidi-override keyword to the inner content.

* UserInterface/Views/DOMTreeOutline.css:
(.tree-outline.dom li > span > .html-text-node):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (256373 => 256374)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-11 22:36:56 UTC (rev 256373)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-11 22:38:23 UTC (rev 256374)
@@ -1,3 +1,20 @@
+2020-02-11  Nikita Vasilyev  
+
+Web Inspector RTL: Elements closing tag is reversed
+https://bugs.webkit.org/show_bug.cgi?id=207214
+
+Reviewed by Timothy Hatcher.
+
+Wrap text nodes in `unicode-bidi: isolate-override`. From MDN:
+
+isolate-override:
+This keyword applies the isolation behavior of the isolate
+keyword to the surrounding content and the override behavior
+of the bidi-override keyword to the inner content.
+
+* UserInterface/Views/DOMTreeOutline.css:
+(.tree-outline.dom li > span > .html-text-node):
+
 2020-02-09  Keith Rollin  
 
 Re-enable LTO for ARM builds


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css (256373 => 256374)

--- trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css	2020-02-11 22:36:56 UTC (rev 256373)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeOutline.css	2020-02-11 22:38:23 UTC (rev 256374)
@@ -131,6 +131,10 @@
 margin-right: var(--item-padding-end);
 }
 
+.tree-outline.dom li > span > .html-text-node {
+unicode-bidi: isolate-override;
+}
+
 .tree-outline.dom li .pseudo-class-indicator {
 display: inline-block;
 position: absolute;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [255896] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [255896] trunk/Source/WebInspectorUI








Revision 255896
Author nvasil...@apple.com
Date 2020-02-05 19:36:04 -0800 (Wed, 05 Feb 2020)


Log Message
Web Inspector: Some cookie table column headers should not be localizable
https://bugs.webkit.org/show_bug.cgi?id=206920

Reviewed by Timothy Hatcher.

Keep headers that match cookie directives always in English.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Views/CookieStorageContentView.js:
(WI.CookieStorageContentView.prototype.initialLayout):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
trunk/Source/WebInspectorUI/UserInterface/Views/CookieStorageContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (255895 => 255896)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-06 03:28:43 UTC (rev 255895)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-06 03:36:04 UTC (rev 255896)
@@ -1,3 +1,16 @@
+2020-02-05  Nikita Vasilyev  
+
+Web Inspector: Some cookie table column headers should not be localizable
+https://bugs.webkit.org/show_bug.cgi?id=206920
+
+Reviewed by Timothy Hatcher.
+
+Keep headers that match cookie directives always in English.
+
+* Localizations/en.lproj/localizedStrings.js:
+* UserInterface/Views/CookieStorageContentView.js:
+(WI.CookieStorageContentView.prototype.initialLayout):
+
 2020-02-05  Devin Rousso  
 
 Web Inspector: slightly increase the horizontal padding around scope bar items


Modified: trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js (255895 => 255896)

--- trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2020-02-06 03:28:43 UTC (rev 255895)
+++ trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js	2020-02-06 03:36:04 UTC (rev 255896)
@@ -533,7 +533,6 @@
 localizedStrings["Expand columns"] = "Expand columns";
 localizedStrings["Expanded"] = "Expanded";
 localizedStrings["Experimental"] = "Experimental";
-localizedStrings["Expires"] = "Expires";
 localizedStrings["Export"] = "Export";
 localizedStrings["Export (%s)"] = "Export (%s)";
 localizedStrings["Export HAR"] = "Export HAR";


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/CookieStorageContentView.js (255895 => 255896)

--- trunk/Source/WebInspectorUI/UserInterface/Views/CookieStorageContentView.js	2020-02-06 03:28:43 UTC (rev 255895)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/CookieStorageContentView.js	2020-02-06 03:36:04 UTC (rev 255896)
@@ -180,19 +180,19 @@
 hideable: false,
 });
 
-this._domainColumn = new WI.TableColumn("domain", WI.UIString("Domain"), {
+this._domainColumn = new WI.TableColumn("domain", WI.unlocalizedString("Domain"), {
 minWidth: 100,
 maxWidth: 200,
 initialWidth: 120,
 });
 
-this._pathColumn = new WI.TableColumn("path", WI.UIString("Path"), {
+this._pathColumn = new WI.TableColumn("path", WI.unlocalizedString("Path"), {
 minWidth: 50,
 maxWidth: 300,
 initialWidth: 100,
 });
 
-this._expiresColumn = new WI.TableColumn("expires", WI.UIString("Expires"), {
+this._expiresColumn = new WI.TableColumn("expires", WI.unlocalizedString("Expires"), {
 minWidth: 100,
 maxWidth: 200,
 initialWidth: 150,






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [255888] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [255888] trunk/Source/WebInspectorUI








Revision 255888
Author nvasil...@apple.com
Date 2020-02-05 18:29:56 -0800 (Wed, 05 Feb 2020)


Log Message
Web Inspector: Dragging handles in the easing popover selects sidebar text
https://bugs.webkit.org/show_bug.cgi?id=207316

Reviewed by Timothy Hatcher.

* UserInterface/Views/BezierEditor.js:
(WI.BezierEditor.prototype._handleMousedown):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (255887 => 255888)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-06 02:19:10 UTC (rev 255887)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-06 02:29:56 UTC (rev 255888)
@@ -1,3 +1,13 @@
+2020-02-05  Nikita Vasilyev  
+
+Web Inspector: Dragging handles in the easing popover selects sidebar text
+https://bugs.webkit.org/show_bug.cgi?id=207316
+
+Reviewed by Timothy Hatcher.
+
+* UserInterface/Views/BezierEditor.js:
+(WI.BezierEditor.prototype._handleMousedown):
+
 2020-02-05  Devin Rousso  
 
 Web Inspector: Sources: add a special breakpoint for controlling whether `debugger` statements pause


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.js (255887 => 255888)

--- trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.js	2020-02-06 02:19:10 UTC (rev 255887)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.js	2020-02-06 02:29:56 UTC (rev 255888)
@@ -213,6 +213,7 @@
 if (event.button !== 0)
 return;
 
+event.stop();
 window.addEventListener("mousemove", this, true);
 window.addEventListener("mouseup", this, true);
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [255886] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [255886] trunk/Source/WebInspectorUI








Revision 255886
Author nvasil...@apple.com
Date 2020-02-05 18:16:43 -0800 (Wed, 05 Feb 2020)


Log Message
Web Inspector: Bezier editor popover should be strictly LTR
https://bugs.webkit.org/show_bug.cgi?id=206968


Reviewed by Timothy Hatcher.

- Don't mirror the coordinate system.
- Don't reverste the order of the cubic bezier values, e.g. `cubic-bezier(0, 0.5, 1, 0.5)`.

* UserInterface/Views/BezierEditor.css:
(90%):
(to):
(body[dir=ltr] .bezier-editor): Deleted.
(body[dir=rtl] .bezier-editor): Deleted.
(body[dir=rtl] .bezier-editor > .bezier-container): Deleted.
* UserInterface/Views/BezierEditor.js:

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.css
trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (255885 => 255886)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-02-06 02:13:47 UTC (rev 255885)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-02-06 02:16:43 UTC (rev 255886)
@@ -1,3 +1,22 @@
+2020-02-05  Nikita Vasilyev  
+
+Web Inspector: Bezier editor popover should be strictly LTR
+https://bugs.webkit.org/show_bug.cgi?id=206968
+
+
+Reviewed by Timothy Hatcher.
+
+- Don't mirror the coordinate system.
+- Don't reverste the order of the cubic bezier values, e.g. `cubic-bezier(0, 0.5, 1, 0.5)`.
+
+* UserInterface/Views/BezierEditor.css:
+(90%):
+(to):
+(body[dir=ltr] .bezier-editor): Deleted.
+(body[dir=rtl] .bezier-editor): Deleted.
+(body[dir=rtl] .bezier-editor > .bezier-container): Deleted.
+* UserInterface/Views/BezierEditor.js:
+
 2020-02-03  Carlos Garcia Campos  
 
 Unreviewed. Fix the inspector files combination after r255547


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.css (255885 => 255886)

--- trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.css	2020-02-06 02:13:47 UTC (rev 255885)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.css	2020-02-06 02:16:43 UTC (rev 255886)
@@ -30,14 +30,6 @@
 --bezier-editor-preview-translateX: 170px;
 }
 
-body[dir=ltr] .bezier-editor {
---bezier-editor-preview-translateX-animate: var(--bezier-editor-preview-translateX);
-}
-
-body[dir=rtl] .bezier-editor {
---bezier-editor-preview-translateX-animate: calc(-1 * var(--bezier-editor-preview-translateX));
-}
-
 .bezier-editor > .bezier-preview {
 width: calc(100% - 10px);
 height: 25px;
@@ -69,8 +61,8 @@
 @keyframes bezierPreview {
 from { transform: translateX(0); }
 10% { transform: translateX(0); }
-90% { transform: translateX(var(--bezier-editor-preview-translateX-animate)); }
-to { transform: translateX(var(--bezier-editor-preview-translateX-animate)); }
+90% { transform: translateX(var(--bezier-editor-preview-translateX)); }
+to { transform: translateX(var(--bezier-editor-preview-translateX)); }
 }
 
 .bezier-editor > .bezier-container {
@@ -77,10 +69,6 @@
 margin: 0 8px;
 }
 
-body[dir=rtl] .bezier-editor > .bezier-container {
-transform: scaleX(-1);
-}
-
 .bezier-editor > .bezier-container .linear-curve {
 fill: none;
 stroke: var(--text-color-quaternary);


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.js (255885 => 255886)

--- trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.js	2020-02-06 02:13:47 UTC (rev 255885)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/BezierEditor.js	2020-02-06 02:16:43 UTC (rev 255886)
@@ -31,6 +31,7 @@
 
 this._element = document.createElement("div");
 this._element.classList.add("bezier-editor");
+this._element.dir = "ltr";
 
 var editorWidth = 184;
 var editorHeight = 200;






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [254773] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [254773] trunk/Source/WebInspectorUI








Revision 254773
Author nvasil...@apple.com
Date 2020-01-17 16:16:09 -0800 (Fri, 17 Jan 2020)


Log Message
Web Inspector: Unchecking Enable Preview Features on Engineering and Preview builds does not affect WI.arePreviewFeaturesEnabled()
https://bugs.webkit.org/show_bug.cgi?id=204026

Reviewed by Brian Burg.

Make `WI.arePreviewFeaturesEnabled()` return false when Enable Preview Features is unchecked.

* UserInterface/Base/Setting.js:
(WI.canShowPreviewFeatures):
(WI.arePreviewFeaturesEnabled):
(WI.isTechnologyPreviewBuild): Deleted.
(WI.canShowPreviewFeatures): Added.
* UserInterface/Views/SettingsTabContentView.js:

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js
trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (254772 => 254773)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-01-17 23:57:35 UTC (rev 254772)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-01-18 00:16:09 UTC (rev 254773)
@@ -1,3 +1,19 @@
+2020-01-17  Nikita Vasilyev  
+
+Web Inspector: Unchecking Enable Preview Features on Engineering and Preview builds does not affect WI.arePreviewFeaturesEnabled()
+https://bugs.webkit.org/show_bug.cgi?id=204026
+
+Reviewed by Brian Burg.
+
+Make `WI.arePreviewFeaturesEnabled()` return false when Enable Preview Features is unchecked.
+
+* UserInterface/Base/Setting.js:
+(WI.canShowPreviewFeatures):
+(WI.arePreviewFeaturesEnabled):
+(WI.isTechnologyPreviewBuild): Deleted.
+(WI.canShowPreviewFeatures): Added.
+* UserInterface/Views/SettingsTabContentView.js:
+
 2020-01-16  Devin Rousso  
 
 Web Inspector: add links to reference pages


Modified: trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js (254772 => 254773)

--- trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2020-01-17 23:57:35 UTC (rev 254772)
+++ trunk/Source/WebInspectorUI/UserInterface/Base/Setting.js	2020-01-18 00:16:09 UTC (rev 254773)
@@ -216,7 +216,7 @@
 zoomFactor: new WI.Setting("zoom-factor", 1),
 
 // Experimental
-experimentalEnablePreviewFeatures: new WI.Setting("experimental-enable-preview-features", false),
+experimentalEnablePreviewFeatures: new WI.Setting("experimental-enable-preview-features", true),
 experimentalEnableNewTabBar: new WI.Setting("experimental-enable-new-tab-bar", false),
 experimentalEnableStylesJumpToEffective: new WI.Setting("experimental-styles-jump-to-effective", false),
 
@@ -245,18 +245,15 @@
 
 WI.previewFeatures = [];
 
-WI.isTechnologyPreviewBuild = function()
+// WebKit may by default enable certain features in a Technology Preview that are not enabled in trunk.
+// Provide a switch that will make non-preview builds behave like an experimental build, for those preview features.
+WI.canShowPreviewFeatures = function()
 {
-return WI.isExperimentalBuild && !WI.isEngineeringBuild;
+let hasPreviewFeatures = WI.previewFeatures.length > 0;
+return hasPreviewFeatures && WI.isExperimentalBuild;
 };
 
 WI.arePreviewFeaturesEnabled = function()
 {
-if (WI.isExperimentalBuild)
-return true;
-
-if (WI.settings.experimentalEnablePreviewFeatures.value)
-return true;
-
-return false;
+return WI.canShowPreviewFeatures() && WI.settings.experimentalEnablePreviewFeatures.value;
 };


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js (254772 => 254773)

--- trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2020-01-17 23:57:35 UTC (rev 254772)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.js	2020-01-18 00:16:09 UTC (rev 254773)
@@ -355,10 +355,7 @@
 
 let initialValues = new Map;
 
-// WebKit may by default enable certain features in a Technology Preview that are not enabled in trunk.
-// Provide a switch that will make non-preview builds behave like an experimental build, for those preview features.
-let hasPreviewFeatures = WI.previewFeatures.length > 0;
-if (hasPreviewFeatures && (WI.isTechnologyPreviewBuild() || WI.isEngineeringBuild)) {
+if (WI.canShowPreviewFeatures()) {
 experimentalSettingsView.addSetting(WI.UIString("Staging:"), WI.settings.experimentalEnablePreviewFeatures, WI.UIString("Enable Preview Features"));
 experimentalSettingsView.addSeparator();
 }






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [254726] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [254726] trunk/Source/WebInspectorUI








Revision 254726
Author nvasil...@apple.com
Date 2020-01-16 17:08:21 -0800 (Thu, 16 Jan 2020)


Log Message
REGRESSION(r251487): Web Inspector: selected color in color picker has wrong lightness
https://bugs.webkit.org/show_bug.cgi?id=206202

Reviewed by Devin Rousso.

Currently, tintedColor setter has two code paths:
- rgb2hsv convertion if the color is defined using color(...) syntax.
- HSL to HSV convertion for any other color.

The latter was defined in the view, was untested, and incorrect.
This patch uses WI.Color.rgb2hsv convertion for all colors. This method is
already covered by tests.

* UserInterface/Views/ColorSquare.js:
(WI.ColorSquare.prototype.set tintedColor):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (254725 => 254726)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-01-17 00:55:15 UTC (rev 254725)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-01-17 01:08:21 UTC (rev 254726)
@@ -1,3 +1,21 @@
+2020-01-16  Nikita Vasilyev  
+
+REGRESSION(r251487): Web Inspector: selected color in color picker has wrong lightness
+https://bugs.webkit.org/show_bug.cgi?id=206202
+
+Reviewed by Devin Rousso.
+
+Currently, tintedColor setter has two code paths:
+- rgb2hsv convertion if the color is defined using color(...) syntax.
+- HSL to HSV convertion for any other color.
+
+The latter was defined in the view, was untested, and incorrect.
+This patch uses WI.Color.rgb2hsv convertion for all colors. This method is
+already covered by tests.
+
+* UserInterface/Views/ColorSquare.js:
+(WI.ColorSquare.prototype.set tintedColor):
+
 2020-01-16  David Kilzer  
 
 Enable -Wconditional-uninitialized in WebInspectorUI, WebKitLegacy, WebKit projects


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js (254725 => 254726)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js	2020-01-17 00:55:15 UTC (rev 254725)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js	2020-01-17 01:08:21 UTC (rev 254726)
@@ -106,29 +106,14 @@
 
 this._gamut = tintedColor.gamut;
 
-if (tintedColor.format === WI.Color.Format.ColorFunction) {
-// CSS color function only supports RGB. It doesn't support HSL.
-let hsv = WI.Color.rgb2hsv(...tintedColor.normalizedRGB);
-let x = hsv[1] / 100 * this._dimension;
-let y = (1 - (hsv[2] / 100)) * this._dimension;
-this._setCrosshairPosition(new WI.Point(x, y));
-if (this._gamut === WI.Color.Gamut.DisplayP3)
-this._drawSRGBOutline();
-} else {
-let hsl = tintedColor.hsl;
-let saturation = Number.constrain(hsl[1], 0, 100);
-let x = saturation / 100 * this._dimension;
+let [hue, saturation, value] = WI.Color.rgb2hsv(...tintedColor.normalizedRGB);
+let x = saturation / 100 * this._dimension;
+let y = (1 - (value / 100)) * this._dimension;
 
-let lightness = hsl[2];
+if (this._gamut === WI.Color.Gamut.DisplayP3)
+this._drawSRGBOutline();
 
-// The color picker is HSV-based. (HSV is also known as HSB.)
-// Derive lightness by using HSV to HSL equation.
-let y = 2 * lightness / (200 - saturation);
-y = -1 * (y - 1) * this._dimension;
-
-this._setCrosshairPosition(new WI.Point(x, y));
-}
-
+this._setCrosshairPosition(new WI.Point(x, y));
 this._updateBaseColor();
 }
 






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [254316] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [254316] trunk/Source/WebInspectorUI








Revision 254316
Author nvasil...@apple.com
Date 2020-01-09 17:24:26 -0800 (Thu, 09 Jan 2020)


Log Message
Web Inspector: suggest "color()" when defining color in CSS value
https://bugs.webkit.org/show_bug.cgi?id=205976

Reviewed by Devin Rousso.

* UserInterface/Models/CSSKeywordCompletions.js:

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (254315 => 254316)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-01-10 01:07:39 UTC (rev 254315)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-01-10 01:24:26 UTC (rev 254316)
@@ -1,3 +1,12 @@
+2020-01-09  Nikita Vasilyev  
+
+Web Inspector: suggest "color()" when defining color in CSS value
+https://bugs.webkit.org/show_bug.cgi?id=205976
+
+Reviewed by Devin Rousso.
+
+* UserInterface/Models/CSSKeywordCompletions.js:
+
 2020-01-08  Devin Rousso  
 
 Web Inspector: Sources: not all injected scripts and style sheets are from extensions


Modified: trunk/Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js (254315 => 254316)

--- trunk/Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js	2020-01-10 01:07:39 UTC (rev 254315)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js	2020-01-10 01:24:26 UTC (rev 254316)
@@ -311,7 +311,7 @@
 "paleturquoise", "palevioletred", "papayawhip", "peachpuff", "peru", "pink", "plum", "powderblue", "rebeccapurple", "rosybrown",
 "royalblue", "saddlebrown", "salmon", "sandybrown", "seagreen", "seashell", "sienna", "skyblue", "slateblue",
 "slategray", "slategrey", "snow", "springgreen", "steelblue", "tan", "thistle", "tomato", "turquoise", "violet",
-"wheat", "whitesmoke", "yellowgreen", "rgb()", "rgba()", "hsl()", "hsla()"
+"wheat", "whitesmoke", "yellowgreen", "rgb()", "rgba()", "hsl()", "hsla()", "color()",
 ];
 
 WI.CSSKeywordCompletions._colorAwareProperties = new Set([






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [254243] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [254243] trunk/Source/WebInspectorUI








Revision 254243
Author nvasil...@apple.com
Date 2020-01-08 18:00:06 -0800 (Wed, 08 Jan 2020)


Log Message
Web Inspector: Show RGBA input fields for p3 color picker
https://bugs.webkit.org/show_bug.cgi?id=203928


Reviewed by Brian Burg.

Display numeric input fields for colors defined via `color(...)` CSS syntax.

* UserInterface/Controllers/CodeMirrorColorEditingController.js:
(WI.CodeMirrorColorEditingController.prototype.popoverWillPresent):
Remove unnecessary WI.ColorPicker.Event.FormatChanged event.

* UserInterface/Views/ColorPicker.css:
(.color-picker > .color-inputs > div + div):
* UserInterface/Views/ColorPicker.js:
(WI.ColorPicker):
Don't append inputs of all possible color formats to DOM on instantiation.

(WI.ColorPicker.prototype.set color):
(WI.ColorPicker.prototype.set enableColorComponentInputs):
(WI.ColorPicker.prototype._updateColor):
(WI.ColorPicker.prototype._updateColorGamut):
(WI.ColorPicker.prototype._createColorInputsIfNeeded):
(WI.ColorPicker.prototype._showColorComponentInputs):
(WI.ColorPicker.prototype._handleColorInputsContainerInput):
* UserInterface/Views/InlineSwatch.js:
Remove unnecessary WI.ColorPicker.Event.FormatChanged event.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Controllers/CodeMirrorColorEditingController.js
trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.css
trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (254242 => 254243)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-01-09 01:42:45 UTC (rev 254242)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-01-09 02:00:06 UTC (rev 254243)
@@ -1,3 +1,33 @@
+2020-01-08  Nikita Vasilyev  
+
+Web Inspector: Show RGBA input fields for p3 color picker
+https://bugs.webkit.org/show_bug.cgi?id=203928
+
+
+Reviewed by Brian Burg.
+
+Display numeric input fields for colors defined via `color(...)` CSS syntax.
+
+* UserInterface/Controllers/CodeMirrorColorEditingController.js:
+(WI.CodeMirrorColorEditingController.prototype.popoverWillPresent):
+Remove unnecessary WI.ColorPicker.Event.FormatChanged event.
+
+* UserInterface/Views/ColorPicker.css:
+(.color-picker > .color-inputs > div + div):
+* UserInterface/Views/ColorPicker.js:
+(WI.ColorPicker):
+Don't append inputs of all possible color formats to DOM on instantiation.
+
+(WI.ColorPicker.prototype.set color):
+(WI.ColorPicker.prototype.set enableColorComponentInputs):
+(WI.ColorPicker.prototype._updateColor):
+(WI.ColorPicker.prototype._updateColorGamut):
+(WI.ColorPicker.prototype._createColorInputsIfNeeded):
+(WI.ColorPicker.prototype._showColorComponentInputs):
+(WI.ColorPicker.prototype._handleColorInputsContainerInput):
+* UserInterface/Views/InlineSwatch.js:
+Remove unnecessary WI.ColorPicker.Event.FormatChanged event.
+
 2020-01-08  Devin Rousso  
 
 REGRESSION: (r254186) [ Mac ] inspector/css/add-rule.html is failing


Modified: trunk/Source/WebInspectorUI/UserInterface/Controllers/CodeMirrorColorEditingController.js (254242 => 254243)

--- trunk/Source/WebInspectorUI/UserInterface/Controllers/CodeMirrorColorEditingController.js	2020-01-09 01:42:45 UTC (rev 254242)
+++ trunk/Source/WebInspectorUI/UserInterface/Controllers/CodeMirrorColorEditingController.js	2020-01-09 02:00:06 UTC (rev 254243)
@@ -41,7 +41,6 @@
 {
 this._colorPicker = new WI.ColorPicker;
 this._colorPicker.addEventListener(WI.ColorPicker.Event.ColorChanged, this._colorPickerColorChanged, this);
-this._colorPicker.addEventListener(WI.ColorPicker.Event.FormatChanged, (event) => popover.update());
 popover.content = this._colorPicker.element;
 }
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.css (254242 => 254243)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.css	2020-01-09 01:42:45 UTC (rev 254242)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.css	2020-01-09 02:00:06 UTC (rev 254243)
@@ -89,11 +89,7 @@
 width: 100%;
 }
 
-.color-picker > .color-inputs > div[hidden] {
-display: none;
-}
-
-.color-picker > .color-inputs > div:not([hidden]) + div {
+.color-picker > .color-inputs > div + div {
 -webkit-margin-start: 4px;
 }
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js (254242 => 254243)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js	2020-01-09 01:42:45 UTC (rev 254242)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js	2020-01-09 02:00:06 UTC (rev 254243)
@@ -39,38 +39,14 @@
 this._opacitySlider.delegate = this;
 this._opacitySlider.element.classList.add("opacity");
 
-

[webkit-changes] [254094] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [254094] trunk/Source/WebInspectorUI








Revision 254094
Author nvasil...@apple.com
Date 2020-01-06 15:55:35 -0800 (Mon, 06 Jan 2020)


Log Message
Web Inspector: Color picker: make it keyboard accessible
https://bugs.webkit.org/show_bug.cgi?id=205572


Reviewed by Brian Burg.

For the color square, make up, down, left, and right keys move the crosshair.

For the hue and opacity sliders:
- Pressing up and down keys should adjust the value by 1%.
- When holding Shift, up and down keys adjust the value by 10%.

* UserInterface/Views/ColorPicker.js:
(WI.ColorPicker.prototype.focus):
* UserInterface/Views/ColorSquare.css:
(.color-square):
Match the border of the hue and opacity sliders.

* UserInterface/Views/ColorSquare.js:
(WI.ColorSquare):
Make the color square focusable.

(WI.ColorSquare.prototype._handleMousedown):
(WI.ColorSquare.prototype._handleKeyDown):
* UserInterface/Views/InlineSwatch.js:
* UserInterface/Views/Slider.css:
(.slider:focus):
* UserInterface/Views/Slider.js:
(WI.Slider):
(WI.Slider.prototype._handleMousedown):
Drive-by: right clicking the slider shouldn't move the thumb.

(WI.Slider.prototype._handleKeyDown):

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js
trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.css
trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js
trunk/Source/WebInspectorUI/UserInterface/Views/InlineSwatch.js
trunk/Source/WebInspectorUI/UserInterface/Views/Slider.css
trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (254093 => 254094)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-01-06 23:49:21 UTC (rev 254093)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-01-06 23:55:35 UTC (rev 254094)
@@ -1,5 +1,41 @@
 2020-01-06  Nikita Vasilyev  
 
+Web Inspector: Color picker: make it keyboard accessible
+https://bugs.webkit.org/show_bug.cgi?id=205572
+
+
+Reviewed by Brian Burg.
+
+For the color square, make up, down, left, and right keys move the crosshair.
+
+For the hue and opacity sliders:
+- Pressing up and down keys should adjust the value by 1%.
+- When holding Shift, up and down keys adjust the value by 10%.
+
+* UserInterface/Views/ColorPicker.js:
+(WI.ColorPicker.prototype.focus):
+* UserInterface/Views/ColorSquare.css:
+(.color-square):
+Match the border of the hue and opacity sliders.
+
+* UserInterface/Views/ColorSquare.js:
+(WI.ColorSquare):
+Make the color square focusable.
+
+(WI.ColorSquare.prototype._handleMousedown):
+(WI.ColorSquare.prototype._handleKeyDown):
+* UserInterface/Views/InlineSwatch.js:
+* UserInterface/Views/Slider.css:
+(.slider:focus):
+* UserInterface/Views/Slider.js:
+(WI.Slider):
+(WI.Slider.prototype._handleMousedown):
+Drive-by: right clicking the slider shouldn't move the thumb.
+
+(WI.Slider.prototype._handleKeyDown):
+
+2020-01-06  Nikita Vasilyev  
+
 REGRESSION(r218839): Web Inspector: Color picker: pressing Esc should hide color picker
 https://bugs.webkit.org/show_bug.cgi?id=205570
 


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js (254093 => 254094)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js	2020-01-06 23:49:21 UTC (rev 254093)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js	2020-01-06 23:55:35 UTC (rev 254094)
@@ -143,6 +143,11 @@
 this._showColorComponentInputs();
 }
 
+focus()
+{
+this._colorSquare.element.focus();
+}
+
 colorSquareColorDidChange(colorSquare)
 {
 this._updateColor();


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.css (254093 => 254094)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.css	2020-01-06 23:49:21 UTC (rev 254093)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.css	2020-01-06 23:55:35 UTC (rev 254094)
@@ -25,6 +25,7 @@
 
 .color-square {
 position: relative;
+outline: 0.5px solid hsl(0, 0%, 70%);
 
 --stroke-opacity: 0.8;
 }


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js (254093 => 254094)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js	2020-01-06 23:49:21 UTC (rev 254093)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorSquare.js	2020-01-06 23:55:35 UTC (rev 254094)
@@ -37,6 +37,7 @@
 
 this._element = document.createElement("div");
 this._element.className = "color-square";
+this._element.tabIndex = 0;
 
 let saturationGradientElement = this._element.appendChild(document.createElement("div"));
 saturationGradientElement.className = "saturation-gradient fill";
@@ -49,6 +50,7 @@
 this._polylineElement = null;
 
 

[webkit-changes] [254061] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [254061] trunk/Source/WebInspectorUI








Revision 254061
Author nvasil...@apple.com
Date 2020-01-06 10:24:27 -0800 (Mon, 06 Jan 2020)


Log Message
REGRESSION(r218839): Web Inspector: Color picker: pressing Esc should hide color picker
https://bugs.webkit.org/show_bug.cgi?id=205570


Reviewed by Brian Burg.

* UserInterface/Views/QuickConsole.js:
(WI.QuickConsole.prototype.set keyboardShortcutDisabled):
(WI.QuickConsole.prototype._toggleOrFocus):
Restore keyboardShortcutDisabled setter, which was removed in r218839 without any explanation.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/QuickConsole.js




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (254060 => 254061)

--- trunk/Source/WebInspectorUI/ChangeLog	2020-01-06 18:08:17 UTC (rev 254060)
+++ trunk/Source/WebInspectorUI/ChangeLog	2020-01-06 18:24:27 UTC (rev 254061)
@@ -1,3 +1,16 @@
+2020-01-06  Nikita Vasilyev  
+
+REGRESSION(r218839): Web Inspector: Color picker: pressing Esc should hide color picker
+https://bugs.webkit.org/show_bug.cgi?id=205570
+
+
+Reviewed by Brian Burg.
+
+* UserInterface/Views/QuickConsole.js:
+(WI.QuickConsole.prototype.set keyboardShortcutDisabled):
+(WI.QuickConsole.prototype._toggleOrFocus):
+Restore keyboardShortcutDisabled setter, which was removed in r218839 without any explanation.
+
 2020-01-06  Devin Rousso  
 
 Web Inspector: Canvas: unable to see recording actions for WebGL canvases that have lots of shader programs


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/QuickConsole.js (254060 => 254061)

--- trunk/Source/WebInspectorUI/UserInterface/Views/QuickConsole.js	2020-01-06 18:08:17 UTC (rev 254060)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/QuickConsole.js	2020-01-06 18:24:27 UTC (rev 254061)
@@ -31,6 +31,7 @@
 
 this._toggleOrFocusKeyboardShortcut = new WI.KeyboardShortcut(null, WI.KeyboardShortcut.Key.Escape, this._toggleOrFocus.bind(this));
 this._toggleOrFocusKeyboardShortcut.implicitlyPreventsDefault = false;
+this._keyboardShortcutDisabled = false;
 
 this._automaticExecutionContextPathComponent = this._createExecutionContextPathComponent(null, WI.UIString("Auto"));
 this._updateAutomaticExecutionContextPathComponentTooltip();
@@ -101,6 +102,11 @@
 return this._navigationBar;
 }
 
+set keyboardShortcutDisabled(disabled)
+{
+this._keyboardShortcutDisabled = disabled;
+}
+
 closed()
 {
 WI.settings.consoleSavedResultAlias.removeEventListener(null, null, this);
@@ -446,6 +452,9 @@
 
 _toggleOrFocus(event)
 {
+if (this._keyboardShortcutDisabled)
+return;
+
 if (this.prompt.focused) {
 WI.toggleSplitConsole();
 event.preventDefault();






___
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

[webkit-changes] [253859] trunk/Source/WebInspectorUI

[nvasilyev]

Title: [253859] trunk/Source/WebInspectorUI








Revision 253859
Author nvasil...@apple.com
Date 2019-12-20 17:52:11 -0800 (Fri, 20 Dec 2019)


Log Message
Web Inspector: Gradient editor: opacity slider is too close to the right edge of the popover
https://bugs.webkit.org/show_bug.cgi?id=203643


Reviewed by Devin Rousso.

Replace absolute positioning in the color picker with static layout.

* UserInterface/Views/ColorPicker.css:
(.color-picker .wrapper):
(.color-picker :matches(.color-square, .slider)):
(.color-picker .slider):
(.color-picker .hue):
(@media (color-gamut: p3) .color-picker.gamut-p3 > .hue):
(.color-picker > .color-inputs):
(.color-picker > .color-inputs > div):
(.color-picker > .color-inputs > div:not([hidden]) + div):
The 1st visible div should have no left margin even if it's preceded by a hidden div.

* UserInterface/Views/ColorPicker.js:
(WI.ColorPicker):
(WI.ColorPicker.prototype._updateOpacitySlider):
* UserInterface/Views/GradientEditor.css:
(.gradient-editor.editing-color):
(.gradient-editor > .color-picker .slider):
* UserInterface/Views/GradientEditor.js:
(WI.GradientEditor):
* UserInterface/Views/Slider.css:
(.slider):
(.slider > img):
(body[dir=ltr] .slider > img):
(body[dir=rtl] .slider > img):
* UserInterface/Views/Slider.js:
(WI.Slider):
(WI.Slider.prototype.set value):
(WI.Slider.prototype.set knobY):
(WI.Slider.prototype.get maxY):
(WI.Slider.prototype.recalculateKnobY):
(WI.Slider.prototype._handleMousedown):
(WI.Slider.prototype._handleMousemove):
* UserInterface/Views/Variables.css:
(:root):
Convert WI.Slider to be vertical by default. WI.Slider used to define a hozirontal slider.
It is only used by the color picker, where it's vertical. The slider was rotated with CSS
transformation. This made it problematic to use in the static layout.

Modified Paths

trunk/Source/WebInspectorUI/ChangeLog
trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.css
trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.js
trunk/Source/WebInspectorUI/UserInterface/Views/GradientEditor.css
trunk/Source/WebInspectorUI/UserInterface/Views/GradientEditor.js
trunk/Source/WebInspectorUI/UserInterface/Views/Slider.css
trunk/Source/WebInspectorUI/UserInterface/Views/Slider.js
trunk/Source/WebInspectorUI/UserInterface/Views/Variables.css




Diff

Modified: trunk/Source/WebInspectorUI/ChangeLog (253858 => 253859)

--- trunk/Source/WebInspectorUI/ChangeLog	2019-12-21 01:49:05 UTC (rev 253858)
+++ trunk/Source/WebInspectorUI/ChangeLog	2019-12-21 01:52:11 UTC (rev 253859)
@@ -1,3 +1,51 @@
+2019-12-20  Nikita Vasilyev  
+
+Web Inspector: Gradient editor: opacity slider is too close to the right edge of the popover
+https://bugs.webkit.org/show_bug.cgi?id=203643
+
+
+Reviewed by Devin Rousso.
+
+Replace absolute positioning in the color picker with static layout.
+
+* UserInterface/Views/ColorPicker.css:
+(.color-picker .wrapper):
+(.color-picker :matches(.color-square, .slider)):
+(.color-picker .slider):
+(.color-picker .hue):
+(@media (color-gamut: p3) .color-picker.gamut-p3 > .hue):
+(.color-picker > .color-inputs):
+(.color-picker > .color-inputs > div):
+(.color-picker > .color-inputs > div:not([hidden]) + div):
+The 1st visible div should have no left margin even if it's preceded by a hidden div.
+
+* UserInterface/Views/ColorPicker.js:
+(WI.ColorPicker):
+(WI.ColorPicker.prototype._updateOpacitySlider):
+* UserInterface/Views/GradientEditor.css:
+(.gradient-editor.editing-color):
+(.gradient-editor > .color-picker .slider):
+* UserInterface/Views/GradientEditor.js:
+(WI.GradientEditor):
+* UserInterface/Views/Slider.css:
+(.slider):
+(.slider > img):
+(body[dir=ltr] .slider > img):
+(body[dir=rtl] .slider > img):
+* UserInterface/Views/Slider.js:
+(WI.Slider):
+(WI.Slider.prototype.set value):
+(WI.Slider.prototype.set knobY):
+(WI.Slider.prototype.get maxY):
+(WI.Slider.prototype.recalculateKnobY):
+(WI.Slider.prototype._handleMousedown):
+(WI.Slider.prototype._handleMousemove):
+* UserInterface/Views/Variables.css:
+(:root):
+Convert WI.Slider to be vertical by default. WI.Slider used to define a hozirontal slider.
+It is only used by the color picker, where it's vertical. The slider was rotated with CSS
+transformation. This made it problematic to use in the static layout.
+
 2019-12-20  Brian Burg  
 
 Web Inspector: convert some InspectorFrontendHost methods to getters


Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.css (253858 => 253859)

--- trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.css	2019-12-21 01:49:05 UTC (rev 253858)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ColorPicker.css	2019-12-21