Changeset 247405 in webkit


Ignore:
Timestamp:
Jul 12, 2019 4:09:52 PM (5 years ago)
Author:
Devin Rousso
Message:

Web Inspector: Elements: always show all navigation bar items, but disable those that wouldn't work
​https://bugs.webkit.org/show_bug.cgi?id=199594

Reviewed by Ross Kirsling.

Reorder the navigation items of the Elements tab (left to right):

  • Show rulers
  • Force print media styles
  • Force Dark Appearance / Force Light Appearance
  • Show compositing borders
  • Enable paint flashing
  • Show shadow DOM nodes

This way, "related" (e.g. print styles and dark/light appearance both relate to CSS media)
toggles are grouped closer together.

  • UserInterface/Views/DOMTreeContentView.js:

(WI.DOMTreeContentView):
(WI.DOMTreeContentView.prototype.get navigationItems):
(WI.DOMTreeContentView.prototype._defaultAppearanceDidChange):
(WI.DOMTreeContentView.prototype._toggleAppearance):

  • Localizations/en.lproj/localizedStrings.js:
Location:
trunk/Source/WebInspectorUI
Files:
3 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebInspectorUI/ChangeLog

    r247356 r247405  
     12019-07-12  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: Elements: always show all navigation bar items, but disable those that wouldn't work
     4        https://bugs.webkit.org/show_bug.cgi?id=199594
     5
     6        Reviewed by Ross Kirsling.
     7
     8        Reorder the navigation items of the Elements tab (left to right):
     9         - Show rulers
     10         - Force print media styles
     11         - Force Dark Appearance / Force Light Appearance
     12         - Show compositing borders
     13         - Enable paint flashing
     14         - Show shadow DOM nodes
     15        This way, "related" (e.g. print styles and dark/light appearance both relate to CSS media)
     16        toggles are grouped closer together.
     17
     18        * UserInterface/Views/DOMTreeContentView.js:
     19        (WI.DOMTreeContentView):
     20        (WI.DOMTreeContentView.prototype.get navigationItems):
     21        (WI.DOMTreeContentView.prototype._defaultAppearanceDidChange):
     22        (WI.DOMTreeContentView.prototype._toggleAppearance):
     23
     24        * Localizations/en.lproj/localizedStrings.js:
     25
    1262019-07-11  Devin Rousso  <drousso@apple.com>
    227

  • trunk/Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js

    r247235 r247405  
    495495localizedStrings["Force Dark Appearance"] = "Force Dark Appearance";
    496496localizedStrings["Force Light Appearance"] = "Force Light Appearance";
    497 localizedStrings["Force Print Media Styles"] = "Force Print Media Styles";
     497localizedStrings["Force print media styles"] = "Force print media styles";
    498498/* Layout phase records that were imperative (forced) */
    499499localizedStrings["Forced Layout"] = "Forced Layout";
    … …  
    555555localizedStrings["Hide Grid"] = "Hide Grid";
    556556localizedStrings["Hide Path"] = "Hide Path";
    557 localizedStrings["Hide Rulers"] = "Hide Rulers";
    558557localizedStrings["Hide compositing borders"] = "Hide compositing borders";
     558localizedStrings["Hide rulers"] = "Hide rulers";
    559559localizedStrings["Hide shadow DOM nodes"] = "Hide shadow DOM nodes";
    560560localizedStrings["Hide the details sidebar (%s)"] = "Hide the details sidebar (%s)";
    … …  
    976976localizedStrings["Show Path"] = "Show Path";
    977977localizedStrings["Show Remaining (%d)"] = "Show Remaining (%d)";
    978 localizedStrings["Show Rulers"] = "Show Rulers";
    979978localizedStrings["Show Scope Chain on pause"] = "Show Scope Chain on pause";
    980979localizedStrings["Show all actions"] = "Show all actions";
    … …  
    990989localizedStrings["Show page resources"] = "Show page resources";
    991990localizedStrings["Show page rulers and node border lines"] = "Show page rulers and node border lines";
     991localizedStrings["Show rulers"] = "Show rulers";
    992992localizedStrings["Show shadow DOM nodes"] = "Show shadow DOM nodes";
    993993localizedStrings["Show the details sidebar (%s)"] = "Show the details sidebar (%s)";
    … …  
    11741174localizedStrings["Usage: %s"] = "Usage: %s";
    11751175localizedStrings["Use Default Appearance"] = "Use Default Appearance";
    1176 localizedStrings["Use Default Media Styles"] = "Use Default Media Styles";
    11771176localizedStrings["Use Mock Capture Devices"] = "Use Mock Capture Devices";
     1177localizedStrings["Use default media styles"] = "Use default media styles";
    11781178localizedStrings["Use the resource cache when loading resources"] = "Use the resource cache when loading resources";
    11791179localizedStrings["User Agent"] = "User Agent";

  • trunk/Source/WebInspectorUI/UserInterface/Views/DOMTreeContentView.js

    r247356 r247405  
    3232        super(representedObject);
    3333
    34         if (InspectorBackend.domains.Page) {
    35             this._compositingBordersButtonNavigationItem = new WI.ActivateButtonNavigationItem("layer-borders", WI.UIString("Show compositing borders"), WI.UIString("Hide compositing borders"), "Images/LayerBorders.svg", 13, 13);
    36             this._compositingBordersButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleCompositingBorders, this);
    37             this._compositingBordersButtonNavigationItem.enabled = !!InspectorBackend.domains.Page.getCompositingBordersVisible;
    38             this._compositingBordersButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
    39         }
    40 
    41         if (InspectorBackend.domains.Page) {
    42             WI.settings.showPaintRects.addEventListener(WI.Setting.Event.Changed, this._showPaintRectsSettingChanged, this);
    43             this._paintFlashingButtonNavigationItem = new WI.ActivateButtonNavigationItem("paint-flashing", WI.UIString("Enable paint flashing"), WI.UIString("Disable paint flashing"), "Images/Paint.svg", 16, 16);
    44             this._paintFlashingButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePaintFlashing, this);
    45             this._paintFlashingButtonNavigationItem.enabled = !!InspectorBackend.domains.Page.setShowPaintRects;
    46             this._paintFlashingButtonNavigationItem.activated = InspectorBackend.domains.Page.setShowPaintRects && WI.settings.showPaintRects.value;
    47             this._paintFlashingButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
    48         }
     34        this._compositingBordersButtonNavigationItem = new WI.ActivateButtonNavigationItem("layer-borders", WI.UIString("Show compositing borders"), WI.UIString("Hide compositing borders"), "Images/LayerBorders.svg", 13, 13);
     35        this._compositingBordersButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleCompositingBorders, this);
     36        this._compositingBordersButtonNavigationItem.enabled = !!InspectorBackend.domains.Page;
     37        this._compositingBordersButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
     38
     39        // COMPATIBILITY (iOS 9)
     40        WI.settings.showPaintRects.addEventListener(WI.Setting.Event.Changed, this._showPaintRectsSettingChanged, this);
     41        this._paintFlashingButtonNavigationItem = new WI.ActivateButtonNavigationItem("paint-flashing", WI.UIString("Enable paint flashing"), WI.UIString("Disable paint flashing"), "Images/Paint.svg", 16, 16);
     42        this._paintFlashingButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePaintFlashing, this);
     43        this._paintFlashingButtonNavigationItem.enabled = InspectorBackend.domains.Page && !!InspectorBackend.domains.Page.setShowPaintRects;
     44        this._paintFlashingButtonNavigationItem.activated = InspectorBackend.domains.Page && InspectorBackend.domains.Page.setShowPaintRects && WI.settings.showPaintRects.value;
     45        this._paintFlashingButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
    4946
    5047        WI.settings.showShadowDOM.addEventListener(WI.Setting.Event.Changed, this._showShadowDOMSettingChanged, this);
    … …  
    5451        this._showShadowDOMSettingChanged();
    5552
    56         if (InspectorBackend.domains.Page) {
    57             this._showPrintStylesButtonNavigationItem = new WI.ActivateButtonNavigationItem("print-styles", WI.UIString("Force Print Media Styles"), WI.UIString("Use Default Media Styles"), "Images/Printer.svg", 16, 16);
    58             this._showPrintStylesButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePrintStyles, this);
    59             this._showPrintStylesButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
    60             this._showPrintStylesChanged();
    61         }
    62 
    63         // COMPATIBILITY (iOS 11.3)
    64         if (InspectorBackend.domains.Page && InspectorBackend.domains.Page.setShowRulers) {
    65             WI.settings.showRulers.addEventListener(WI.Setting.Event.Changed, this._showRulersChanged, this);
    66             this._showRulersButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-rulers", WI.UIString("Show Rulers"), WI.UIString("Hide Rulers"), "Images/Rulers.svg", 16, 16);
    67             this._showRulersButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleShowRulers, this);
    68             this._showRulersButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
    69             this._showRulersChanged();
    70         }
     53        this._showPrintStylesButtonNavigationItem = new WI.ActivateButtonNavigationItem("print-styles", WI.UIString("Force print media styles"), WI.UIString("Use default media styles"), "Images/Printer.svg", 16, 16);
     54        this._showPrintStylesButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._togglePrintStyles, this);
     55        this._showPrintStylesButtonNavigationItem.enabled = !!InspectorBackend.domains.Page;
     56        this._showPrintStylesButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
     57        this._showPrintStylesChanged();
     58
     59        // COMPATIBILITY (iOS 12)
     60        WI.settings.showRulers.addEventListener(WI.Setting.Event.Changed, this._showRulersChanged, this);
     61        this._showRulersButtonNavigationItem = new WI.ActivateButtonNavigationItem("show-rulers", WI.UIString("Show rulers"), WI.UIString("Hide rulers"), "Images/Rulers.svg", 16, 16);
     62        this._showRulersButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleShowRulers, this);
     63        this._showRulersButtonNavigationItem.enabled = InspectorBackend.domains.Page && !!InspectorBackend.domains.Page.setShowRulers;
     64        this._showRulersButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
     65        this._showRulersChanged();
    7166
    7267        this.element.classList.add("dom-tree");
    … …  
    9691        this._pendingBreakpointNodeIdentifiers = new Set;
    9792
    98         if (WI.cssManager.canForceAppearance())
    99             this._defaultAppearanceDidChange();
     93        this._defaultAppearanceDidChange();
    10094
    10195        if (WI.domDebuggerManager.supported) {
    … …  
    116110    get navigationItems()
    117111    {
    118         let items = [];
    119 
    120         if (this._showPrintStylesButtonNavigationItem)
    121             items.push(this._showPrintStylesButtonNavigationItem);
    122 
    123         items.push(this._showsShadowDOMButtonNavigationItem);
    124 
    125         if (this._forceAppearanceButtonNavigationItem)
    126             items.push(this._forceAppearanceButtonNavigationItem);
    127 
    128         if (this._showRulersButtonNavigationItem)
    129            items.unshift(this._showRulersButtonNavigationItem);
    130 
    131         if (this._compositingBordersButtonNavigationItem)
    132             items.push(this._compositingBordersButtonNavigationItem);
    133 
    134         if (this._paintFlashingButtonNavigationItem)
    135             items.push(this._paintFlashingButtonNavigationItem);
    136 
    137         return items;
     112        return [
     113            this._showRulersButtonNavigationItem,
     114            this._showPrintStylesButtonNavigationItem,
     115            this._forceAppearanceButtonNavigationItem,
     116            this._compositingBordersButtonNavigationItem,
     117            this._paintFlashingButtonNavigationItem,
     118            this._showsShadowDOMButtonNavigationItem,
     119        ];
    138120    }
    139121
    … …  
    669651    _defaultAppearanceDidChange()
    670652    {
    671         let defaultAppearance = WI.cssManager.defaultAppearance;
    672         if (!defaultAppearance) {
    673             this._lastKnownDefaultAppearance = null;
    674             this._forceAppearanceButtonNavigationItem = null;
    675             this.dispatchEventToListeners(WI.ContentView.Event.NavigationItemsDidChange);
    676             return;
    677         }
    678 
    679653        // Don't update the navigation item if there is currently a forced appearance.
    680654        // The user will need to toggle it off to update it based on the new default appearance.
    681         if (WI.cssManager.forcedAppearance && this._forceAppearanceButtonNavigationItem)
     655        if (WI.cssManager.forcedAppearance)
    682656            return;
    683657
    684658        this._forceAppearanceButtonNavigationItem = null;
    685659
     660        let defaultAppearance = WI.cssManager.defaultAppearance;
    686661        switch (defaultAppearance) {
    687662        case WI.CSSManager.Appearance.Light:
     663        case null: // if there is no default appearance, the navigation item will be disabled
    688664            this._forceAppearanceButtonNavigationItem = new WI.ActivateButtonNavigationItem("appearance", WI.UIString("Force Dark Appearance"), WI.UIString("Use Default Appearance"), "Images/Appearance.svg", 16, 16);
    689665            break;
    … …  
    693669        }
    694670
    695         if (!this._forceAppearanceButtonNavigationItem) {
    696             console.error("Unknown default appearance name:", defaultAppearance);
    697             this.dispatchEventToListeners(WI.ContentView.Event.NavigationItemsDidChange);
    698             return;
    699         }
    700 
    701671        this._lastKnownDefaultAppearance = defaultAppearance;
    702672
    703673        this._forceAppearanceButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleAppearance, this);
    704674        this._forceAppearanceButtonNavigationItem.visibilityPriority = WI.NavigationItem.VisibilityPriority.Low;
     675        this._forceAppearanceButtonNavigationItem.enabled = WI.cssManager.canForceAppearance();
    705676        this._forceAppearanceButtonNavigationItem.activated = !!WI.cssManager.forcedAppearance;
    706677
    … …  
    710681    _toggleAppearance(event)
    711682    {
     683        console.assert(WI.cssManager.canForceAppearance());
     684
    712685        // Use the last known default appearance, since that is the appearance this navigation item was generated for.
    713686        let appearanceToForce = null;
Note: See TracChangeset for help on using the changeset viewer.