2022-01-26  Antoine Quint  <graouts@webkit.org>

        [Web Inspector] Graphics tab should display pseudo-elements for more than ::before and ::after
        https://bugs.webkit.org/show_bug.cgi?id=235234
        <rdar://87766777>

        Reviewed by Devin Rousso.

        Add a new `DOMStyleable` model class to match the new `DOM.Styleable` protocol type. 

        When calling Animation.requestEffectTarget(), we now use this new DOMStyleable class
        to display pseudo-elements other than ::before or ::after in the Graphics tab.

        * UserInterface/Base/DOMUtilities.js:
        (WI.linkifyStyleable):
        * UserInterface/Main.html:
        * UserInterface/Models/Animation.js:
        (WI.Animation.prototype.requestEffectTarget):
        * UserInterface/Models/DOMStyleable.js: Added.
        (WI.DOMStyleable.prototype.fromPayload):
        (WI.DOMStyleable.prototype.get node):
        (WI.DOMStyleable.prototype.get pseudoId):
        (WI.DOMStyleable.prototype.get displayName):
        (WI.DOMStyleable):
        * UserInterface/Test.html:
        * UserInterface/Views/AnimationCollectionContentView.js:
        (WI.AnimationCollectionContentView.prototype._handleContentViewMouseEnter):
        * UserInterface/Views/AnimationContentView.js:
        (WI.AnimationContentView.prototype._refreshSubtitle):
        * UserInterface/Views/AnimationDetailsSidebarPanel.js:
        (WI.AnimationDetailsSidebarPanel.prototype._refreshIdentitySection):

2022-01-25  Nikita Vasilyev  <nvasilyev@apple.com>

        Web Inspector: Collapse blackboxed call frames by default
        https://bugs.webkit.org/show_bug.cgi?id=234581
        <rdar://problem/86967088>

        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  <drousso@apple.com>

        Web Inspector: replace gear-with-contextmenu icons used for filtering with filter-with-contextmenu icons
        https://bugs.webkit.org/show_bug.cgi?id=235546

        Reviewed by Dean Jackson.

        * UserInterface/Views/ComputedStyleDetailsPanel.js:
        (WI.ComputedStyleDetailsPanel.prototype.initialLayout):
        * UserInterface/Views/ComputedStyleDetailsPanel.css:
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-properties > .header > .options.filter):
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-properties > .header > .options.filter:active): Added.
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-properties > .header > .options.filter.active): Added.
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-properties > .header > .options.filter.active:active): Added.
        * UserInterface/Views/DOMNodeDetailsSidebarPanel.js:
        (WI.DOMNodeDetailsSidebarPanel.prototype.initialLayout):
        * UserInterface/Views/DOMNodeDetailsSidebarPanel.css:
        (.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners > .header > .filter):
        (.sidebar > .panel.dom-node-details .details-section.dom-node-event-listeners > .header > .filter:active): Added.
        * UserInterface/Views/NetworkTableContentView.js:
        (WI.NetworkTableContentView):

        * UserInterface/Images/Filter.svg: Added.

2022-01-24  Devin Rousso  <drousso@apple.com>

        Web Inspector: Network: give the Ignore Caches button a label so it's more visible and immediately understandable
        https://bugs.webkit.org/show_bug.cgi?id=235539

        Reviewed by Patrick Angle.

        * UserInterface/Views/NetworkTableContentView.js:
        (WI.NetworkTableContentView):
        (WI.NetworkTableContentView.prototype.get navigationItems):
        (WI.NetworkTableContentView.prototype._resourceCachingDisabledSettingChanged):

        * Localizations/en.lproj/localizedStrings.js:

        * UserInterface/Images/IgnoreCaches.svg: Deleted.

2022-01-24  Patrick Angle  <pangle@apple.com>

        Web Inspector: [Flexbox] Add instrumentation/protocol bits for flex layout containers
        https://bugs.webkit.org/show_bug.cgi?id=235454

        Reviewed by Devin Rousso.

        * UserInterface/Models/DOMNode.js:

2022-01-24  Devin Rousso  <drousso@apple.com>

        Web Inspector: Network: move filtering checkboxes into a single gear-with-contextmenu to save space
        https://bugs.webkit.org/show_bug.cgi?id=235538

        Reviewed by Patrick Angle.

        * UserInterface/Views/NetworkTableContentView.js:
        (WI.NetworkTableContentView):
        (WI.NetworkTableContentView.prototype.get navigationItems):
        (WI.NetworkTableContentView.prototype.get filterNavigationItems):
        (WI.NetworkTableContentView.prototype.closed):
        (WI.NetworkTableContentView.prototype._changeCollection):
        (WI.NetworkTableContentView.prototype._updateOtherFiltersNavigationItemState): Added.
        (WI.NetworkTableContentView.prototype._handleOtherFiltersNavigationItemContextMenu): Added.
        (WI.NetworkTableContentView.prototype._handleClearNetworkOnNavigateChanged): Renamed from `_handleClearNetworkOnNavigateChanged`.
        (WI.NetworkTableContentView.prototype._handleGroupMediaRequestsByDOMNodeChanged): Renamed from `_handleGroupMediaRequestsByDOMNodeCheckedDidChange`.
        * UserInterface/Views/NetworkTableContentView.css:
        (.network-other-filters-button > .glyph): Added.
        (.network-other-filters-button:active > .glyph): Added.
        (.network-other-filters-button.active > .glyph): Added.
        (.network-other-filters-button.active:active > .glyph): Added.

        * Localizations/en.lproj/localizedStrings.js:

2022-01-24  Devin Rousso  <drousso@apple.com>

        Web Inspector: Network: collapse type filter scope bar into a single button to save space
        https://bugs.webkit.org/show_bug.cgi?id=235537

        Reviewed by Patrick Angle.

        * UserInterface/Views/NetworkTableContentView.js:
        (WI.NetworkTableContentView):
        * UserInterface/Views/NetworkTableContentView.css:
        (.network-type-filter-scope-bar.default-item-selected:not(:hover)): Added.
        (.network-type-filter-scope-bar.default-item-selected:hover): Added.

2022-01-21  Nikita Vasilyev  <nvasilyev@apple.com>

        Web Inspector: Make alignment editor accessible
        https://bugs.webkit.org/show_bug.cgi?id=235395
        <rdar://problem/87851989>

        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  <drousso@apple.com>

        Web Inspector: fully blackboxed stack traces don't show the right top call frame
        https://bugs.webkit.org/show_bug.cgi?id=235381

        Reviewed by Patrick Angle.

        * UserInterface/Models/StackTrace.js:
        (WI.StackTrace):
        (WI.StackTrace.fromPayload):
        (WI.StackTrace.prototype.get firstNonNativeNonAnonymousNotBlackboxedCallFrame):
        Only assign to `firstNonNativeNonAnonymousCallFrame` once.
        Drive-by: Don't re-fetch the blackbox data for the `WI.SourceCode` of the `WI.CallFrame`.
        Drive-by: Combine optional parameters into an `options = {}` for current code cleanliness
                  and greater flexibility for future changes.

        * UserInterface/Models/CallFrame.js:
        (WI.CallFrame):
        (WI.CallFrame.fromDebuggerPayload):
        (WI.CallFrame.fromPayload):
        * UserInterface/Views/ThreadTreeElement.js:
        (WI.ThreadTreeElement.prototype.refresh):
        Drive-by: Combine optional parameters into an `options = {}` for current code cleanliness
                  and greater flexibility for future changes.

        * UserInterface/Views/CallFrameTreeElement.js:
        (WI.CallFrameTreeElement):
        (WI.CallFrameTreeElement.prototype.onattach):
        * UserInterface/Views/CallFrameView.js:
        (WI.CallFrameView):
        Drive-by: Don't re-fetch the blackbox data for the `WI.SourceCode` of the `WI.CallFrame`.

2022-01-19  Devin Rousso  <drousso@apple.com>

        Web Inspector: blackboxed call frames should be grouped everywhere
        https://bugs.webkit.org/show_bug.cgi?id=234648
        <rdar://problem/87018103>

        Reviewed by Patrick Angle.

        * UserInterface/Controllers/CallFrameTreeController.js:
        (WI.CallFrameTreeController.prototype.groupBlackboxedCallFrames): Added.
        (WI.CallFrameTreeController.prototype.groupBlackboxedCallFrames.displayable): Added.
        (WI.CallFrameTreeController.prototype.set callFrames): Added.
        * UserInterface/Views/StackTraceView.js:
        (WI.StackTraceView):
        * UserInterface/Views/ThreadTreeElement.js:
        (WI.ThreadTreeElement.prototype.refresh):
        * UserInterface/Views/TimelineDataGrid.js:
        (WI.TimelineDataGrid.prototype._createPopoverContent):
        (WI.TimelineDataGrid.prototype._popoverCallStackTreeElementRemoved):
        Centralize code for creating stack trace views so that the logic that groups blackboxed call
        frames (and the associated `WI.BlackboxedGroupTreeElement`/`WI.BlackboxedGroupView`) can be
        shared without duplication.

        * UserInterface/Views/BlackboxedGroupTreeElement.js:
        (WI.BlackboxedGroupTreeElement):
        (WI.BlackboxedGroupTreeElement.prototype.expand):
        (WI.BlackboxedGroupTreeElement.prototype.customTitleTooltip): Added.
        Add a parameter to control whether to remember when expanding blackboxed call frame groups
        so that they can later be auto-expanded. This is needed because that feature is intended so
        that stepping doesn't re-collapse previously expanded blackboxed call frame groups. A more
        technical reason is that non-debugging call stacks can live (i.e. be shown) for a long time
        and therefore there's no good way to clear the remembered state, and we probably don't want
        to have a previous expansion in the Timelines Tab or Canvas Tab suddenly cause all matching
        blackboxed call frame groups in the Sources Tab to always be expanded.
        Drive-by: Override the tooltip to explain that clicking shows the blackboxed call frames.

        * UserInterface/Views/BlackboxedGroupView.js: Added.
        (WI.BlackboxedGroupView):
        (WI.BlackboxedGroupView.generateTitle):
        (WI.BlackboxedGroupView.generateSubtitle):
        (WI.BlackboxedGroupView.generateTooltip):
        * UserInterface/Views/BlackboxedGroupView.css: Added.
        (.blackboxed-group):
        (.blackboxed-group > *):
        (.blackboxed-group .icon):
        (.blackboxed-group .subtitle):
        (.blackboxed-group .separator):
        (@media (prefers-color-scheme: dark) .blackboxed-group .icon):
        (@media (prefers-color-scheme: dark) .blackboxed-group .subtitle):
        (@media (prefers-color-scheme: dark) .blackboxed-group .separator):
        Add a non-tree UI class for showing blackboxed call frame groups (just like how there's
        `WI.CallFrameTreeElement` for tree UIs and `WI.CallFrameView` for non-tree UIs). Also
        centralize the UI strings for all blackboxed call frame group UIs as `static` methods.

        * UserInterface/Views/BlackboxedGroupTreeElement.css:
        (.tree-outline .item.blackboxed-group.selected > *): Added.
        (.tree-outline:not(:focus-within) .item.blackboxed-group.selected > *, body:is(.window-inactive, .window-docked-inactive) .tree-outline .item.blackboxed-group.selected > *): Added.
        (.tree-outline .item.blackboxed-group): Deleted.
        (.tree-outline .item.blackboxed-group:not(.selected) > *, .tree-outline:not(:focus-within) .item.blackboxed-group.selected > *, body:is(.window-inactive, .window-docked-inactive) .tree-outline .item.blackboxed-group.selected > *): Deleted.
        (.tree-outline .item.blackboxed-group .icon): Deleted.
        (@media (prefers-color-scheme: dark) .tree-outline .item.blackboxed-group .icon): Deleted.
        Share styles from `UserInterface/Views/BlackboxedGroupView.css` since both share `.blackboxed-group`.

        * UserInterface/Views/CallFrameTreeElement.js:
        Drive-by: Combine optional parameters into an `options = {}` for current code cleanliness
                  and greater flexibility for future changes.

        * UserInterface/Views/Variables.css:
        (:root):
        * UserInterface/Views/CallFrameTreeElement.css:
        (.tree-outline .item.call-frame.blackboxed:not(.selected)):
        * UserInterface/Views/CallFrameView.css:
        (.call-frame.blackboxed > .title,):
        Drive-by: Rename `--blackboxed-tree-item-opacity` since it's now also used outside trees.

        * UserInterface/Main.html:
        * Localizations/en.lproj/localizedStrings.js:

2022-01-18  Alex Christensen  <achristensen@webkit.org>

        Use c++2a instead of gnu++2a for Cocoa builds
        https://bugs.webkit.org/show_bug.cgi?id=234936

        Reviewed by Sam Weinig.

        * Configurations/Base.xcconfig:

2022-01-14  Devin Rousso  <drousso@apple.com>

        Web Inspector: Sources: cannot copy grouping of blackboxed call frames
        https://bugs.webkit.org/show_bug.cgi?id=234615
        <rdar://problem/86989248>

        Reviewed by Patrick Angle.

        * UserInterface/Views/SourcesNavigationSidebarPanel.js:
        (WI.SourcesNavigationSidebarPanel.prototype.handleCopyEvent):
        (WI.SourcesNavigationSidebarPanel.prototype.handleCopyEvent.addCallFrame): Added.
        Include every `WI.CallFrame` managed by any selected `WI.BlackboxedGroupTreeElement` when
        copying. Also make sure that any async boundaries are taken into account.

        * UserInterface/Views/BlackboxedGroupTreeElement.js:
        (WI.BlackboxedGroupTreeElement):
        (WI.BlackboxedGroupTreeElement.prototype.get callFrames): Added.
        (WI.BlackboxedGroupTreeElement.prototype.get expandable): Added.
        (WI.BlackboxedGroupTreeElement.prototype.onenter): Added.
        (WI.BlackboxedGroupTreeElement.prototype.onspace): Added.
        Make `WI.BlackboxedGroupTreeElement` selectable, and add extra action handlers for expansion.

        * UserInterface/Views/BlackboxedGroupTreeElement.css:
        (.tree-outline .item.blackboxed-group):
        (.tree-outline .item.blackboxed-group:not(.selected) > *, .tree-outline:not(:focus-within) .item.blackboxed-group.selected > *, body:is(.window-inactive, .window-docked-inactive) .tree-outline .item.blackboxed-group.selected > *): Added.
        (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.blackboxed-group.selected .icon): Added.
        Only make the content more transparent if not `.selected` (when the window/tree has focus).

        * UserInterface/Views/TreeElement.js:
        (WI.TreeElement.prototype.get expandable): Added.
        (WI.TreeElement.treeElementToggled):
        Allow `toggleOnClick` to be used when `selectable` too. This allows `WI.BlackboxedGroupTreeElement`
        to `expand` on click while also being able to be selected (e.g. shift-up, command-A, etc.).
        All other uses of `toggleOnClick` set `this.selectable = false;` anyways, so this will have
        no effect to other clients.

        * UserInterface/Views/TreeOutline.js:
        (WI.TreeOutline.prototype.insertChild):
        (WI.TreeOutline.prototype._treeKeyDown):
        * UserInterface/Views/DOMTreeOutline.js:
        (WI.DOMTreeOutline.prototype.update):
        Add a helper `get expandable` instead of assuming it from `get hasChildren`. This allows
        `WI.BlackboxedGroupTreeElement` to override it and always be `true`, since there is no
        situation where we would disallow expansion (which shows the grouped blackboxed call frames).

        * UserInterface/Models/CallFrame.js:
        (WI.CallFrame.prototype.get displayName): Added.
        * UserInterface/Views/CallFrameView.js:
        (WI.CallFrameView):
        * UserInterface/Views/CallFrameTreeElement.js:
        (WI.CallFrameTreeElement):
        * UserInterface/Views/ConsoleMessageView.js:
        (WI.ConsoleMessageView.prototype.toClipboardString):
        Add a helper `get displayName` to avoid repeated specialized logic.

2022-01-14  Devin Rousso  <drousso@apple.com>

        Web Inspector: add a contextmenu item to create a URL Breakpoint for resources initiated by script
        https://bugs.webkit.org/show_bug.cgi?id=235216

        Reviewed by Dean Jackson.

        * UserInterface/Views/ContextMenuUtilities.js:
        (WI.appendContextMenuItemsForSourceCode):
        Since URL Breakpoints only work with XHR/`fetch`, only offer to create a URL Breakpoint if
        the `WI.SourceCode` has `initiatorCallFrames`, meaning it was triggered by JS. We could
        offer this contextmenu item for _all_ resources, but there are many different resource types
        that are unlikely (if ever) to be loaded via XHR/`fetch` (e.g. favicons, manifests, fonts,
        initial JS/CSS files, etc.) that it would likely add clutter and possibly confuse developers
        into thinking that URL Breakpoints can somehow pause things other than JS. Plus, this can
        always be changed in a followup, so better to do something minimal first.

        * UserInterface/Controllers/DOMDebuggerManager.js:
        (WI.DOMDebuggerManager.prototype.urlBreakpointsMatchingURL): Added.
        Helper method to find all `WI.URLBreakpoint` that match a given URL, sorted by how exact
        they would match (e.g. a regex match is less exact than `===`).

        * Localizations/en.lproj/localizedStrings.js:

2022-01-13  Elliott Williams  <emw@apple.com>

        [XCBuild] Add "product dependencies" which influence workspace build order
        https://bugs.webkit.org/show_bug.cgi?id=235094

        Reviewed by Alexey Proskuryakov.

        * Configurations/Base.xcconfig: Add EXCLUDED_SOURCE_FILE_NAMES
        * WebInspectorUI.xcodeproj/project.pbxproj: Add Product Dependencies

2022-01-13  Patrick Angle  <pangle@apple.com>

        Web Inspector: Implement `frameURL` option for `devtools.inspectedWindow.eval` command
        https://bugs.webkit.org/show_bug.cgi?id=222568

        Reviewed by Devin Rousso.

        New test: Tools/TestWebKitAPI/Tests/WebKitCocoa/WKInspectorExtension.mm

        Add support for evaluating script from an extension in a specific frame on the page by referring to it by the
        frame's URL. Frame URLs are matched in three steps, first looking for an exact URL match, including query
        parameters and fragment identifier. If no match is found and the provided `options.frameURL` does not have any
        fragment identifier or query parameters, a check is then made against each known frame again, this time
        excluding their fragment identifier. If that check still fails to find a frame for the URL, we perform one more
        pass, this time excluding the fragment identifier and query parameters for each known frame.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.evaluateScriptForExtension):
        (WI.WebInspectorExtensionController.prototype.reloadForExtension):
        - Drive-by removal of trailing spaces.
        (WI.WebInspectorExtensionController.prototype._frameForFrameURL):

2022-01-12  Elliott Williams  <emw@apple.com>

        [Xcode] Configure each project for the legacy build system
        https://bugs.webkit.org/show_bug.cgi?id=235091

        Reviewed by Darin Adler.

        * WebInspectorUI.xcodeproj/project.pbxproj:

2022-01-12  Antoine Quint  <graouts@webkit.org>

        Update Web Inspector to not use legacy webkit-prefixed transition events
        https://bugs.webkit.org/show_bug.cgi?id=235119

        Reviewed by Joseph Pecoraro.

        Came across this while working on bug 235113, we shouldn't be using webkit-prefixed events.

        * UserInterface/Views/TabBar.js:
        (WI.TabBar.prototype.insertTabBarItem.animateTabs):
        (WI.TabBar.prototype.insertTabBarItem.removeStyles):
        (WI.TabBar.prototype.insertTabBarItem):
        (WI.TabBar.prototype.removeTabBarItem.animateTabs):
        (WI.TabBar.prototype.removeTabBarItem.removeStyles):
        (WI.TabBar.prototype.removeTabBarItem):
        (WI.TabBar.prototype._finishExpandingTabsAfterClose.):
        (WI.TabBar.prototype._finishExpandingTabsAfterClose):

2022-01-12  Antoine Quint  <graouts@webkit.org>

        Web Inspector should expose newer CSS Animations, CSS Transitions and Web Animations events
        https://bugs.webkit.org/show_bug.cgi?id=235117

        Reviewed by Joseph Pecoraro.

        Came across this while working on bug 235113, the more recent events added to
        CSS Animations, CSS Transitions and Web Animations are not used in the Web Inspector.

        * UserInterface/Models/ScriptTimelineRecord.js:
        (WI.ScriptTimelineRecord.EventType.displayName):

2022-01-12  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Unhandled exception when moving cursor mid-token after receiving CSS property name completions
        https://bugs.webkit.org/show_bug.cgi?id=234393
        <rdar://problem/86578732>

        Reviewed by Patrick Angle.

        A faulty check for mid-token completions in `WI.CSSKeywordCompletions.forPartialPropertyName()`, which are still
        unsupported, prevented an early return and completions were provided unexpectedly. This had knock-on effects in
        `WI.SpreadsheetTextField` which is not set up to handle cases where the caret is placed within the completion query.
        Calculating the adjusted caret position could return a negative index and throw an unhandled exception.

        Web Inspector does not currently explicitly support mid-token completions. See https://webkit.org/b/227157

        The implementation of fuzzy matching for CSS completions in https://webkit.org/b/234092
        means that, unhindered, the completion provider for CSS property names _can_ return mid-token completions.
        Typing a query like `margin`, then moving the caret to the beginning and correcting to `s|margin` will return
        completions like `[s]croll-[margin]`. Accepting the completion results in a malformed `SpreadsheetTextField.value`
        by concatenation within the prefix itself. As the user types mid-token, the prefix becomes ambiguous.

        Fixing the condition in `WI.CSSKeywordCompletions.forPartialPropertyName()` now inhibits unintentional
        mid-token completions when fuzzy matching is enabled.

        * UserInterface/Models/CSSKeywordCompletions.js:
        (WI.CSSKeywordCompletions.forPartialPropertyName):
        * UserInterface/Views/SpreadsheetTextField.js:
        (WI.SpreadsheetTextField.prototype._showSuggestionsView):

2022-01-11  Nikita Vasilyev  <nvasilyev@apple.com>

        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.

        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.

2022-01-10  Nikita Vasilyev  <nvasilyev@apple.com>

        Web Inspector: Increase padding around icons in Alignment editor
        https://bugs.webkit.org/show_bug.cgi?id=234036
        <rdar://problem/86543279>

        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  <achristensen@webkit.org>

        Start using C++20
        https://bugs.webkit.org/show_bug.cgi?id=233963

        Reviewed by Yusuke Suzuki.

        * Configurations/Base.xcconfig:

2022-01-07  Alexey Shvayka  <ashvayka@apple.com>

        Remove obsolete DOM Level 2 "DOMFocusIn" / "DOMFocusOut" events
        https://bugs.webkit.org/show_bug.cgi?id=234978

        Reviewed by Geoff Garen.

        * UserInterface/Models/ScriptTimelineRecord.js:
        (WI.ScriptTimelineRecord.EventType.displayName):

2022-01-07  Patrick Angle  <pangle@apple.com>

        Uncaught Exception: Cannot step over because debugger is not paused
        https://bugs.webkit.org/show_bug.cgi?id=234575

        Reviewed by Devin Rousso.

        Previously keyboard shortcuts for advancing the debugger did not check to make sure that the debugger was
        actually paused before attempting to step. This led to an uncaught exception in engineering builds. We now
        enable and disable these keyboard shortcuts based on the whether or not the debugger is currently paused.

        * UserInterface/Base/Main.js:

2022-01-07  Alex Christensen  <achristensen@webkit.org>

        Unreviewed, reverting r287698.

        Broke an internal build

        Reverted changeset:

        "Start using C++20"
        https://bugs.webkit.org/show_bug.cgi?id=233963
        https://commits.webkit.org/r287698

2022-01-06  Tim Nguyen  <ntim@apple.com>

        Unprefix -webkit-print-color-adjust CSS property
        https://bugs.webkit.org/show_bug.cgi?id=201098

        Reviewed by Darin Adler.

        color-adjust is also a deprecated shorthand that just contains print-color-adjust.

        * UserInterface/Models/CSSKeywordCompletions.js:

2022-01-06  Alex Christensen  <achristensen@webkit.org>

        Start using C++20
        https://bugs.webkit.org/show_bug.cgi?id=233963

        Reviewed by Yusuke Suzuki.

        * Configurations/Base.xcconfig:

2022-01-06  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: `shape-outside` description doesn't make sense
        https://bugs.webkit.org/show_bug.cgi?id=234675
        <rdar://problem/87036546>

        Reviewed by Devin Rousso.

        Add the ability to overwrite CSS documentation obtained from the upstream data source
        with information sourced from a local JSON file.

        * Scripts/update-inspector-css-documentation:
        * UserInterface/External/CSSDocumentation/CSSDocumentation-overrides.json: Added.
        Local JSON file with fields to overwrite specific data.

        * UserInterface/External/CSSDocumentation/CSSDocumentation.js:
        Update description for `shape-outside` CSS property.

2022-01-05  Devin Rousso  <drousso@apple.com>

        Web Inspector: Layers: add reference page button
        https://bugs.webkit.org/show_bug.cgi?id=234901

        Reviewed by Patrick Angle.

        * UserInterface/Views/Layers3DContentView.js:
        (WI.Layers3DContentView.prototype.initialLayout):
        * UserInterface/Views/Layers3DContentView.css:
        (.content-view.layers-3d .reference-page-link-container): Added.

2022-01-05  Devin Rousso  <drousso@apple.com>

        Web Inspector: Audit: reference page button is not vertically aligned with Audit version text
        https://bugs.webkit.org/show_bug.cgi?id=234900

        Reviewed by Patrick Angle.

        * UserInterface/Views/AuditNavigationSidebarPanel.css:
        (.content-view.tab.audit .content-view .reference-page-link-container):

2022-01-05  Patrick Angle  <pangle@apple.com>

        Web Inspector: revert-layer should be autocompleted
        https://bugs.webkit.org/show_bug.cgi?id=234646

        Reviewed by Devin Rousso.

        * UserInterface/Controllers/CSSManager.js:
        * UserInterface/Models/CSSKeywordCompletions.js:

2022-01-04  Devin Rousso  <drousso@apple.com>

        Web Inspector: Sources: expanding a grouping of blackboxed call frames should be persistent
        https://bugs.webkit.org/show_bug.cgi?id=234614
        <rdar://problem/86989232>

        Reviewed by Patrick Angle.

        If the developer has explicitly decided to show blackboxed call frames, we should respect
        that decision. Requiring them to re-expand after _every_ debugger action is very hostile.
        So long as the blackboxed call frames remain the same we should persist the expansion. Only
        if the location of those blackboxed frames changes should we re-collapse.

        * UserInterface/Controllers/DebuggerManager.js:
        (WI.DebuggerManager):
        (WI.DebuggerManager.prototype.rememberBlackboxedCallFrameGroupToAutoExpand): Added.
        (WI.DebuggerManager.prototype.shouldAutoExpandBlackboxedCallFrameGroup): Added.
        (WI.DebuggerManager.prototype._didResumeInternal):
        * UserInterface/Views/BlackboxedGroupTreeElement.js:
        (WI.BlackboxedGroupTreeElement.prototype.expand):
        Keep a list of blackboxed call frame groupings that have been expanded by the developer.
        Use this list to decide whether "new" blackboxed call frame grouping should be auto-expanded
        by default (i.e. if every `WI.CallFrame` is identical with something in the list). Clear the
        list when resuming, as we're only trying to keep expanded blackboxed call frame groupings
        within the same call stack (i.e. while stepping).

        * UserInterface/Base/Utilities.js:
        (Array.prototype.groupBy): Deleted.
        * UserInterface/Views/ThreadTreeElement.js:
        (WI.ThreadTreeElement.prototype.refresh):
        Remove the custom `Array.prototype.groupBy` since it's no longer needed (and there's now a
        builtin function with the same name). Instead, just keep an index of the first blackboxed
        call frame and iterate until either the end of the call stack or a non-blackboxed call frame
        is found, `slice`ing from the saved index to the current item to make a blackboxed call
        frame group. If that blackboxed call frame group should be auto-expanded (see above), create
        a `WI.CallFrameTreeElement` for each blackboxed call frame instead of one `WI.BlackboxedGroupTreeElement`.

        * UserInterface/Models/CallFrame.js:
        (WI.CallFrame.prototype.isEqual): Added.
        Add a convenience function to compare two `WI.CallFrame`. Right now it just looks at the
        `WI.SourceCodeLocation`, since for most purposes that's really how one would identify a
        `WI.CallFrame` (i.e. it's probably more important to know "is this the same spot in code"
        as opposed to "do we have the same `this` object").

2022-01-04  Devin Rousso  <drousso@apple.com>

        Web Inspector: Add icon for collapsed blackboxed section
        https://bugs.webkit.org/show_bug.cgi?id=219806
        <rdar://problem/72240360>

        Reviewed by Patrick Angle.

        * UserInterface/Views/BlackboxedGroupTreeElement.css:
        (.tree-outline .item.blackboxed-group .icon):
        (@media (prefers-color-scheme: dark) .tree-outline .item.blackboxed-group .icon):
        Use `Hide.svg#black` and `Hide.svg#white`.

        * UserInterface/Images/TypeIcons.svg:
        Remove `#Blackboxed-dark` and `#Blackboxed-light`.

2021-12-31  Tim Nguyen  <ntim@apple.com>

        Web Inspector: fix assert text in Gradient.js

        Unreviewed.

        Wrong assert text was added in r287409, it should be radial instead of conic gradients.

        * UserInterface/Models/Gradient.js:
        (WI.RadialGradient.prototype.set angleValue):
        (WI.RadialGradient.prototype.set angleUnits):

2021-12-24  Tim Nguyen  <ntim@apple.com>

        Remove non-standard -webkit-background-composite CSS property
        https://bugs.webkit.org/show_bug.cgi?id=234661

        Reviewed by Simon Fraser.

        * UserInterface/Models/CSSKeywordCompletions.js:

2021-12-24  Tim Nguyen  <ntim@apple.com>

        Remove non-standard -webkit-margin-collapse CSS property and longhands
        https://bugs.webkit.org/show_bug.cgi?id=190788

        Reviewed by Simon Fraser.

        * UserInterface/Models/CSSKeywordCompletions.js:

2021-12-23  Tim Nguyen  <ntim@apple.com>

        Web Inspector: Support conic gradients in gradient editor and autocompletion
        https://bugs.webkit.org/show_bug.cgi?id=234562

        Reviewed by Devin Rousso.

        * Localizations/en.lproj/localizedStrings.js:
        * UserInterface/Controllers/CSSManager.js:
        * UserInterface/Models/Gradient.js:
        (WI.Gradient.angleFromString):
        (WI.Gradient.fromString):
        (WI.Gradient.prototype.get angleValue):
        (WI.Gradient.prototype.set angleValue):
        (WI.Gradient.prototype.get angleUnits):
        (WI.Gradient.prototype.set angleUnits):
        (WI.Gradient.prototype._angleValueForUnits):
        (WI.Gradient):
        (WI.LinearGradient.fromComponents):
        (WI.LinearGradient.prototype.toString):
        (WI.LinearGradient):
        (WI.RadialGradient):
        (WI.RadialGradient.fromComponents):
        (WI.RadialGradient.prototype.get angleValue):
        (WI.RadialGradient.prototype.set angleValue):
        (WI.RadialGradient.prototype.get angleUnits):
        (WI.RadialGradient.prototype.set angleUnits):
        (WI.RadialGradient.prototype.copy):
        (WI.RadialGradient.prototype.toString):
        (WI.ConicGradient):
        (WI.ConicGradient.fromComponents):
        (WI.ConicGradient.prototype.copy):
        (WI.ConicGradient.prototype.toString):
        (WI.LinearGradient.prototype.set angleValue): Deleted.
        (WI.LinearGradient.prototype.get angleValue): Deleted.
        (WI.LinearGradient.prototype.set angleUnits): Deleted.
        (WI.LinearGradient.prototype.get angleUnits): Deleted.
        (WI.LinearGradient.prototype._angleValueForUnits): Deleted.
        * UserInterface/Views/CodeMirrorTextMarkers.js:
        * UserInterface/Views/GradientEditor.js:
        (WI.GradientEditor):
        (WI.GradientEditor.prototype.set gradient):
        (WI.GradientEditor.prototype._gradientTypeChanged):
        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype._addGradientTokens):

2021-12-23  Tim Nguyen  <ntim@apple.com>

        Web Inspector: Dark mode: Make gradient editor angle input readable in dark mode
        https://bugs.webkit.org/show_bug.cgi?id=234640

        Reviewed by Devin Rousso.

        Just use the native input styling, which is dark mode compatible by default.

        * UserInterface/Views/GradientEditor.css:
        (.gradient-editor > .gradient-angle > input[type="number"]):

2021-12-21  Patrick Angle  <pangle@apple.com>

        Web Inspector: Assertion Failed removing subview in ContentViewContainer.prototype._disassociateFromContentView
        https://bugs.webkit.org/show_bug.cgi?id=234572

        Reviewed by Devin Rousso.

        r283859 accidentally removed the checks that a content view is attached before attempting to remove it, leading
        to an assertion.

        * UserInterface/Views/ContentViewContainer.js:
        (WI.ContentViewContainer.prototype._disassociateFromContentView):

2021-12-21  Patrick Angle  <pangle@apple.com>

        Web Inspector: Assertion Failed adding event listener in CSSPropertyNameCompletions.prototype._updateValuesWithLatestCSSVariablesIfNeeded
        https://bugs.webkit.org/show_bug.cgi?id=234570

        Reviewed by Devin Rousso.

        Adding an event listener to listen for style changes every time we update the list of CSS variables isn't quite
        correct because it means we may attempt to add the event listener multiple times. Instead, this should be done
        in response to the InspectedNodeChanged event directly to avoid adding the event listener multiple time to the
        same DOM node.

        * UserInterface/Models/CSSPropertyNameCompletions.js:
        (WI.CSSPropertyNameCompletions.prototype._updateValuesWithLatestCSSVariablesIfNeeded):
        (WI.CSSPropertyNameCompletions.prototype._handleInspectedNodeChanged):

2021-12-21  Michael Saboff  <msaboff@apple.com>

        Fix symlinks for alternate root framework locations
        https://bugs.webkit.org/show_bug.cgi?id=234567

        Reviewed by Filip Pizlo.

        Moved OUTPUT_ALTERNATE_ROOT_PATH in create symlink script from outputFileListPaths to outputPaths.

        * WebInspectorUI.xcodeproj/project.pbxproj:

2021-12-16  Michael Saboff  <msaboff@apple.com>

        https://bugs.webkit.org/show_bug.cgi?id=234173
        Update Install Paths for build system changes

        Reviewed by Filip Pizlo.

        Added build variables and build step to create symlinks pointing to the alternate
        build locations from the current framework install location.

        * Configurations/WebInspectorUIFramework.xcconfig:
        * Scripts/create-symlink-to-altroot.sh: Added.
        * WebInspectorUI.xcodeproj/project.pbxproj:

2021-12-16  Devin Rousso  <drousso@apple.com>

        Implement Array.prototype.groupBy and Array.prototype.groupByToMap
        https://bugs.webkit.org/show_bug.cgi?id=234327

        Reviewed by Yusuke Suzuki.

        * UserInterface/Models/NativeFunctionParameters.js:

2021-12-14  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Computed Panel: Adjust color of CSS Variables grouping mode control
        https://bugs.webkit.org/show_bug.cgi?id=234246
        <rdar://problem/86414682>

        Reviewed by Devin Rousso.

        Change color of CSS variables grouping mode scope bar from the system accent color to transparent
        so it doesn't draw disproportionate attention to itself.

        * UserInterface/Views/ComputedStyleDetailsPanel.css:
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-variables .scope-bar.computed-style-variables-grouping-mode:not(:hover)):
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-variables .scope-bar.computed-style-variables-grouping-mode.default-item-selected:not(:hover)): Deleted.
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-variables .scope-bar.computed-style-variables-grouping-mode.default-item-selected:hover): Deleted.

2021-12-13  Devin Rousso  <drousso@apple.com>

        Web Inspector: remove coloring of Web Inspector area in dock icons
        https://bugs.webkit.org/show_bug.cgi?id=234262

        Reviewed by Patrick Angle.

        It looks too strong/bold and draws way too much attention. It also doesn't match the styling
        of other nearby icons.

        * UserInterface/Images/DockBottom.svg:
        * UserInterface/Images/DockLeft.svg:
        * UserInterface/Images/DockRight.svg:

2021-12-13  Elliott Williams  <emw@apple.com>

        Deployment target for macOS 11+ does not follow minor version bumps
        https://bugs.webkit.org/show_bug.cgi?id=233906

        Reviewed by Alexey Proskuryakov.

        * Configurations/DebugRelease.xcconfig:

2021-12-10  Michael Saboff  <msaboff@apple.com>

        https://bugs.webkit.org/show_bug.cgi?id=234173
        Update Install Paths for build system changes

        Reviewed by Yusuke Suzuki.

        Updated install paths for changes in the build system that use a system path prefix.

        * Configurations/WebInspectorUIFramework.xcconfig:

2021-12-10  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Add CSS variable names to property name completion list
        https://bugs.webkit.org/show_bug.cgi?id=233372
        <rdar://83205968>

        Reviewed by Devin Rousso.

        Add the list of applicable CSS variables to the list of CSS property name completions.

        `WI.CSSPropertyNameCompletions` is a long-lived object that holds all supported property names.
        It doesn't need to change over time in a Web Inspector session. But the list of applicable
        CSS variables depends on the selected node.

        To avoid thrashing the long list of values in `WI.CSSPropertyNameCompletions` we don't proactively collect
        CSS variables. Instead, we introduce a flag to indicate that the list of CSS variables may
        be stale whenever the inspected node changes. Only when completions are requested do we check
        this flag and augment the list of CSS property names with the latest list of CSS variables.

        * UserInterface/Models/CSSCompletions.js:
        (WI.CSSCompletions.prototype.replaceValues):
        Allow a sub-class to replace the list of values in one go.
        If a `WI.CSSQueryController` was used, reset it and provide it the new list of values.

        * UserInterface/Models/CSSPropertyNameCompletions.js:
        (WI.CSSPropertyNameCompletions):
        (WI.CSSPropertyNameCompletions.prototype.executeQuery):
        (WI.CSSPropertyNameCompletions.prototype.startsWith):
        (WI.CSSPropertyNameCompletions.prototype._updateValuesWithLatestCSSVariablesIfNeeded):
        Holding a copy of the original list of CSS property names in order to create a new list
        agumented with variables on demand.

        (WI.CSSPropertyNameCompletions.prototype.addValues):
        Warn when trying to add new property values which would overwrite the cached and sorted list of CSS property names.

        (WI.CSSPropertyNameCompletions.prototype._handleInspectedNodeChanged):
        Consider changing of the inspected node as an indicator that the list of variables is stale.
        That may not necessarily be true for web pages with all CSS variables declared on :root or <html>,
        but iterating over them to verify is needlessly expensive especially if completions were not even requested.

        (WI.CSSPropertyNameCompletions.prototype._handleNodesStylesNeedsRefresh):
        Consider any change to the styles of the inspected node as a potential change to the list of applicable variables.

        (WI.CSSPropertyNameCompletions):

2021-12-10  BJ Burg  <bburg@apple.com>

        Web Inspector: save and restore extension tab positions
        https://bugs.webkit.org/show_bug.cgi?id=234115
        <rdar://85560636>

        Reviewed by Devin Rousso and Patrick Angle.

        The existing tab state restoration system works by saving or loading tab positions
        from persistent storage and saving or restoring each tab's state using one cookie per tab type.

        With extension tabs, it is now possible to have more than one tab per tab type.
        Additionally, extension tabs can be added at any time via InspectorFrontendAPI.
        Given these challenges, we need a different system for saving and restoring extension tabs.

        Extension tab restoration is now handled by WI.WebInspectorExtensionController.
        We consider a tab to be an 'anchor' tab if it is saveable, visible, and not pinnable.
        In other words, an anchor tab is one of the built-in singleton tabs like Console, Elements, etc.

        When the tab bar item list is modified, for each extension tab, we save the observed
        'anchor' tab's type and a distance from that anchor tab's insertion index.
        Updates to extension tab positions are saved to persistent storage at most every 5 seconds.

        When it is time to place an extension tab with createTabForExtension() or showExtensionTab(),
        perform the reverse operation of computing an insertion index from a anchorTabType and distanceFromAnchorTab.

        This patch was tested with one extension, multiple extensions, showing/hiding extension tabs,
        remote inspecting a JSContext, and remote inspecting a WKWebView.

        * UserInterface/Views/TabBar.js:
        (WI.TabBar.prototype.get visibleTabBarItemsFromLeftToRight): Added.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController):
        (WI.WebInspectorExtensionController.get extensionTabPositionsObjectStoreKey): Added.

        (WI.WebInspectorExtensionController.prototype.registerExtension):
        (WI.WebInspectorExtensionController.prototype.unregisterExtension):
        Add and remove WI.TabBar event listeners that notify us of changes to the tab bar.

        (WI.WebInspectorExtensionController.prototype.createTabForExtension): Deleted.
        (WI.WebInspectorExtensionController.prototype.async createTabForExtension): Renamed.
        Load saved tab positions from persistent storage if needed. Compute the insertion index for the new tab.
        This method is already expected to return a promise, so make it `async` to allow using `await`.

        (WI.WebInspectorExtensionController.prototype.showExtensionTab):
        Compute the insertion index for the new tab.

        (WI.WebInspectorExtensionController.prototype.async _loadExtensionTabPositions):
        Load saved tab positions from persistent storage, allowing for the case where nothing has been saved yet.

        (WI.WebInspectorExtensionController.prototype.async _saveExtensionTabPositions):
        Recompute and save tab positions for all extension tabs. Then write to persistent storage
        at most every 5 seconds using a WI.Debouncer.

        (WI.WebInspectorExtensionController.prototype._insertionIndexForExtensionTab): Added, wrapper method.
        (WI.WebInspectorExtensionController.prototype._computeIndicesForExtensionTab):
        Compute the anchorTabType, distanceFromAnchorTab, and insertionIndex for the extension tab.
        If saving tab positions, pass `options.recomputePositions` to ignore saved positions
        and recompute these fields based on what is currently visible in the tab bar.

        * UserInterface/Views/WebInspectorExtensionTabContentView.js:
        (WI.WebInspectorExtensionTabContentView.prototype.get savedTabPositionKey): Added.

2021-12-10  Nikita Vasilyev  <nvasilyev@apple.com>

        Web Inspector: Add a swatch for justify-content, justify-items, and justify-self
        https://bugs.webkit.org/show_bug.cgi?id=233055
        <rdar://problem/85613257>

        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  <rcaliman@apple.com>

        Web Inspector: Computed Panel: Group CSS variables by value type
        https://bugs.webkit.org/show_bug.cgi?id=233563
        <rdar://82978905>

        Reviewed by Devin Rousso and Patrick Angle.

        Add the ability to view CSS variables in the Computed styles details sidebar panel
        groupped by value type in a few sections: "colors", "dimensions", "numbers" and a
        catch-all group of "other".

        * Localizations/en.lproj/localizedStrings.js:
        * UserInterface/Models/DOMNodeStyles.js:
        (WI.DOMNodeStyles):
        (WI.DOMNodeStyles.prototype.variableStylesByType):
        Iterate on-demand over all CSS variables found in the node's computed styles
        and assign each to a group depending on its value type:
        - color
        - dimension (number followed by a CSS unit-like string)
        - number
        - other

        Additional groups and refinements will come in follow-up patches.

        (WI.DOMNodeStyles.prototype.refresh.fetchedComputedStyle):
        The map of CSS variable groups gets invalidated when there's a significant
        change in the node's computed style. This supports the use case where previously
        empty groups become populated or, conversely, become empty.

        * UserInterface/Views/ComputedStyleDetailsPanel.js:
        (WI.ComputedStyleDetailsPanel):
        (WI.ComputedStyleDetailsPanel.prototype.refresh):
        (WI.ComputedStyleDetailsPanel.prototype.applyFilter):
        (WI.ComputedStyleDetailsPanel.prototype.initialLayout):
        No longer generate the elements for laying out CSS variables during `initialLayout()`
        but handle them during `layout()`. This support mutating the DOM for laying out
        either one top-level list of CSS variables (ungrouped) or multiple lists of CSS variable
        groups depeding on the grouping mode selected at runtime.

        * UserInterface/Views/ComputedStyleDetailsPanel.css:
        (.sidebar > .panel.details.css-style > .content > .computed .details-section > .content):
        Ensure both top-level and nested details sections overwrite styles. CSS variables groups are in nested details sections.

        (.sidebar > .panel.details.css-style > .content > .computed .details-section.computed-style-variables .computed-property-item):
        Adapt stylesheet to account for using `WI.ComputedStyleSection` instead of `WI.SpreadsheetCSSStyleDeclarationEditor`

        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-variables .scope-bar.computed-style-variables-grouping-mode):
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-variables .scope-bar.computed-style-variables-grouping-mode.default-item-selected:not(:hover)):
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-variables .scope-bar.computed-style-variables-grouping-mode.default-item-selected:hover):
        Reuse the visual treatment from SourcesNavigationSidebarPanel.css to avoid highlighting the default grouping mode scope bar item.

        (.sidebar > .panel.details.css-style > .content > .computed > .details-section > .content): Deleted.
        (.sidebar > .panel.details.css-style > .content > .computed .property): Deleted.

        (WI.ComputedStyleDetailsPanel.prototype.layout):
        Skip destroying and rebuilding sections whose data sources change during
        `WI.ComputedStyleDetailsPanel.refresh()` and which handle layout internally.
        We need to remove and rebuild just the sections for CSS variables because
        layout is requested in response to changing the CSS variables grouping mode.

        (WI.ComputedStyleDetailsPanel.prototype._createVariablesStyleSection):
        Replaces the use of `WI.SpreadsheetCSSStyleDeclarationEditor` for rendering CSS variables with
        `WI.ComputedStyleSection` which is already used for rendering CSS properties.
        It's a lighter-weight View that's fit for purpose.

        (WI.ComputedStyleDetailsPanel.prototype._renderVariablesStyleSectionGroup):
        Use a generic renderer for CSS variable sections that can be reused for any group type.

        (WI.ComputedStyleDetailsPanel.prototype._handleDetailsSectionCollapsedStateChanged):
        Generalize handling collapsed state change events for all sections, current and future.

        (WI.ComputedStyleDetailsPanel.prototype._handleEditorFilterApplied):
        Generalize handling filtering events for all sections, current and future.

        (WI.ComputedStyleDetailsPanel.prototype._handleVariablesGroupingModeScopeBarSelectionChanged):
        (WI.ComputedStyleDetailsPanel.prototype._handleVariablesGroupingSettingChanged):
        (WI.ComputedStyleDetailsPanel.prototype._handlePropertiesSectionCollapsedStateChanged): Deleted.
        (WI.ComputedStyleDetailsPanel.prototype._handleVariablesSectionCollapsedStateChanged): Deleted.
        * UserInterface/Views/ComputedStyleSection.js:
        (WI.ComputedStyleSection):
        Change the default value of `_styleTraces` to null instead of an empty array so that
        `WI.ComputedStyleSection.layout()` doesn't attempt to access it like a `Map`.

2021-12-10  Nikita Vasilyev  <nvasilyev@apple.com>

        Web Inspector: Add a swatch for align-items and align-self
        https://bugs.webkit.org/show_bug.cgi?id=233054
        <rdar://problem/85613199>

        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):

2021-12-10  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Extract a specialized CSSNameCompletions from CSSCompletions
        https://bugs.webkit.org/show_bug.cgi?id=233369
        <rdar://83206520>

        Reviewed by Devin Rousso.

        `WI.CSSPropertyNameCompletions` is a long-lived object that holds the list of all CSS properties
        supported by the target. It is instantiated only once on Web Inspector startup.

        By contrast, `WI.CSSCompletions` is an object instantiated as often as needed with
        lists of property values, CSS function values, etc. It holds the generic logic for
        matching values against a given query.

        The specialized logic for CSS property names was mixed-in with the generic logic in `WI.CSSCompletions`.
        The main difference is in the format of the payload provided:
        - an array of objects with key/value pairs for `WI.CSSPropertyNameCompletions`.
        - an array of strings for general purpose `WI.CSSCompletions`.

        This patch reduces the complexity in `WI.Completions`:
        - moves the one-time initialization method to `WI.cssManager.initializeCSSCompletions`.
        - simplifies `WI.Completions` constructor to expect just an array of strings.
        - introduces `WI.CSSPropertyNameCompletions` as a sub-class of `WI.CSSCompletions` where its constructor
          is specialized to handle the payload received from the backend.
        - moves the `WI.CSSPropertyNameCompletions` instance to `WI.cssManager.cssPropertyNameCompletions`.
        - removes unused accessors for navigating the list of matched completions.

        * UserInterface/Base/Main.js:
        (WI.performOneTimeFrontendInitializationsUsingTarget):
        * UserInterface/Controllers/CSSManager.js:
        (WI.CSSManager):
        (WI.CSSManager.prototype.initializeCSSPropertyNameCompletions.):
        (WI.CSSManager.prototype.initializeCSSPropertyNameCompletions):
        Moved the initializiation method for objects used to get CSS completions
        from `WI.CSSCompletions` with data from the backed to a more appropriate place.

        (WI.CSSManager.prototype.get propertyNameCompletions):
        * UserInterface/Controllers/CodeMirrorCompletionController.js:
        (WI.CodeMirrorCompletionController.prototype._generateCSSCompletions):
        * UserInterface/Main.html:
        * UserInterface/Models/CSSCompletions.js:
        (WI.CSSCompletions.prototype._firstIndexOfPrefix):
        (WI.CSSCompletions):
        (WI.CSSCompletions.initializeCSSCompletions.): Deleted.
        (WI.CSSCompletions.initializeCSSCompletions.collectPropertyNameForCodeMirror): Deleted.
        (WI.CSSCompletions.initializeCSSCompletions.propertiesCallback): Deleted.
        (WI.CSSCompletions.initializeCSSCompletions.fontFamilyNamesCallback): Deleted.
        (WI.CSSCompletions.initializeCSSCompletions): Deleted.
        Moved to `WI.CSSManager`.

        (WI.CSSCompletions.prototype.next): Deleted.
        (WI.CSSCompletions.prototype.previous): Deleted.
        (WI.CSSCompletions.prototype._closest): Deleted.
        Removed unused methods for navigating the completions list.
        This behavior is encapsulated in `WI.CompletionSuggestionsView`.

        (WI.CSSCompletions.prototype.isValidPropertyName): Deleted.
        Moved to `WI.CSSPropertyNameCompletions`.

        * UserInterface/Models/CSSKeywordCompletions.js:
        (WI.CSSKeywordCompletions.forPartialPropertyName):
        * UserInterface/Models/CSSPropertyNameCompletions.js: Added.
        (WI.CSSPropertyNameCompletions.prototype.isValidPropertyName):
        (WI.CSSPropertyNameCompletions):
        * UserInterface/Test.html:
        * UserInterface/Test/Test.js:
        (WI.performOneTimeFrontendInitializationsUsingTarget):
        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype.updateStatus):
        (WI.SpreadsheetStyleProperty.prototype._addCSSDocumentationButton):

2021-12-09  Brent Fulgham  <bfulgham@apple.com>

        Unprefix CSS value text-align: -webkit-match-parent
        https://bugs.webkit.org/show_bug.cgi?id=229496
        <rdar://problem/82628618>

        Reviewed by Darin Adler.

        * UserInterface/Models/CSSKeywordCompletions.js: Add 'match-parent'

2021-12-08  BJ Burg  <bburg@apple.com>

        [Cocoa] Web Inspector: provide a way for _WKInspectorExtension clients to be to notified when an extension tab navigates
        https://bugs.webkit.org/show_bug.cgi?id=233935
        <rdar://86123899>

        Reviewed by Patrick Angle.

        In order instrument all loads inside the extension iframe, we cannot rely on the <iframe src> attribute
        to query the currently loaded page, or to change the current page. Use a helper method to query and set
        the iframe location indirectly using `document.location`.

        * UserInterface/Protocol/InspectorFrontendAPI.js:

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.createTabForExtension):
        (WI.WebInspectorExtensionController.prototype.showExtensionTab):
        Standardize on returning {"result": value} from these methods.

        * UserInterface/Views/WebInspectorExtensionTabContentView.js:
        (WI.WebInspectorExtensionTabContentView):
        (WI.WebInspectorExtensionTabContentView.prototype.whenPageAvailable): Added.
        (WI.WebInspectorExtensionTabContentView.prototype._extensionFrameDidLoad):
        Trigger a load of the actual requested page by evaluating `document.location.href = <url>`
        in the context of the extension tab iframe. Notify clients when this non-initial load completes.

        (WI.WebInspectorExtensionTabContentView.prototype.async _maybeDispatchDidNavigateExtensionTab):
        Dispatch didNavigateExtensionTab with the new URL when the extension tab iframe completes a load.
        Don't notify the client if the extension tab has not yet loaded.

2021-12-09  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Enable fuzzy matching for CSS completions
        https://bugs.webkit.org/show_bug.cgi?id=234092

        Reviewed by Patrick Angle.

        Flip the flag to enable fuzzy matching when autocompleting CSS properties and values.

        * UserInterface/Base/Setting.js:

2021-12-07  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Support fuzzy matching in CSS completions
        https://bugs.webkit.org/show_bug.cgi?id=230351
        <rdar://82976292>

        Reviewed by Devin Rousso.

        Use fuzzy matching for identifying CSS completions in the Styles details sidebar.

        There are three main parts to this patch:
        1. Introduce `WI.CSSQueryController` with logic to do fuzzy matching on provided values.
        2. Change `WI.CompletionSuggestionsView` to support both plain strings and `WI.QueryResult`s.
        3. Change `WI.SpreadsheetTextField` so its `value` doesn't always return its `element.textContent`.

        With fuzzy matching, completions are not guaranteed anymore to be prefixed with the query.
        Therefore, it's no longer viable to rely on `WI.SpreadsheetTextField.value` being a concatenation of `textContent` of nodes within. 

        To adress this, there's now `WI.SpreadsheetTextField._pendingValue` which includes the prospective
        completion regardless of whether the query is a completion prefix or at match at any other position.

        * Localizations/en.lproj/localizedStrings.js:
        * UserInterface/Base/Setting.js:
        Add a flag to enable the fuzzy matching feature.

        * UserInterface/Controllers/CSSQueryController.js: Added.
        (WI.CSSQueryController):
        (WI.CSSQueryController.prototype.addValues):
        (WI.CSSQueryController.prototype.reset):
        (WI.CSSQueryController.prototype.executeQuery):
        (WI.CSSQueryController.prototype._findSpecialCharacterIndices):
        Add a speclialized class to hold the logic for fuzzy matching of CSS properties and values.
        It clones logic from `WI.ResouceQueryController` with adjustments specific to CSS; more to follow as the feature gets refined.

        * UserInterface/Main.html:
        * UserInterface/Models/CSSCompletions.js:
        (WI.CSSCompletions):
        (WI.CSSCompletions.prototype.addValues):
        (WI.CSSCompletions.prototype.executeQuery):
        Support both the current prefix matching approach as well as fuzzy matching.

        * UserInterface/Models/CSSKeywordCompletions.js:
        (WI.CSSKeywordCompletions.forPartialPropertyName):
        Opt into fuzzy matching when getting completions for property names and values. 

        * UserInterface/Models/QueryResult.js:
        (WI.QueryResult.prototype.get matches):
        * UserInterface/Test.html:

        * UserInterface/Views/CompletionSuggestionsView.css:
        (.completion-suggestions-container > .item > .highlighted):
        Highlight specific characters that matched in result identified by fuzzy matching.

        * UserInterface/Views/CompletionSuggestionsView.js:
        (WI.CompletionSuggestionsView.prototype.selectNext):
        (WI.CompletionSuggestionsView.prototype.selectPrevious):
        (WI.CompletionSuggestionsView.prototype.update):
        (WI.CompletionSuggestionsView.prototype.getCompletionText):
        (WI.CompletionSuggestionsView.prototype._createHighlightedCompletionFragment):
        Change `WI.CompletionSuggestionsView` to hold a list of completions, 
        either strings or `WI.QueryResult`, and return the appropriate completion text
        instead of returning the `textContent` of the selected element.

        `WI.CompletionSuggestionsView` is used elsewhere in the Console and Sources panel
        so avoid impacting those consumers until they opt in to fuzzy matching as well.

        * UserInterface/Views/SettingsTabContentView.js:

        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype._handleNameChange):
        (WI.SpreadsheetStyleProperty.prototype._handleValueChange):
        (WI.SpreadsheetStyleProperty.prototype._nameCompletionDataProvider):
        (WI.SpreadsheetStyleProperty.prototype._valueCompletionDataProvider):
        On change, get the value of the `WI.SpreadsheetTextField` instead of 
        the corresponding element's `textContent`.

        * UserInterface/Views/SpreadsheetTextField.js:
        Introduced `SpreadsheetTextField._completionPrefix` to hold the query a user is typing.

        Introduced `SpreadsheetTextField._completionText` to hold the completion text of the selected but
        not yet applied completion. This replaces the previous behavior of concatenating the query and `suggestionHint`
        because with fuzzy matching the completion isn't guaranteed to be prefixed with the query.

        Introduced `SpreadsheetTextField._pendingValue` to hold the result of applying the selected
        completion. This replaces the previous behavior of `WI.SpreadsheetTextField._combineEditorElementChildren`.

        (WI.SpreadsheetTextField):
        (WI.SpreadsheetTextField.prototype.get value):
        Change `WI.SpreadsheetTextField` so its value is divorced from its element's `textContent`.
        While editing, `WI.SpreadsheetTextField.value` returns the pending value so that
        a valid CSS string gets written to the stylesheet.

        (WI.SpreadsheetTextField.prototype.set suggestionHint):
        If the query is a prefix for the selected completion, keep the existing behavior of appending
        the suggestion hint substring. Otherwise, hide the suggestion hint element because the
        concatenation doesn't make sense.

        (WI.SpreadsheetTextField.prototype.stopEditing):
        (WI.SpreadsheetTextField.prototype.discardCompletion):
        (WI.SpreadsheetTextField.prototype.completionSuggestionsSelectedCompletion):
        (WI.SpreadsheetTextField.prototype.completionSuggestionsClickedCompletion):
        (WI.SpreadsheetTextField.prototype._discardChange):
        (WI.SpreadsheetTextField.prototype._handleBlur):
        (WI.SpreadsheetTextField.prototype._handleKeyDown):
        (WI.SpreadsheetTextField.prototype._handleKeyDownForSuggestionView):
        (WI.SpreadsheetTextField.prototype._handleInput):
        (WI.SpreadsheetTextField.prototype._updateCompletions):
        (WI.SpreadsheetTextField.prototype._applyPendingValue):
        After applying a completion, the value is replaced with `WI.SpreadsheetTextField._pendingValue`.
        At this point, `WI.SpreadsheetTextField.value` and the `textContent` of the element converge.

        (WI.SpreadsheetTextField.prototype._updatePendingValueWithCompletionText):
        When presented with a completion, the query gets substituted with the full completion text in 
        `WI.SpreadsheetTextField._pendingValue` regardless of whether the query is a prefix or not.

        (WI.SpreadsheetTextField.prototype._applyCompletionHint): Deleted.
        (WI.SpreadsheetTextField.prototype._combineEditorElementChildren): Deleted.

2021-12-06  Patrick Angle  <pangle@apple.com>

        Web Inspector: Support Cascade Layers in the Styles sidebar
        https://bugs.webkit.org/show_bug.cgi?id=233208

        Reviewed by Devin Rousso.

        * UserInterface/Models/CSSGrouping.js:
        (WI.CSSGrouping):
        (WI.CSSGrouping.prototype.get isLayer):
        (WI.CSSGrouping.prototype.get prefix):
        - Update `CSSGrouping` to support `@layer` rules, and make `text` optional for a grouping, since anonymous layers
        will not have a name.

        * UserInterface/Models/CSSStyleDeclaration.js:
        (WI.CSSStyleDeclaration.prototype.generateFormattedText):
        - Ensure that spacing remains correct and "null" isn't shown for groupings without text.

        * UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js:
        (WI.SpreadsheetCSSStyleDeclarationSection.prototype.initialLayout):
        - When merging layer groups, ensure that a "." is used as a separator, and that each group has a name (to
        prevent having a hanging period or the "null" text appearing).

2021-12-02  Devin Rousso  <drousso@apple.com>

        [css-values-4] Support `*vi` (inline) and `*vb` (block) viewport units
        https://bugs.webkit.org/show_bug.cgi?id=232895
        <rdar://problem/85179134>

        Reviewed by Simon Fraser.

        * UserInterface/Models/CSSCompletions.js:

2021-12-01  Patrick Angle  <pangle@apple.com>

        Web Inspector: Console execution context can become an unexpected selection on refresh/navigation
        https://bugs.webkit.org/show_bug.cgi?id=233349

        Reviewed by Devin Rousso.

        There are really three bugs here in `WI.QuickConsole.prototype._handleFrameExecutionContextsCleared`, each of
        which contribute to unexpected execution context selections.

        1. If the frame of the active execution context commits a provisional load, our code attempts to re-select the
        new context for that frame, which results in clearing the `Auto` bit for selected context, which means the
        context no longer will follow the selected DOM node. This is resolved by no longer following a frame's execution
        context on navigation if the current selection is `Auto` (tracked by the `_useExecutionContextOfInspectedNode`
        variable).

        2. Because of the very short timeframe for the above to take place before bailing (previously 10ms) there are
        many situations where other large payloads over the protocol, like a complex DOM tree, will cause the timeout to
        fire before we receive an event telling us there is a new execution context for the frame, which means we end up
        not following the frame anyways. This is improved by increasing the timeout to a still-brisk, but more
        reasonable 100ms.

        3. The timeout in (2) can lead to us having a selected execution context that may no longer be valid because the
        fail-safe in `QuickConsole.prototype._handleFrameExecutionContextsCleared` doesn't really fail safely, since it
        doesn't provide a new execution context to be active and instead seems to rely on the hope that the context will
        still work for future invocations, which I believe is how many users are getting into the state of a blank
        execution context picker (with a working drop down menu with actual contexts that are selectable) and are unable
        to evaluate anything in the console until re-selecting an execution context.

        Additional drive-by change to move the checks for whether or not we can use the execution context of a selected
        node into its own method.

        * UserInterface/Views/QuickConsole.js:
        (WI.QuickConsole.prototype._populateActiveExecutionContextNavigationItemContextMenu):
        (WI.QuickConsole.prototype._handleEngineeringShowInternalExecutionContextsSettingChanged):
        (WI.QuickConsole.prototype._handleFrameExecutionContextsCleared):
        (WI.QuickConsole.prototype._handleTargetRemoved):
        (WI.QuickConsole.prototype._canUseExecutionContextOfInspectedNode):

2021-11-30  BJ Burg  <bburg@apple.com>

        Web Inspector: add ExtensionTabActivation diagnostic event
        https://bugs.webkit.org/show_bug.cgi?id=233101
        <rdar://85264921>

        Reviewed by Devin Rousso.

        Add new diagnostic event that reports the first activation of
        an extension tab. Also report the number of active extension tabs.

        * UserInterface/Controllers/ExtensionTabActivationDiagnosticEventRecorder.js: Added.
        (WI.ExtensionTabActivationDiagnosticEventRecorder):
        (WI.ExtensionTabActivationDiagnosticEventRecorder.prototype.setup):
        (WI.ExtensionTabActivationDiagnosticEventRecorder.prototype.teardown):
        (WI.ExtensionTabActivationDiagnosticEventRecorder.prototype._selectedTabContentViewDidChange):
        Report only the first activation. The extension tab iframe does not load until
        the first time that the tab is selected and shown.

        * UserInterface/Base/Main.js:
        (WI.contentLoaded): Add diagnostic event recorder if extensions are supported.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.registerExtension):
        Pass along the new extensionBundleIdentifier argument to the model object.

        (WI.WebInspectorExtensionController.prototype.activeExtensionTabContentViews):
        Added. This is a helper method for collecting diagnostic event data.

        * UserInterface/Debug/Bootstrap.js:
        (updateMockWebExtensionTab):
        (WI.runBootstrapOperations):
        Pass new extensionBundleIdentifier argument for the Mock Extension.

        * UserInterface/Main.html: Add new file.
        * UserInterface/Models/WebInspectorExtension.js:
        (WI.WebInspectorExtension):
        (WI.WebInspectorExtension.prototype.get extensionBundleIdentifier):
        Store the extension bundle identifier on the model object. Add a getter.

        * UserInterface/Protocol/InspectorFrontendAPI.js:
        (InspectorFrontendAPI.registerExtension):
        Pass new extensionBundleIdentifier argument.

        * UserInterface/Views/WebInspectorExtensionTabContentView.js:
        (WI.WebInspectorExtensionTabContentView.prototype.get extension): Added.

2021-11-29  Simon Fraser  <simon.fraser@apple.com>

        Remove some unused event names
        https://bugs.webkit.org/show_bug.cgi?id=233485

        Reviewed by Sam Weinig.

        * UserInterface/Models/ScriptTimelineRecord.js:
        (WI.ScriptTimelineRecord.EventType.displayName):

2021-11-17  Nikita Vasilyev  <nvasilyev@apple.com>

        Web Inspector: Add a swatch for align-content
        https://bugs.webkit.org/show_bug.cgi?id=230065
        <rdar://problem/82891361>

        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):

2021-11-17  Devin Rousso  <drousso@apple.com>

        Web Inspector: assertion failures in `WI.GridOverlayConfigurationDiagnosticEventRecorder`
        https://bugs.webkit.org/show_bug.cgi?id=233298

        Reviewed by Patrick Angle.

        * UserInterface/Controllers/GridOverlayConfigurationDiagnosticEventRecorder.js:
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype.teardown):

2021-11-17  Devin Rousso  <drousso@apple.com>

        Web Inspector: allow left docking when in LTR and right docking when in RTL
        https://bugs.webkit.org/show_bug.cgi?id=233294

        Reviewed by Patrick Angle.

        Some developers prefer docking to the left even when in LTR and/or docking to the right when
        in RTL. There's no technical reason to disallow this, so let's make it possible.

        * UserInterface/Base/Main.js:
        (WI.contentLoaded):
        (WI.contentLoaded.addDockButton): Added.
        (WI.contentLoaded.addDockLeftButton): Added.
        (WI.contentLoaded.addDockRightButton): Added.
        (WI._updateDockNavigationItems):
        (WI._updateTabBarDividers):
        (WI.setLayoutDirection):
        Instead of having a single `_dockToSideTabBarButton` that looks at the layout direction to
        decide its image, tooltip, and action, split it into two distinct `_dockLeftTabBarButton`
        and `_dockRightTabBarButton` buttons that are both always visible (unless Web Inspector is
        already in the corresponding docking state).

        * UserInterface/Images/DockBottom.svg:
        * UserInterface/Images/DockLeft.svg:
        * UserInterface/Images/DockRight.svg:
        Fill in the area representing Web Inspector and make it a bit smaller so it's not as heavy.

        * Localizations/en.lproj/localizedStrings.js:

2021-11-16  Nikita Vasilyev  <nvasilyev@apple.com>

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

        Reviewed by Devin Rousso.

        `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):

2021-11-15  Patrick Angle  <pangle@apple.com>

        Web Inspector: Styles: Autocomplete should support mid-line completions
        https://bugs.webkit.org/show_bug.cgi?id=227411

        Reviewed by Devin Rousso.

        Autocompletion for CSS property values was lacking in the ability to perform mid-line completions, including
        within functions, and a lack of support for multi-line CSS property values. This resolves those pain points by
        making SpreadsheetTextField multi-line aware and allowing mid-line autocompletion.

        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype._nameCompletionDataProvider):
        (WI.SpreadsheetStyleProperty.prototype._valueCompletionDataProvider):

        * UserInterface/Views/SpreadsheetTextField.js:
        (WI.SpreadsheetTextField):
        (WI.SpreadsheetTextField.prototype.valueWithoutSuggestion):
        Because suggestions can occur anywhere within the value, we need to iterate through each of the nodes and
        collect the text of any of them that are not the completion suggestion.

        (WI.SpreadsheetTextField.prototype.set suggestionHint):
        When removing the suggestion hint element, we should recombine the text nodes we may have split upon insertion
        to prevent the text content from becoming endlessly fragmented into multiple text nodes unnecessarily.

        (WI.SpreadsheetTextField.prototype.startEditing):
        Reset the last known caret position when editing starts so that we don't mistake keys that are already down as
        having moved the cursor to its initial position.

        (WI.SpreadsheetTextField.prototype.completionSuggestionsSelectedCompletion):
        We should only attempt to reattach the suggestion hint element if we have a suggestion hint to show, otherwise
        we could end up with a phantom empty suggestion hint that isn't properly placed later.

        (WI.SpreadsheetTextField.prototype.completionSuggestionsClickedCompletion):
        Updated to use existing completion committing path to reduce duplicated logic.

        (WI.SpreadsheetTextField.prototype._handleMouseDown):
        When the user clicks inside the text field while suggestions are visible treat that as intent to stop
        autocompletion similar to the escape key, since the new cursor location could be anywhere in the text field.
        This behavior also matches other code editors like Xcode, where clicking outside a completion popup will dismiss
        the completions list.

        (WI.SpreadsheetTextField.prototype._handleKeyDown):
        Keep track of where the caret was as well as if the the key event was handled by the suggestion view at the time
        a key is pressed so that we can later compare the position to that of when the key is released to determine if
        completions should be discarded.

        (WI.SpreadsheetTextField.prototype._handleKeyDownForSuggestionView):
        We can no longer assume that the current selection's offset will match the value's length, as the offset could
        be on any line, or the suggestion could be in middle of a line. Because a suggestionHint only contains text when
        we are in middle of autocompletion, it alone is an indicator that pressing the right arrow key should commit the
        completion. `document.execCommand` is deprecated, so instead we now use the existing completion committing path
        to reduce duplicated logic here.

        Note that the left arrow key is still explicitly handled for dismissing autocompletion, as the new mechanism for
        dismissing autocompletion won't trigger unless the caret has moved, and the caret will not move if you press the
        left arrow key at the start of the text field.

        (WI.SpreadsheetTextField.prototype._handleKeyUp):
        When a key is released, we should check to see if the caret has moved as a result of the keystroke that we have
        not already explicitly handled. If it has moved and was not handled, we dismiss the autocompletion suggestions.

        (WI.SpreadsheetTextField.prototype._handleInput):

        (WI.SpreadsheetTextField.prototype._updateCompletions):
        Provide the current caret position to the completion provided.

        (WI.SpreadsheetTextField.prototype._showSuggestionsView):
        In order to correctly align the completion list with the current text content, it must be offset from the caret
        position excluding the current prefix.

        (WI.SpreadsheetTextField.prototype._getCaretPosition):
        Added to get the index of the caret in the complete text value, accounting for multi-line values and mid-line
        suggestions.

        (WI.SpreadsheetTextField.prototype._getCaretRect):

        (WI.SpreadsheetTextField.prototype._rangeAtCaretPosition):
        Find the range for a caret at the given position. This compliments `_getCaretPosition`, and allows us to count
        back some number of characters and create a range of which we later get the client rectangle.

        (WI.SpreadsheetTextField.prototype._applyCompletionHint):
        Add optional support for updating the caret position to be at the end of the newly inserted text.

        (WI.SpreadsheetTextField.prototype._combineEditorElementChildren):
        Added to handle combining the fragmented text nodes (and possibly a suggestion hint element) back into a single
        text node while maintaining the current cursor position or optionally moving the cursor to a new location (e.g.
        the end of a completion).

        (WI.SpreadsheetTextField.prototype._reAttachSuggestionHint):
        Now that completions are not guaranteed to be at the end of the value, we may need to split the text node to
        insert the suggestion hint node.

2021-11-15  Fujii Hironori  <Hironori.Fujii@sony.com>

        Web Inspector: Layers Tab: the position of composited layer with box-shadow is wrong
        https://bugs.webkit.org/show_bug.cgi?id=233026

        Reviewed by Devin Rousso.

        If an element has box-shadow, Layers Tab showed the composited
        layer positioned wrongly. It assumed the composited layer position
        was same with its element position. This isn't true. If an element
        has box-shadow, its composited layer includes the surrounding
        box-shadow.

        * UserInterface/Models/Layer.js:
        (WI.Layer):
        * UserInterface/Views/Layers3DContentView.js:
        (WI.Layers3DContentView.prototype._updateLayers):
        (WI.Layers3DContentView.prototype._createLayerMesh):

2021-11-12  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Extract reusable logic from ResourceQueryController, ResourceQueryResult and ResourceQueryMatch
        https://bugs.webkit.org/show_bug.cgi?id=231604
        <rdar://problem/84160281>

        Reviewed by Devin Rousso.

        Extract reusable logic from `ResourceQueryController` into a generic `QueryController`
        to enable subclassing for other specialized use cases.

        * UserInterface/Controllers/QueryController.js: Added.
        (WI.QueryController.prototype.executeQuery):
        (WI.QueryController.prototype.findQueryMatches.pushMatch):
        (WI.QueryController.prototype.findQueryMatches.matchNextSpecialCharacter):
        (WI.QueryController.prototype.findQueryMatches.backtrack):
        (WI.QueryController.prototype.findQueryMatches):
        (WI.QueryController):

        Keep only the reusable matching logic in `QueryController`.
        Subclasses like `ResourceQueryController` are responsible for agregating
        the data to be queried, customization for special characters and sorting results.

        * UserInterface/Controllers/ResourceQueryController.js:
        (WI.ResourceQueryController.prototype.executeQuery):
        (WI.ResourceQueryController.prototype._findQueryMatches.pushMatch): Deleted.
        (WI.ResourceQueryController.prototype._findQueryMatches.matchNextSpecialCharacter): Deleted.
        (WI.ResourceQueryController.prototype._findQueryMatches.backtrack): Deleted.
        (WI.ResourceQueryController.prototype._findQueryMatches): Deleted.

        * UserInterface/Main.html:

        * UserInterface/Models/QueryMatch.js: Renamed from Source/WebInspectorUI/UserInterface/Models/ResourceQueryMatch.js.

        `ResourceQueryMatch` doesn't contain any resource-specific logic. It can be generalized to `QueryMatch`.

        * UserInterface/Models/QueryResult.js: Copied from Source/WebInspectorUI/UserInterface/Models/ResourceQueryResult.js.
        (WI.QueryResult):
        (WI.QueryResult.prototype.get value):
        (WI.QueryResult.prototype.get rank):
        (WI.QueryResult.prototype.get matchingTextRanges):
        (WI.QueryResult.prototype._calculateRank.getMultiplier):
        (WI.QueryResult.prototype._calculateRank):
        (WI.QueryResult.prototype._createMatchingTextRanges):

        A generic `QueryResult` can be extracted from `ResourceQueryResult` containing
        the reusable logic for ranking results and identifing matching text ranges.

        * UserInterface/Models/ResourceQueryResult.js:
        (WI.ResourceQueryResult):
        (WI.ResourceQueryResult.prototype.get resource):
        (WI.ResourceQueryResult.prototype.__test_createMatchesMask):
        (WI.ResourceQueryResult.prototype.get rank): Deleted.
        (WI.ResourceQueryResult.prototype.get matchingTextRanges): Deleted.
        (WI.ResourceQueryResult.prototype._calculateRank.getMultiplier): Deleted.
        (WI.ResourceQueryResult.prototype._calculateRank): Deleted.
        (WI.ResourceQueryResult.prototype._createMatchingTextRanges): Deleted.

        `ResourceQueryResult` extends `QueryResult` with resource-specifc members:
        - the `cookie` property which holds the optional line and column info used when jumping to matched files
        - the `resource` property which maps to the generic `QueryResult.value`; this is used in tests and when sorting in `ResourceQueryController`

        * UserInterface/Test.html:

2021-11-10  Tim Nguyen  <ntim@apple.com>

        Remove non-standard -webkit-border-fit CSS property
        https://bugs.webkit.org/show_bug.cgi?id=229564

        Reviewed by Simon Fraser.

        * UserInterface/Models/CSSKeywordCompletions.js:

2021-11-10  Alexey Proskuryakov  <ap@apple.com>

        WebInspectorUI needs to support InstallAPI
        https://bugs.webkit.org/show_bug.cgi?id=232955

        Reviewed by BJ Burg.

        * Configurations/WebInspectorUIFramework.xcconfig:

2021-11-09  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Add script to update CSSDocumentation.js
        https://bugs.webkit.org/show_bug.cgi?id=232433
        <rdar://problem/84753008>

        Reviewed by Devin Rousso.

        * Scripts/update-inspector-css-documentation: Added.

        Add a script to update the contextual CSS documentation data source at
        `Source/WebInspectorUI/UserInterface/External/CSSDocumentation/CSSDocumentation.js`
        with the latest information from the upstream data source.

        * UserInterface/Controllers/CSSManager.js:
        (WI.CSSManager.prototype.canonicalNameForPropertyName):

        Add a comment to keep the list of accepted prefixes in sync with the one from the script.

2021-11-08  Razvan Caliman  <rcaliman@apple.com>

        Update CSSDocumentation.js with latest upstream data to fix wrong documentation for block-size
        https://bugs.webkit.org/show_bug.cgi?id=231566
        <rdar://problem/84406443>

        Reviewed by Devin Rousso.

        Update CSSDocumentation.js with latest upstream data source which contains
        fixes for descriptions of logical properties for sizing:
        block-size, inline-size, min-/max-block-size, min-/max-inline-size

        * UserInterface/External/CSSDocumentation/CSSDocumentation.js:

2021-11-03  Alex Christensen  <achristensen@webkit.org>

        Remove QuickTimePluginReplacement and YouTubePluginReplacement
        https://bugs.webkit.org/show_bug.cgi?id=232400

        Reviewed by Chris Dumez.

        * UserInterface/Models/NativeFunctionParameters.js:

2021-11-03  Nikita Vasilyev  <nvasilyev@apple.com>

        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  <ddkilzer@apple.com>

        Web Inspector: Enable -Wformat=2 warnings
        <https://webkit.org/b/232359>
        <rdar://problem/84691442>

        Reviewed by Darin Adler.

        * Configurations/Base.xcconfig:
        (WARNING_CFLAGS):
        - Add -Wformat=2 switch, which includes -Wformat-nonliteral.

2021-10-28  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Audit: testForLinkLabels Accessibility audit should ignore anchors if aria-hidden
        https://bugs.webkit.org/show_bug.cgi?id=231038
        <rdar://problem/83783868>

        Update `testForLinkLabels` accessibility audit test to exclude hidden links.
        See `AccessibilityObject->isHidden()`

        Reviewed by BJ Burg.

        * UserInterface/NonMinified/DefaultAudits.js:
        (WI.DefaultAudits.testForLinkLabels):

2021-10-27  BJ Burg  <bburg@apple.com>

        Web Inspector: extension iframes leak when disabling an extension
        https://bugs.webkit.org/show_bug.cgi?id=232049

        Reviewed by Timothy Hatcher.

        Since shouldNotRemoveFromDOMWhenHidden() is true, the <iframe> will not
        be detached and unload its document in the normal tab-closing code path.
        Add a `dispose()` method for cleaning up the tab when its extension is
        unregistered.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.unregisterExtension):
        * UserInterface/Views/WebInspectorExtensionTabContentView.js:
        (WI.WebInspectorExtensionTabContentView.prototype.dispose):

2021-10-21  Devin Rousso  <drousso@apple.com>

        [css-values-4] Support small (sv*), large (lv*) and dynamic (dv*) viewport units
        https://bugs.webkit.org/show_bug.cgi?id=219287
        <rdar://problem/71857370>

        Reviewed by Simon Fraser.

        * UserInterface/Models/CSSCompletions.js:

2021-10-18  David Kilzer  <ddkilzer@apple.com>

        Web Inspector: Remove Source/WebInspectorUI/UserInterface/Controllers/WebInspectorExtensionController.js.orig
        <https://webkit.org/b/231896>

        Reviewed by BJ Burg.

        * UserInterface/Controllers/WebInspectorExtensionController.js.orig: Remove.

2021-10-15  BJ Burg  <bburg@apple.com>

        [Cocoa] Web Inspector: handle Promise objects returned from evaluateScriptInExtensionTab
        https://bugs.webkit.org/show_bug.cgi?id=231709
        <rdar://problem/84224179>

        Reviewed by Timothy Hatcher.

        This patch improves the handling of promises and exceptions that come from
        InspectorFrontendHost.evaluateScriptInExtensionTab().

        For promises, wait for the returned promise to settle before fulfilling our returned value.
        For errors, perform a better stringification of the Error instance. The is needed because
        the default toString implementation leaves out most of the relevant details of the error.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.evaluateScriptInExtensionTab):

        * UserInterface/Protocol/InspectorFrontendAPI.js:
        Fix incorrect header docs for InspectorFrontendAPI.evaluateScriptForExtension.
        Copy the improved header doc for InspectorFrontendAPI.evaluateScriptInExtensionTab
        since it now has the same calling convention.

2021-10-14  Myles C. Maxfield  <mmaxfield@apple.com>

        All the SDKVariant.xcconfig files should match
        https://bugs.webkit.org/show_bug.cgi?id=231663

        Reviewed by Youenn Fablet.

        * Configurations/SDKVariant.xcconfig:

2021-10-13  Carlos Garcia Campos  <cgarcia@igalia.com>

        HTTP method in web inspector network tab is not what WebKit actually sent after a redirect from POST to GET
        https://bugs.webkit.org/show_bug.cgi?id=222558

        Reviewed by Michael Catanzaro.

        Test: http/tests/inspector/network/resource-redirect-request-headers.html

        For redirects, use the previous request information combined with the new response information to create a
        Redirect record.

        * UserInterface/Models/Resource.js:
        (WI.Resource.prototype.updateForRedirectResponse):

2021-10-12  Alexey Proskuryakov  <ap@apple.com>

        Invoke build scripts with python3 explicitly
        https://bugs.webkit.org/show_bug.cgi?id=231587

        Reviewed by Jonathan Bedard.

        Much of the work to support Python 3 was done years ago, but we need this to
        actually use Python 3 on macOS.

        * Scripts/copy-user-interface-resources.pl:

2021-10-11  BJ Burg  <bburg@apple.com>

        Web Inspector: add TabBar context menu support for WI.WebInspectorExtensionTabContentView
        https://bugs.webkit.org/show_bug.cgi?id=231181
        <rdar://74698241>

        Unreviewed. Land parts of the previous patch which seem to have been mis-merged and not landed.

        * UserInterface/Base/Main.js:
        (WI.isNewTabWithTypeAllowed):
        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.showExtensionTab):
        * UserInterface/Views/TabBar.js:
        (WI.TabBar.prototype._handleAddClosedTabsTabBarItemMouseDown):
        (WI.TabBar.prototype._handleTabContainerContextMenu):
        (WI.TabBar):

2021-10-11  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Move CSS longhand and shorthand mapping away from WI.CSSCompletions
        https://bugs.webkit.org/show_bug.cgi?id=231432
        <rdar://problem/84029471>

        Reviewed by Devin Rousso.

        `WI.CSSCompletions` has scope creep. Beyond handling filtering for CSS completions,
        it holds logic to deal with CSS property name longhand-to-shorthand mapping.

        But it already relies heavily on metadata about properties set on `WI.CSSKeywordCompletions`
        populated as a result of the one-time initialization from `WI.CSSCompletions.initializeCSSCompletions(target)` >
        `WI.CSSKeywordCompletions.addCustomCompletions(properties)`.

        This change moves the longhand-to-shorthand mapping from `WI.CSSCompletions` to
        `WI.CSSKeywordCompletions.ShorthandNamesForLongHandProperty` and updates relevant consumers.

        The aim is to gradually remove all specialized logic for property names from `WI.CSSCompletions`.

        * UserInterface/Models/CSSCompletions.js:
        (WI.CSSCompletions):
        (WI.CSSCompletions.prototype.isShorthandPropertyName): Deleted.
        (WI.CSSCompletions.prototype.shorthandsForLonghand): Deleted.
        * UserInterface/Models/CSSKeywordCompletions.js:
        * UserInterface/Models/CSSProperty.js:
        (WI.CSSProperty):
        * UserInterface/Models/DOMNodeStyles.js:
        (WI.DOMNodeStyles.prototype._associateRelatedProperties):

2021-10-08  BJ Burg  <bburg@apple.com>

        Web Inspector: add TabBar context menu support for WI.WebInspectorExtensionTabContentView
        https://bugs.webkit.org/show_bug.cgi?id=231181
        <rdar://74698241>

        Reviewed by Devin Rousso.

        The existing TabBar/TabBrowser system relies on the fact that each tab class can
        be instantiated once. This is no longer true with extension tabs, as all of them
        are instances of the same WI.WebInspectorExtensionTabContentView class.

        The new approach builds on bug 230758 by introducing a 'visible' property on ContentView.
        This is necessary to mark extension tabs as "attached by not showing" due to the
        override of shouldNotRemoveFromDOMWhenHidden().

        * UserInterface/Base/Main.js:
        (WI._createTabContentViewForType):
        (WI.isNewTabWithTypeAllowed):
        List WebInspectorExtensionTabContentView as a known tab class. But do not allow
        this tab class to be instantiated directly. Extension tabs are intended to be
        created using WebInspectorExtensionController.createTabForExtension().

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.unregisterExtension):
        (WI.WebInspectorExtensionController.prototype.createTabForExtension):
        Drive-by, suppress animations when extension tabs are created and destroyed. Otherwise
        there is a lot of unnecessary and glitchy animation when multiple extension tabs are 
        created upon loading Web Inspector the first time.

        (WI.WebInspectorExtensionController.prototype.showExtensionTab):
        (WI.WebInspectorExtensionController.prototype.hideExtensionTab): Added.
        These methods are counterparts. They toggle tabContentView.visible to make the tab
        visible and not visible. Note that 'hiding' does not actually close/destroy the
        extension tab. Extension tabs are hidden by setting .not-visible ('display:none') and
        removing the tab's TabBarItem from the TabBar.

        (WI.WebInspectorExtensionController.prototype.addContextMenuItemsForClosedExtensionTabs):
        (WI.WebInspectorExtensionController.prototype.addContextMenuItemsForAllExtensionTabs):
        Added. TabBar delegates the creation of extension tab context menu items to this class.
        The first method only shows hidden extension tabs (for the Reopen Closed Tabs + item).
        The second method shows visible and not visible extension tabs and feeds the main context menu.

        * UserInterface/Views/ContentView.css:
        (.content-view.not-visible):
        * UserInterface/Views/ContentViewContainer.css:
        (.content-view-container > .content-view):
        (.content-view-container > .content-view.not-visible): Deleted.
        This style class is now managed by ContentView.js. So, move the style declaration.

        * UserInterface/Views/ContentView.js:
        (WI.ContentView):
        (WI.ContentView.prototype.get visible):
        (WI.ContentView.prototype.set visible):
        Add a flag so that clients can determine when the content view is not visible and not closed.
        This can be true if a subclass overrides shouldNotRemoveFromDOMWhenHidden() to return true.

        * UserInterface/Views/ContentViewContainer.js:
        (WI.ContentViewContainer.prototype._disassociateFromContentView):
        Fix this code to not detach extension tabs that are hidden.

        (WI.ContentViewContainer.prototype._showEntry):
        (WI.ContentViewContainer.prototype._hideEntry):
        Adopt new setter for ContentView.prototype.hidden.

        * UserInterface/Views/TabBar.js:
        (WI.TabBar.prototype._handleAddClosedTabsTabBarItemMouseDown):
        Don't add generic context menu items for WebInspectorExtensionTabContentView. Call out
        to WebInspectorExtensionController to create the appropriate extension tab context menu items.
        (WI.TabBar.prototype._handleTabContainerContextMenu):
        (WI.TabBar):

        * UserInterface/Views/WebInspectorExtensionTabContentView.js:
        (WI.WebInspectorExtensionTabContentView.isTabAllowed): Drive-by, gate creation of this class
        on Web Extensions being enabled (InspectorFrontendHost.supportsWebExtensions).

2021-10-08  BJ Burg  <bburg@apple.com>

        [Cocoa] Web Inspector: provide a way for _WKInspectorExtension clients to be notified when the inspected page navigates
        https://bugs.webkit.org/show_bug.cgi?id=231338
        <rdar://71200338>

        Reviewed by Devin Rousso.

        Pass along an onNavigated event to InspectorFrontendHost when the WI.Frame.MainResourceDidChange
        event fires at a main frame target.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController):
        (WI.WebInspectorExtensionController.prototype.registerExtension):
        (WI.WebInspectorExtensionController.prototype.unregisterExtension):
        Do not add this global listener unless at least one WI.WebInspectorExtension
        is currently registered.

        (WI.WebInspectorExtensionController.prototype._handleMainResourceDidChange):

2021-10-07  BJ Burg  <bburg@apple.com>

        Web Inspector: WebInspectorExtensionTabContentView should not reload its iframe when detached
        https://bugs.webkit.org/show_bug.cgi?id=230758
        <rdar://74714861>

        Reviewed by Timothy Hatcher.

        When an <iframe> element detaches from the DOM, the script context is destroyed, which we don't
        want to happen for _WKInspectorExtension tabs. Fix this by teaching ContentViewContainer to
        'hide' such content views by setting `display:none` rather than detaching from the DOM.

        * UserInterface/Views/ContentViewContainer.js:
        (WI.ContentViewContainer.prototype._showEntry):
        (WI.ContentViewContainer.prototype._hideEntry):
        Set and unset 'display:none' instead of calling addSubview() / removeSubview().

        * UserInterface/Views/ContentViewContainer.css:
        (.content-view-container > .content-view.hidden-for-detach): Added.

        (WI.ContentViewContainer.prototype._disassociateFromContentView):
        Clean up any remaining content views that were not detached due to overriding shouldNotRemoveFromDOMWhenHidden.

        * UserInterface/Views/ContentView.js:
        (WI.ContentView.prototype.get shouldNotRemoveFromDOMWhenHidden): Added.

        * UserInterface/Views/WebInspectorExtensionTabContentView.js:
        (WI.WebInspectorExtensionTabContentView):
        (WI.WebInspectorExtensionTabContentView.prototype.get shouldNotRemoveFromDOMWhenHidden):
        Override this to opt into the alternate behavior that does not detach from the DOM. It is still
        necessary to call attached() and detached() so that WebInpectorExtensionTabContentView can generate
        didShowExtensionTab/didHideExtensionTab event callbacks.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.get registeredExtensionIDs):
        * UserInterface/Debug/Bootstrap.js:
        (updateMockWebExtensionTab):
        (WI.runBootstrapOperations):
        This is a drive-by fix to address a console assertion seen while developing the API test.
        Don't unregister the mock extension if it is not registered in the first place.

2021-10-07  Nikita Vasilyev  <nvasilyev@apple.com>

        Web Inspector: Styles: format style declarations after editing
        https://bugs.webkit.org/show_bug.cgi?id=178835
        <rdar://problem/35185060>

        Reviewed by Devin Rousso.

        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):

2021-10-05  Patrick Angle  <pangle@apple.com>

        Web Inspector: Show color space for canvases in the Graphics tab on the overview cards
        https://bugs.webkit.org/show_bug.cgi?id=231205

        Reviewed by Devin Rousso.

        For canvas context's with a color space attribute, show the color space next to the context type in the header
        of each context card in the Graphics tab.

        * UserInterface/Models/Canvas.js:
        (WI.Canvas.displayNameForColorSpace):
        * UserInterface/Views/CanvasContentView.js:
        (WI.CanvasContentView.prototype.initialLayout):
        * UserInterface/Views/CanvasOverviewContentView.css:
        (.content-view.canvas-overview > .content-view.canvas > header > .titles > :matches(.subtitle, .color-space),):
        (.content-view.canvas-overview > .content-view.canvas > header .color-space::before):

2021-09-29  BJ Burg  <bburg@apple.com>

        [Cocoa] add _WKInspectorExtension SPI to evaluate script on an extension tab
        https://bugs.webkit.org/show_bug.cgi?id=230646
        <rdar://problem/83420328>

        Reviewed by Devin Rousso.

        Add a new InspectorFrontendAPI method to evaluate script on an iframe within
        Web Inspector. This in turn calls out to InspectorFrontendHost to do the actual evaluation.
        Otherwise, the CSP policy set by the tab content may block any such evaluation
        if the 'script-src' directive does not include 'unsafe-eval'.

        * UserInterface/Protocol/InspectorFrontendAPI.js:
        (InspectorFrontendAPI.showExtensionTab):
        (InspectorFrontendAPI.evaluateScriptInExtensionTab):
        Call through to the WebInspectorExtensionController method.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.evaluateScriptInExtensionTab): Added.
        Try to get the <iframe> for a extensionTabID, and use InspectorFrontendHost to
        evaluate script in the context of the <iframe>. Be sure to correctly wrap the result.

        * UserInterface/Views/WebInspectorExtensionTabContentView.js:
        (WI.WebInspectorExtensionTabContentView):
        (WI.WebInspectorExtensionTabContentView.prototype.get iframeElement):
        (WI.WebInspectorExtensionTabContentView.shouldSaveTab):
        (WI.WebInspectorExtensionTabContentView.prototype.initialLayout): Deleted.
        While writing the API test, I saw that the first evaluation frequently failed
        because the <iframe> did not exist. Change this class so that the <iframe>
        is created in the constructor. Add a getter for the <iframe> element.

        (WI.WebInspectorExtensionTabContentView.prototype._extensionFrameDidLoad):
        (WI.WebInspectorExtensionTabContentView.prototype._maybeDispatchDidShowExtensionTab):
        While writing this patch, it became apparent that didShowExtensionTab() was being
        called prior to the iframe actually completing its initial load. Then, the test
        would try to evaluate script on about:blank instead of the actual tab content.
        To fix this, require that the <iframe> be attached and have fired the `onload` event
        before we notify clients that it has been 'shown'.

        * UserInterface/Main.html:
        Adjust the default CSP policy to not mention img-src. This allows ports such as
        Cocoa to set their own img-src CSP directive. These changes are necessary to allow
        images to load from custom URL schemes.

        * UserInterface/Views/TabBrowser.js:
        (WI.TabBrowser.prototype.bestTabContentViewForRepresentedObject):
        The new API test exposes a bug in this assertion, namely, that it does not account
        for the situation where a tab does not wish to be saved. In that case, the displayed
        WebInspectorExtensionTabContentView is *not* at index 0 of WI.TabBrowser.recentTabContentViews.
        This is correctly handled with a special case in WI.TabBrowser._tabBarItemSelected,
        so incorporate that logic into the assertion.

2021-09-28  BJ Burg  <bburg@apple.com>

        Web Inspector: add settings option for 'Show Mock Web Extension Tab' in engineering builds
        https://bugs.webkit.org/show_bug.cgi?id=230923

        Reviewed by Devin Rousso.

        This is an engineering-only facility to quickly check the behavior of
        WebInspectorExtensionTabContentView (aka Web Extension Tabs). The behavior
        of these tabs differs from other tabs, so it is important to make this easy to verify.

        * UserInterface/Base/Setting.js: Add new setting.
        * UserInterface/Debug/Bootstrap.js:
        (updateMockWebExtensionTab):
        (WI.runBootstrapOperations):
        Call the InspectorFrontendAPI commands that would be called by WebInspectorUIExtensionController
        to register an extension and create a tab for it.

        * UserInterface/Debug/MockWebExtensionTab.html: Added.
        This is adapted from InspectorExtension-basic-tab.html as used in TestWebKitAPI.

        * UserInterface/Protocol/InspectorFrontendAPI.js: Fix a typo in the headerdoc
        for createTabForExtension.

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

2021-09-28  BJ Burg  <bburg@apple.com>

        [Cocoa] Add SPI to select a tab created by _WKInspectorExtension
        https://bugs.webkit.org/show_bug.cgi?id=230580
        <rdar://problem/83372851>

        Reviewed by Devin Rousso.

        Add a method to look up a WebInspectorExtensionTabContentView
        by its extensionTabID and then show it with WI.tabBrowser.

        * UserInterface/Controllers/WebInspectorExtensionController.js:
        (WI.WebInspectorExtensionController.prototype.reloadForExtension):
        Remove extra newlines.
        (WI.WebInspectorExtensionController.prototype.showExtensionTab): Added.

        * UserInterface/Protocol/InspectorFrontendAPI.js:
        (InspectorFrontendAPI.showExtensionTab): Added.

2021-09-23  Myles C. Maxfield  <mmaxfield@apple.com>

        Web Inspector support for font-palette
        https://bugs.webkit.org/show_bug.cgi?id=230453

        Reviewed by Devin Rousso.

        Provide keyword completions.

        * UserInterface/Models/CSSKeywordCompletions.js:

2021-09-22  Devin Rousso  <drousso@apple.com>

        Web Inspector: add a pinned [+] button to the tab bar to make it easier to re-open closed tabs
        https://bugs.webkit.org/show_bug.cgi?id=230600

        Reviewed by BJ Burg.

        * UserInterface/Views/TabBar.js:
        (WI.TabBar):
        (WI.TabBar.prototype.selectTabBarItem):
        (WI.TabBar.prototype.layout):
        (WI.TabBar.prototype._pinnedButtons): Added.
        (WI.TabBar.prototype._closedTabClasses): Added.
        (WI.TabBar.prototype._handleTabContainerMouseDown):
        (WI.TabBar.prototype._handleShowHiddenTabsTabBarItemMouseDown): Added.
        (WI.TabBar.prototype._handleAddClosedTabsTabBarItemMouseDown): Added.
        (WI.TabBar.prototype._handleTabContainerClick): Deleted.
        Add a `_openClosedTabsTabBarItem` that's a `WI.PinnedTabBarItem` without a `representedObject`,
        meaning that it's basically just a button and won't actually open a tab when clicked. This
        suits our purposes perfectly as we only want to show a contextmenu on click, not to mention
        that it will only be shown if there are closed tabs.
        Drive-by: Rename `_tabPickerTabBarItem` to `_showHiddenTabsTabBarItem` to clarify purpose.
        Drive-by: Remove `_handleTabContainerClick` as tabs can only be removed via the contextmenu.

        * UserInterface/Images/Overflow.svg: Renamed from UserInterface/Images/TabPicker.svg.
        Drive-by: Rename to clarify purpose.

        * Localizations/en.lproj/localizedStrings.js:

2021-09-16  Patrick Angle  <pangle@apple.com>

        Web Inspector: Regression(r279613) Audit result scope toggles are missing
        https://bugs.webkit.org/show_bug.cgi?id=230322

        Reviewed by Devin Rousso.

        The sizing calculations modified in r279613 were erroneously applied to both the minimum space calculation as
        well as the navigation item hiding calculations, despite hiding navigation items never being done for non-sidebar
        navigation bars. The logic in `WI.NavigationBar.prototype._calculateMinimumWidth` remains unchanged, as we still
        need sidebars to provide a minimum width that can accommodate all items in a flex layout in order to avoid
        flowing navigation items on to another row. The navigation bar in a sidebar is unique in this respect, as other
        navigation bars will gracefully hide components if they truly don't have enough space, but a sidebar relies on
        getting a minimum size that can actually accommodate all items in a single row.

        * UserInterface/Views/NavigationBar.js:
        (WI.NavigationBar.prototype.layout.calculateVisibleItemWidth):
        (WI.NavigationBar.prototype.layout):

2021-09-16  Patrick Angle  <pangle@apple.com>

        Web Inspector: Don't maintain a back-forward stack for `ContentBrowser`/`ContentViewContainer` when not necessary
        https://bugs.webkit.org/show_bug.cgi?id=230286

        Reviewed by Devin Rousso.

        We currently maintain a back/forward stack for all ContentViewContainers, even if other history entries won't be
        used. Instead, subclasses of ContentBrowserTabContentView should be able to disable the history stack, which
        helps us ensure that outdated content views are not kept around for these subclasses and their views.

        This does not line up one-to-one with views that hide the back/forward buttons, as the back/forward stack is
        used in some places to provide a memory of selection across different views, like in the Graphics tab.

        * UserInterface/Views/AuditTabContentView.js:
        (WI.AuditTabContentView):
        * UserInterface/Views/ConsoleTabContentView.js:
        (WI.ConsoleTabContentView):
        * UserInterface/Views/ContentBrowser.js:
        * UserInterface/Views/ContentBrowserTabContentView.js:
        * UserInterface/Views/ContentViewContainer.js:
        (WI.ContentViewContainer.prototype.showContentView):
        (WI.ContentViewContainer.prototype.replaceContentView):
        * UserInterface/Views/ElementsTabContentView.js:
        (WI.ElementsTabContentView):
        * UserInterface/Views/GraphicsTabContentView.js:
        (WI.GraphicsTabContentView):
        * UserInterface/Views/LayersTabContentView.js:
        (WI.LayersTabContentView):
        * UserInterface/Views/NetworkDetailView.js:
        (WI.NetworkDetailView.prototype.initialLayout):
        * UserInterface/Views/NetworkTabContentView.js:
        (WI.NetworkTabContentView):
        * UserInterface/Views/TimelineRecordingContentView.js:
        (WI.TimelineRecordingContentView):

2021-09-16  Patrick Angle  <pangle@apple.com>

        Web Inspector: `FrameDOMTreeContentView` may update after it has `closed` called, causing hangs on some webpages on reload
        https://bugs.webkit.org/show_bug.cgi?id=230186

        Reviewed by Devin Rousso.

        `FrameDOMTreeContentView` may be `closed` between a call to `_requestRootDOMNode` and the response being
        provided to `_rootDOMNodeAvailable`. This can result in an attempt to select a DOM node in an old and detached
        DOM tree. To combat this, add a flag to `ContentView` to mark a closed `ContentView` as such, and then return
        early from `_rootDOMNodeAvailable` if the `ContentView` is already closed.

        * UserInterface/Views/ContentView.js:
        (WI.ContentView):
        (WI.ContentView.prototype.closed):
        (WI.ContentView.prototype.get isClosed):
        * UserInterface/Views/FrameDOMTreeContentView.js:
        (WI.FrameDOMTreeContentView.prototype._rootDOMNodeAvailable):

2021-09-15  Patrick Angle  <pangle@apple.com>

        Web Inspector: `TreeOutline` should return early when failing to find an ancestor while populating the tree
        https://bugs.webkit.org/show_bug.cgi?id=230287

        Reviewed by Devin Rousso.

        When an ancestor can not be found, we should return to prevent additional work (which will fail) from being done.

        * UserInterface/Views/TreeOutline.js:
        (WI.TreeOutline.prototype.findTreeElement):

2021-09-15  Patrick Angle  <pangle@apple.com>

        Web Inspector: `DOMTreeUpdater` doesn't complete deferred updating/clear updated lists when a node isn't found in the tree
        https://bugs.webkit.org/show_bug.cgi?id=230289

        Reviewed by Devin Rousso.

        Instead of an early return when a tree element can't be found, we should continue on to the next updated node
        and finish out by clearing the collections of updated nodes, otherwise a node that will never be findable again
        will cause extra work to be done on every update.

        * UserInterface/Views/DOMTreeUpdater.js:
        (WI.DOMTreeUpdater.prototype._updateModifiedNodes):

2021-09-13  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Update naming of WI.CSSCompletions callback used for collecting supported CSS properties from the target
        https://bugs.webkit.org/show_bug.cgi?id=230153

        Reviewed by Devin Rousso.

        Rename `WI.CSSCompletions.initializeCSSCompletions.propertyNamesCallback(names)` to `propertiesCallback(properties)` 
        to remove confusion about what the payload actually contains: not a list of property names, but a list of objects with 
        CSS property names, values, aliases, longhands, etc.

        The constructor of `WI.CSSCompletions` expects and handles this payload.

        * UserInterface/Models/CSSCompletions.js:
        (WI.CSSCompletions.initializeCSSCompletions):
        (WI.CSSCompletions.initializeCSSCompletions.propertyNamesCallback): Deleted.

2021-08-27  Russell Epstein  <repstein@apple.com>

        Land Windows build fixes from safari-612.1.29.14-branch.
        https://bugs.webkit.org/show_bug.cgi?id=229627

        Reviewed by Per Arne Vollan.

        * WebInspectorUI.vcxproj/WebInspectorUI.make:
        * WebInspectorUI.vcxproj/WebInspectorUI.proj:

2021-08-26  Patrick Angle  <pangle@apple.com>

        Web Inspector: Rename `ContextualDocumentation*` to `CSSDocumentation` to reduce path length and improve code readability
        https://bugs.webkit.org/show_bug.cgi?id=229525

        Reviewed by Devin Rousso.

        Reduce the length and complexity of naming around the documentation that was added for CSS properties by
        using `CSSDocumentation` to refer to the feature instead of `ContextualDocumentation`.

        * Localizations/en.lproj/localizedStrings.js:
        * Scripts/copy-user-interface-resources.pl:
        * UserInterface/External/CSSDocumentation/CSSDocumentation.js: Renamed from Source/WebInspectorUI/UserInterface/External/ContextualDocumentationDatabase/ContextualDocumentationDatabase.js.
        * UserInterface/External/CSSDocumentation/LICENSE: Renamed from Source/WebInspectorUI/UserInterface/External/ContextualDocumentationDatabase/LICENSE.
        * UserInterface/Main.html:
        * UserInterface/Views/CSSDocumentationPopover.css: Renamed from Source/WebInspectorUI/UserInterface/Views/ContextualDocumentationPopover.css.
        * UserInterface/Views/CSSDocumentationPopover.js: Renamed from Source/WebInspectorUI/UserInterface/Views/ContextualDocumentationPopover.js.
        (WI.CSSDocumentationPopover.prototype._getDocumentationDetails):
        * UserInterface/Views/ComputedStyleSection.css:
        (.computed-style-section .property-trace-item .property :is(.name, .colon, .semicolon, .css-documentation-button)):
        (.sidebar > .panel.details.css-style > .content > .computed .computed-property-item > .property > .content > .css-documentation-button):
        (.sidebar > .panel.details.css-style > .content > .computed .computed-property-item:not(:hover) > .property > .content > .css-documentation-button):
        (.computed-style-section .property-trace-item .property :is(.name, .colon, .semicolon, .contextual-documentation-button)): Deleted.
        (.sidebar > .panel.details.css-style > .content > .computed .computed-property-item > .property > .content > .contextual-documentation-button): Deleted.
        (.sidebar > .panel.details.css-style > .content > .computed .computed-property-item:not(:hover) > .property > .content > .contextual-documentation-button): Deleted.
        * UserInterface/Views/Main.css:
        (.css-documentation-button):
        (.css-documentation-button:active):
        (@media (prefers-color-scheme: dark) .css-documentation-button):
        (.contextual-documentation-button): Deleted.
        (.contextual-documentation-button:active): Deleted.
        (@media (prefers-color-scheme: dark) .contextual-documentation-button): Deleted.
        * UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css:
        (.spreadsheet-style-declaration-editor > .property:not(:hover) > .content > .css-documentation-button,):
        (.spreadsheet-style-declaration-editor > .property:not(:hover) > .content > .contextual-documentation-button,): Deleted.
        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype.update):
        (WI.SpreadsheetStyleProperty.prototype.spreadsheetTextFieldDidCommit):
        (WI.SpreadsheetStyleProperty.prototype.spreadsheetTextFieldDidBlur):
        (WI.SpreadsheetStyleProperty.prototype.willDismissPopover):
        (WI.SpreadsheetStyleProperty.prototype._addCSSDocumentationButton):
        (WI.SpreadsheetStyleProperty.prototype._handleCSSDocumentationButtonClicked):
        (WI.SpreadsheetStyleProperty.prototype._presentCSSDocumentation):
        (WI.SpreadsheetStyleProperty.prototype._addContextualDocumentationButton): Deleted.
        (WI.SpreadsheetStyleProperty.prototype._handleContextualDocumentationButtonClicked): Deleted.
        (WI.SpreadsheetStyleProperty.prototype._presentContextualDocumentation): Deleted.

2021-08-23  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: CSS Changes: changes are not updated live
        https://bugs.webkit.org/show_bug.cgi?id=229153
        <rdar://problem/81989328>

        Reviewed by Devin Rousso.

        Dispatch an event whenever the list of modified styles changes.
        Re-layout the Changes details sidebar panel in response to this event
        to reflect the latest state of the modified styles.

        * UserInterface/Controllers/CSSManager.js:
        (WI.CSSManager.prototype.addModifiedStyle):
        (WI.CSSManager.prototype.removeModifiedStyle):
        * UserInterface/Views/ChangesDetailsSidebarPanel.js:
        (WI.ChangesDetailsSidebarPanel.prototype.attached):
        (WI.ChangesDetailsSidebarPanel.prototype.detached):

2021-08-19  Alex Christensen  <achristensen@webkit.org>

        Remove more non-inclusive language from Source
        https://bugs.webkit.org/show_bug.cgi?id=229230

        Reviewed by Myles C. Maxfield.

        * UserInterface/External/three.js/three.js:
        (return.parseTrackName):
        (parseTrackName):
        * UserInterface/Views/ConsoleMessageView.js:
        (WI.ConsoleMessageView.prototype._formatWithSubstitutionString.styleFormatter):
        (WI.ConsoleMessageView.prototype._formatWithSubstitutionString.isAllowedProperty):
        (WI.ConsoleMessageView.prototype._formatWithSubstitutionString.isWhitelistedProperty): Deleted.
        * UserInterface/Views/DOMTreeElement.js:
        (WI.DOMTreeElement.prototype.populateDOMNodeContextMenu):

2021-08-19  Tim Nguyen  <ntim@apple.com>

        Implement ::backdrop pseudo element
        https://bugs.webkit.org/show_bug.cgi?id=227801

        Reviewed by Antti Koivisto.

        This adds UA styles, RenderTreeBuilder support and WebInspector support for ::backdrop.
        Some imported blink tests now start passing, some still need proper top layer support.

        * UserInterface/Controllers/CSSManager.js:
        (WI.CSSManager.displayNameForPseudoId):

2021-08-17  Devin Rousso  <drousso@apple.com>

        Web Inspector: match the undocked tab bar style when docked bottom/side
        https://bugs.webkit.org/show_bug.cgi?id=212398

        Reviewed by Timothy Hatcher.

        This will avoid confusion when switching from docked to undocked (and vice versa) as the tab
        bar UI will no longer be significantly different.

        * UserInterface/Views/TabBar.js:
        (WI.TabBar):
        (WI.TabBar.prototype.layout):
        (WI.TabBar.prototype.layout.measureWidth):
        (WI.TabBar.prototype._recordTabBarItemSizesAndPositions):
        (WI.TabBar.prototype._applyTabBarItemSizesAndPositions):
        (WI.TabBar.prototype._clearTabBarItemSizesAndPositions):
        (WI.TabBar.prototype._handleMouseDown):
        (WI.TabBar.prototype._handleMouseMoved):
        (WI.TabBar.get horizontalPadding): Deleted.
        (WI.TabBar.prototype._recordTabBarItemSizesAndPositions.add): Deleted.
        * UserInterface/Views/TabBar.css:
        (.tab-bar):
        (body:is(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar): Added.
        (body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar): Added.
        (body:is(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar, body:not(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar): Added.
        (.tab-bar > .tabs > .item):
        (body:is(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs > .item): Added.
        (body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs > .item): Added.
        (.tab-bar > .tabs:not(.calculate-width) > .item:not(.pinned)):
        (.tab-bar > .tabs > .item:nth-child(n + 2 of :not(.hidden)), .tab-bar > .tabs:not(.hide-border-start) > .item:nth-child(1 of :not(.hidden)), .tab-bar > .tabs.dragging-tab > .item.selected):
        (.tab-bar > .tabs:not(.hide-border-end) > .item:nth-last-child(1 of :not(.hidden))):
        (body:is(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
        (body:is(.mac-platform.monterey, .mac-platform.big-sur):not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
        (body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
        (body:is(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Added.
        (body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Added.
        (.tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover, .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover + .item):
        (.tab-bar > .tabs:not(.animating) > .item:last-child:not(.selected, .disabled):hover):
        (body:is(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar > .tabs > .item, body:not(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar > .tabs > .item): Added.
        (body.window-inactive .tab-bar > .tabs > .item):
        (body.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected):
        (.tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected, .tab-bar > .tabs.static-layout:not(.animating.inserting-tab):not(.dragging-tab) > .item:nth-last-child(1 of :not(.pinned)), .tab-bar > .tabs.animating.closing-tab > .item:not(.disabled).selected):
        (body.window-inactive .tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected, body.window-inactive .tab-bar > .tabs.static-layout:not(.animating.inserting-tab):not(.dragging-tab) > .item:nth-last-child(1 of :not(.pinned)), body.window-inactive .tab-bar > .tabs.animating.closing-tab > .item:not(.disabled).selected):
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar, body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar): Added.
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar): Added.
        (@media (prefers-color-scheme: dark) body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar): Added.
        (@media (prefers-color-scheme: dark) body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs > .item): Added.
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
        (@media (prefers-color-scheme: dark) body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Added.
        (@media (prefers-color-scheme: dark) body:not(.mac-platform.monterey, .mac-platform.big-sur) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Added.
        (@media (prefers-color-scheme: dark) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover > .icon):
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar, body:not(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar): Added.
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar > .tabs > .item): Added.
        (@media (prefers-color-scheme: dark) body:not(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar > .tabs > .item): Added.
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Added.
        (@media (prefers-color-scheme: dark) body:not(.mac-platform.monterey, .mac-platform.big-sur).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Added.
        (body.big-sur .tab-bar): Deleted.
        (body:not(.docked) .tab-bar): Deleted.
        (body.big-sur:not(.docked) .tab-bar): Deleted.
        (body:not(.big-sur):not(.docked) .tab-bar): Deleted.
        (body.big-sur:not(.docked).window-inactive .tab-bar, body:not(.big-sur):not(.docked).window-inactive .tab-bar): Deleted.
        (body.docked.window-inactive .tab-bar): Deleted.
        (body.docked.bottom .tab-bar > .border.top): Deleted.
        (body.big-sur.docked .tab-bar > .border.bottom): Deleted.
        (body.docked .tab-bar .tabs): Deleted.
        (body.docked .tab-bar > .tabs > .flexible-space): Deleted.
        (body.docked.bottom .tab-bar > .tabs > .flexible-space): Deleted.
        (body:not(.docked) .tab-bar > .tabs > .item): Deleted.
        (body.big-sur:not(.docked) .tab-bar > .tabs > .item): Deleted.
        (body:not(.big-sur):not(.docked) .tab-bar > .tabs > .item): Deleted.
        (body:not(.docked) .tab-bar > .tabs:not(.calculate-width) > .item:not(.pinned)): Deleted.
        (body.docked .tab-bar > .tabs > .item): Deleted.
        (body:not(.docked) .tab-bar > .tabs > .item:nth-child(n + 3 of :not(.hidden)), body:not(.docked) .tab-bar > .tabs:not(.hide-border-start) > .item:nth-child(2 of :not(.hidden)), .tab-bar > .tabs.dragging-tab > .item.selected): Deleted.
        (body:not(.docked) .tab-bar > .tabs:not(.hide-border-end) > .item:nth-last-child(1 of :not(.hidden))): Deleted.
        (body.docked .tab-bar > .tabs > .item.pinned): Deleted.
        (body.big-sur:not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (body:not(.big-sur):not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (body.docked .tab-bar > .tabs > .item:not(.disabled):matches(.selected, :hover)): Deleted.
        (body.docked .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (body.big-sur:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Deleted.
        (body:not(.big-sur):not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Deleted.
        (body.docked .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Deleted.
        (body:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover, body:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover + .item): Deleted.
        (body:not(.docked) .tab-bar > .tabs:not(.animating) > .item:last-child:not(.selected, .disabled):hover): Deleted.
        (body:not(.docked).window-inactive .tab-bar > .tabs > .item): Deleted.
        (body.big-sur:not(.docked).window-inactive .tab-bar > .tabs > .item, body:not(.big-sur):not(.docked).window-inactive .tab-bar > .tabs > .item): Deleted.
        (body:not(.docked).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (body.docked.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (body:not(.docked) .tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected, body:not(.docked) .tab-bar > .tabs.static-layout:not(.animating.inserting-tab):not(.dragging-tab) > .item:nth-last-child(1 of :not(.pinned)), body:not(.docked) .tab-bar > .tabs.animating.closing-tab > .item:not(.disabled).selected): Deleted.
        (body:not(.docked).window-inactive .tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected, body:not(.docked).window-inactive .tab-bar > .tabs.static-layout:not(.animating.inserting-tab):not(.dragging-tab) > .item:nth-last-child(1 of :not(.pinned)), body:not(.docked).window-inactive .tab-bar > .tabs.animating.closing-tab > .item:not(.disabled).selected): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur .tab-bar, body:not(.big-sur) .tab-bar): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur:not(.docked) .tab-bar): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked) .tab-bar): Deleted.
        (@media (prefers-color-scheme: dark) body.docked .tab-bar): Deleted.
        (@media (prefers-color-scheme: dark) body.docked.bottom .tab-bar > .border.top): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked) .tab-bar > .tabs > .item): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur:not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Deleted.
        (@media (prefers-color-scheme: dark) body.docked .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Deleted.
        (@media (prefers-color-scheme: dark) body.docked .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (@media (prefers-color-scheme: dark) body.docked.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover > .icon): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.docked).window-inactive .tab-bar): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur:not(.docked).window-inactive .tab-bar, body:not(.big-sur):not(.docked).window-inactive .tab-bar): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur:not(.docked).window-inactive .tab-bar > .tabs > .item): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked).window-inactive .tab-bar > .tabs > .item): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur:not(.docked).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.big-sur):not(.docked).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
        * UserInterface/Views/TabBarItem.js:
        (WI.TabBarItem.get horizontalMargin): Deleted.
         - remove the flexible space filler elements (and associated CSS) before and after the tabs
         - remove any `.docked` CSS
         - remove the (now unnecessary) `:not(.docked)` from all CSS related to the `WI.TabBar`
         - replace `.big-sur` with `.mac-platform.big-sur` for clarity
         - add `.mac-platform.monterey` alongside any `.mac-platform.big-sur`

        * UserInterface/Base/Main.js:
        (WI.undockedTitleAreaHeight):
        * UserInterface/Views/Main.css:
        (body:is(.mac-platform.monterey, .mac-platform.big-sur) #undocked-title-area): Added.
        (body:not(.mac-platform.monterey, .mac-platform.big-sur) #undocked-title-area): Added.
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur) #undocked-title-area): Added.
        (@media (prefers-color-scheme: dark) body:not(.mac-platform.monterey, .mac-platform.big-sur) #undocked-title-area): Added.
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur).window-inactive #undocked-title-area): Added.
        (@media (prefers-color-scheme: dark) body:not(.mac-platform.monterey, .mac-platform.big-sur).window-inactive #undocked-title-area): Added.
        (body.big-sur #undocked-title-area): Deleted.
        (body:not(.big-sur) #undocked-title-area): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur #undocked-title-area): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.big-sur) #undocked-title-area): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur.window-inactive #undocked-title-area): Deleted.
        (@media (prefers-color-scheme: dark) body:not(.big-sur).window-inactive #undocked-title-area): Deleted.
        * UserInterface/Views/Variables.css:
        (body:is(.mac-platform.monterey, .mac-platform.big-sur)): Added.
        (body:not(.mac-platform.monterey, .mac-platform.big-sur):not(.docked)): Added.
        (body:is(.mac-platform.monterey, .mac-platform.big-sur):not(.docked)): Added.
        (@media (prefers-color-scheme: dark) body:is(.mac-platform.monterey, .mac-platform.big-sur)): Added.
        (body.big-sur): Deleted.
        (body.mac-platform:not(.big-sur):not(.docked)): Deleted.
        (body.mac-platform.big-sur:not(.docked)): Deleted.
        (@media (prefers-color-scheme: dark) body.big-sur): Deleted.
        Add support for macOS Monterey.

2021-08-17  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Do not show contextual documentation popup in the Changes panel
        https://bugs.webkit.org/show_bug.cgi?id=229001
        <rdar://problem/81792379>

        Reviewed by Devin Rousso.

        Add config option to WI.SpreadsheetStyleProperty to prevent showing a contextual documentation button.

        * UserInterface/Views/ChangesDetailsSidebarPanel.js:
        (WI.ChangesDetailsSidebarPanel.prototype._createRuleElement.onEach):
        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype._addContextualDocumentationButton):

2021-08-12  Patrick Angle  <pangle@apple.com>

        Web Inspector: Adding execution contexts after page load doesn't show a hidden execution selector
        https://bugs.webkit.org/show_bug.cgi?id=229053

        Reviewed by Devin Rousso.

        Add a handler for execution contexts being added to update the display of the execution context list, as when
        there is only a single context at page load the dropdown will be hidden and thus needs to be shown when an
        execution context is added after page load.

        * UserInterface/Views/QuickConsole.js:
        (WI.QuickConsole):
        (WI.QuickConsole.prototype._handleFrameExecutionContextAdded):

2021-08-12  Nikita Vasilyev  <nvasilyev@apple.com>

        REGRESSION (r271348): Web Inspector: Table headers have vertical scrollbar
        https://bugs.webkit.org/show_bug.cgi?id=228671
        <rdar://problem/81638278>

        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  <soniasingla.1812@gmail.com>

        Web Inspector: Add standard logical properties to CSS keyword completion
        https://bugs.webkit.org/show_bug.cgi?id=228548

        Reviewed by Devin Rousso.

        * UserInterface/Models/CSSKeywordCompletions.js:

2021-08-02  Patrick Angle  <pangle@apple.com>

        Web Inspector: [AppleWin] Speculative internal build fix for copying `InspectorBackendCommands.js`
        https://bugs.webkit.org/show_bug.cgi?id=228716

        Reviewed by Maciej Stachowiak.

        Speculative fix for AppleWin port internal build by using the correct directory for JSC headers. Also update the
        logging message to reflect that the file will by copied later in the build.

        * WebInspectorUI.vcxproj/WebInspectorUI.make:
        * WebInspectorUI.vcxproj/build-webinspectorui.pl:

2021-08-02  Nikita Vasilyev  <nvasilyev@apple.com>

        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  <qiaosong_zhou@apple.com>

        FormDataEvent added. 
        https://bugs.webkit.org/show_bug.cgi?id=227718

        Reviewed by Chris Dumez.

        * UserInterface/Models/ScriptTimelineRecord.js:
        (WI.ScriptTimelineRecord.EventType.displayName):

2021-07-19  Nikita Vasilyev  <nvasilyev@apple.com>

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

        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  <pangle@apple.com>

        Web Inspector: Elements: selecting a sibling node in the breadcrumb navigation doesn't do anything
        https://bugs.webkit.org/show_bug.cgi?id=227893

        Reviewed by Devin Rousso.

        The `WI.HierarchicalPathComponent.Event.Clicked` event is only fired when there are no sibling path components
        to select, therefor we must also listen for the `WI.HierarchicalPathComponent.Event.SiblingWasSelected` event to
        be able to then reveal and highlight the correct DOM node in the tree.

        * UserInterface/Views/DOMTreeContentView.js:
        (WI.DOMTreeContentView.prototype.get selectionPathComponents):
        (WI.DOMTreeContentView.prototype._handlePathComponentSelected):
        Drive-by to match our style of `_handle*` event handler naming.

2021-07-19  Patrick Angle  <pangle@apple.com>

        Web Inspector: Add another Protocol Version (iOS 15.0)
        https://bugs.webkit.org/show_bug.cgi?id=228079

        Reviewed by Devin Rousso.

        * UserInterface/Protocol/Legacy/15.0/InspectorBackendCommands.js: Added.
        * Versions/Inspector-iOS-15.0.json: Added.

2021-07-15  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Regression (r278607) Jump to CSS variable declaration from Computed panel not working
        https://bugs.webkit.org/show_bug.cgi?id=227811
        <rdar://problem/80339360>

        Reviewed by Devin Rousso.

        When attempting to highlight a hidden unused CSS variable, use the same method to identify a corresponding WI.CSSProperty
        as used with other CSS property types. The method checks the canonical property name instead of strict object equality.

        When a CSS variable is shown in the Computed panel, its corresponding WI.CSSProperty instance has slightly different
        properties than the WI.CSSProperty used in the Styles panel. The instances are generated by different calls to
        WI.DOMNodeStyles._parseStylePropertyPayload(), one for the payload of matching styles and another for computed styles.

        * UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js:
        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.highlightProperty.propertiesMatch):
        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.highlightProperty.hasMatchingLonghandProperty):
        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.highlightProperty):

2021-07-14  Devin Rousso  <drousso@apple.com>

        Implement Array.prototype.findLast and Array.prototype.findLastIndex
        https://bugs.webkit.org/show_bug.cgi?id=227939

        Reviewed by Yusuke Suzuki.

        * UserInterface/Models/NativeFunctionParameters.js:

2021-07-12  Patrick Angle  <pangle@apple.com>

        Web Inspector: REGRESSION(r279510): Elements: Computed: an (i) button is shown for computed property traces
        https://bugs.webkit.org/show_bug.cgi?id=227892

        Reviewed by Devin Rousso.

        Property traces need to opt out of displaying the (i) button as they do for things like the colon and semicolon.

        * UserInterface/Views/ComputedStyleSection.css:
        (.computed-style-section .property-trace-item .property .name,):

2021-07-12  Commit Queue  <commit-queue@webkit.org>

        Unreviewed, reverting r279493.
        https://bugs.webkit.org/show_bug.cgi?id=227878

        Web Inspector: Can't reveal local overrides in the sidebar if
        lots of scripts are visible

        Reverted changeset:

        "Web Inspector: [Regression: r279271] Sources: Breakpoints
        section in navigation sidebar disappears when Web Inspector
        becomes taller than 650px"
        https://bugs.webkit.org/show_bug.cgi?id=227597
        https://commits.webkit.org/r279493

2021-07-09  Patrick Angle  <pangle@apple.com>

        Web Inspector: Perform sidebar panel and navigation bar layout asynchronously during resize
        https://bugs.webkit.org/show_bug.cgi?id=227716

        Reviewed by Devin Rousso.

        Perform layout updates to the navigation bar and selected panel asynchronously so that they can be batched
        together, instead of blocking on layout for each resize (of which there will be many during a dragging resize).

        * UserInterface/Views/SingleSidebar.js:
        (WI.SingleSidebar.prototype._recalculateWidth):

2021-07-06  Patrick Angle  <pangle@apple.com>

        Web Inspector: Elements Tab Details Sidebar navigation items sometime wrap to a second line
        https://bugs.webkit.org/show_bug.cgi?id=227707

        Reviewed by Devin Rousso.

        When resizing a sidebar, it was possible that the cumulative widths of each navigation item could add up to just
        less than the actual amount of space necessary to lay out each item in a single row, leading to wrapping items
        to the next line. This resolves that issue by taking the ceiling of each item's width when calculating the
        total amount of space needed to display all the items. Additionally, every time a panel is added or removed from
        the sidebar, we need to recalculate the width of the sidebar to make sure the new navigation item, or the
        removal thereof, is accommodated.

        * UserInterface/Views/NavigationBar.js:
        (WI.NavigationBar.prototype.layout.calculateVisibleItemWidth):
        (WI.NavigationBar.prototype._calculateMinimumWidth):
        * UserInterface/Views/SingleSidebar.js:
        (WI.SingleSidebar.prototype.didInsertSidebarPanel):
        (WI.SingleSidebar.prototype.didRemoveSidebarPanel):

2021-07-02  Harshil Ratnu  <hratnu@apple.com>

        Web Inspector: add contextual documentation for CSS properties
        https://bugs.webkit.org/show_bug.cgi?id=226883

        Reviewed by Devin Rousso.

        Overview: Add contextual documentation for all supported CSS properties in Styles and Computed panel within Web 
        Inspector.
        Details: Add an info button which appears next to the property field on Hover. Clicking on the info button shows
        a popover with the documentation for the property. Tabbing out or clicking anywhere other than the value field 
        dismisses the popover.
        Architecture: Add a ContextualDocumentationButton in SpreadsheetStyleProperty and append that to the end of the 
        property content. This Button, when clicked, creates an instance of the ContextualDocumentation.js which will 
        search the ContextualDocumentationDB to find the related property and it's relevant details. Embed these details
        in an instance of Popover.js and present next to the associated propertyName.

        * Localizations/en.lproj/localizedStrings.js:
        * Scripts/copy-user-interface-resources.pl:
        Add details for the ContextualDocumentationDatabase from External Folder to build properly.

        * UserInterface/Base/Setting.js:
        Add setting to show syntax in documentation popover and define default state as false.

        * UserInterface/External/ContextualDocumentationDatabase/ContextualDocumentationDatabase.js: Added.
        * UserInterface/External/ContextualDocumentationDatabase/LICENSE: Added.
        * UserInterface/Images/InfoIcon.svg: Added.
        * UserInterface/Main.html:
        Add and link new files.

        * UserInterface/Views/ComputedStyleDetailsPanel.css:
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-variables .property .go-to-arrow):
        (.sidebar > .panel.details.css-style > .content > .computed > .details-section.computed-style-variables .property:not(:hover) .go-to-arrow):
        Remove absolute positioning from go-to-arrow button to align it with rest of the text in line and style it 
        similar to contextual-documentation-button. 
        (.sidebar > .panel.details.css-style > .content > .computed .property .go-to-arrow): Deleted.
        (.sidebar > .panel.details.css-style > .content > .computed .property:not(:hover) .go-to-arrow): Deleted.
        Change hover area to include white space on the side of computed variables.

        * UserInterface/Views/ComputedStyleSection.css:
        (.sidebar > .panel.details.css-style > .content > .computed .computed-property-item > .property .go-to-arrow):
        (.sidebar > .panel.details.css-style > .content > .computed .computed-property-item:not(:hover) > .property .go-to-arrow):
        (.sidebar > .panel.details.css-style > .content > .computed .computed-property-item > .property > .content > .contextual-documentation-button):
        (.sidebar > .panel.details.css-style > .content > .computed .computed-property-item:not(:hover) > .property > .content > .contextual-documentation-button):
        Add unifrom styling for go-to-arrow button and contextual-documentation-button for computed properties.

        * UserInterface/Views/ContextualDocumentationPopover.css: Added.
        (.popover .documentation-popover-content):
        (.popover .documentation-popover-content > p):
        (.popover .documentation-popover-content > .name-header):
        (.popover .documentation-popover-content > .syntax):
        (.popover .documentation-popover-content > .syntax > .syntax-title):
        (.popover .documentation-popover-content > .reference-link):
        * UserInterface/Views/ContextualDocumentationPopover.js: Added.
        (WI.ContextualDocumentationPopover):
        (WI.ContextualDocumentationPopover.prototype.show):
        (WI.ContextualDocumentationPopover.prototype._presentOverTargetElement):
        (WI.ContextualDocumentationPopover.prototype._getDocumentationDetails):
        (WI.ContextualDocumentationPopover.prototype._createDocumentationElement):
        Add new class that extends Popover.js and  handles fetching the values from VS Code documentation, puts relevant
        information in the popover and presents the popover when the documentation-button is clicked.

        * UserInterface/Views/Main.css:
        (.contextual-documentation-button):
        (.contextual-documentation-button:active):
        (@media (prefers-color-scheme: dark) .contextual-documentation-button):
        Add general styling for contextualDocumentationButton.

        * UserInterface/Views/SettingsTabContentView.js:
        (WI.SettingsTabContentView.prototype._createElementsSettingsView):
        Add a new setting in Elements Tab to show syntax.

        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype.willDismissPopover):
        Add a method - willDismissPopover to handle changes when the documentation popover is about to dismiss.
        (WI.SpreadsheetStyleProperty.prototype.update):
        (WI.SpreadsheetStyleProperty.prototype.spreadsheetTextFieldDidCommit):
        (WI.SpreadsheetStyleProperty.prototype.spreadsheetTextFieldDidBlur):
        (WI.SpreadsheetStyleProperty.prototype._addContextualDocumentationButton):
        Add a method which gets called for all property fields and also gets called when property name is changed and
        updated by clicking out of the property name field or tabbing into the next value field and is responsible for
        adding the info button add the end of the property.
        (WI.SpreadsheetStyleProperty.prototype._handleContextualDocumentationButtonClicked):
        (WI.SpreadsheetStyleProperty.prototype._presentContextualDocumentation):
        Add a method which creates an instance of the ContextualDocumentationPopover.js class and shows it.

2021-07-02  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Styles: should autocomplete `var()` and `attr()` values
        https://bugs.webkit.org/show_bug.cgi?id=227098
        <rdar://problem/79418247>

        Reviewed by Devin Rousso.

        Add support for completion suggestions in the Styles details sidebar panel
        for CSS Variables for use with var() and DOM node attributes for use with attr().

        * UserInterface/Models/CSSCompletions.js:
        (WI.CSSCompletions.prototype.addValues):
        * UserInterface/Models/CSSKeywordCompletions.js:
        * UserInterface/Models/DOMNodeStyles.js:
        (WI.DOMNodeStyles):
        (WI.DOMNodeStyles.prototype.get allCSSVariables):
        (WI.DOMNodeStyles.prototype._updateStyleCascade):
        (WI.DOMNodeStyles.prototype._collectCSSVariables):
        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype.getFunctionValueCompletions):
        (WI.SpreadsheetStyleProperty.prototype._valueCompletionDataProvider):

2021-07-01  Patrick Angle  <pangle@apple.com>

        Web Inspector: [Regression: r279271] Sources: Breakpoints section in navigation sidebar disappears when Web Inspector becomes taller than 650px
        https://bugs.webkit.org/show_bug.cgi?id=227597

        Reviewed by Devin Rousso.

        As of r279271, flex base size is no longer clamped by max-height. As a result the non-clamped element
        (`resources-container`) was sized to the full height of the container, leaving no space for the other sections
        to be shown. Removing the `height: 100%;` declaration resolves this by allowing the flex container to lay out
        its children as needed. Because the resources container has no maximum height constraint, it still occupies the
        remaining height of the container. Each container will also continue to shrink/grow at their prescribed ratio
        just as they did before r279271.

        * UserInterface/Views/SourcesNavigationSidebarPanel.css:
        (@media (min-height: 650px) .sidebar > .panel.navigation.sources > .content > :matches(.call-stack-container, .breakpoints-container, .resources-container, .local-overrides-container)):

2021-06-30  Patrick Angle  <pangle@apple.com>

        Web Inspector: Styles: Autocomplete should support function completions
        https://bugs.webkit.org/show_bug.cgi?id=227097

        Reviewed by Devin Rousso.

        Covered by new test:
        - inspector/unit-tests/css-keyword-completions.html

        Add support for completing autocompleting values as part of a CSS function in the Styles sidebar panel.
        
        * UserInterface/Models/CSSKeywordCompletions.js:
        (WI.CSSKeywordCompletions.forPartialPropertyName):
        (WI.CSSKeywordCompletions.forPartialPropertyValue):
        Tokenize the provided partial value text to correct provide completion for functions, like `env(`.

        * UserInterface/Views/SpreadsheetStyleProperty.js:
        (WI.SpreadsheetStyleProperty.prototype._nameCompletionDataProvider):
        (WI.SpreadsheetStyleProperty.prototype._valueCompletionDataProvider):
        Moved logic to `WI.CSSKeywordCompletions`.

2021-06-25  Patrick Angle  <pangle@apple.com>

        Web Inspector: Sources: Scope Chain sidebar panel is stripping repeating whitespace from strings
        https://bugs.webkit.org/show_bug.cgi?id=227234

        Reviewed by Devin Rousso.

        String and Regular Expression values in Object Trees were having `white-space: nowrap;` applied to them, which
        was redundant because `white-space: pre;` was already defined for `.formatted-string` and `.formatted-regexp`,
        which makes sure that the text does not wrap unless it contains a newline, and these previews have newlines
        replaced with a Unicode symbol to visually represent a newline without breaking to a new line.

        * UserInterface/Views/ObjectTreeView.css:
        (.object-tree-property :matches(.formatted-string, .formatted-regexp)): Deleted.

2021-06-14  Patrick Angle  <pangle@apple.com>

        [REGRESSION: r276616] Uncaught Exception: TypeError: undefined is not an object (evaluating 'this._setupCodeMirror.getValue')
        https://bugs.webkit.org/show_bug.cgi?id=226995

        Reviewed by Devin Rousso.

        Audit test groups share a single setup editor for all their test cases, leaving individual test cases without
        their own setup editor. In this case, we should not attempt to save the setup script for every test, and instead
        allow the instance of `AuditTestGroupContentView` that does have a setup editor to save the script.

        * UserInterface/Views/AuditTestContentView.js:
        (WI.AuditTestContentView.prototype.saveEditedData):

2021-06-11  Patrick Angle  <pangle@apple.com>

        Web Inspector: Add instrumentation to node destruction for InspectorDOMAgent
        https://bugs.webkit.org/show_bug.cgi?id=226624

        Reviewed by Devin Rousso.

        Listen for the new `DOM.willDestroyDOMNode` event in order to cleanup and remaining references to that Node.
        This work serves as a prelude to <https://webkit.org/b/189687> (Web Inspector: preserve DOM.NodeId if a node is
        removed and re-added) to eventually only forget about nodes upon destruction, instead of removal from the DOM
        tree.

        * UserInterface/Controllers/DOMManager.js:
        (WI.DOMManager.prototype.willDestroyDOMNode):
        * UserInterface/Protocol/DOMObserver.js:
        (WI.DOMObserver.prototype.willDestroyDOMNode):
        * UserInterface/Views/DOMTreeUpdater.js:
        (WI.DOMTreeUpdater.prototype._nodeRemoved):

2021-06-08  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Styles panel slow to render when inspecting node with many inherited CSS variables
        https://bugs.webkit.org/show_bug.cgi?id=225972
        <rdar://problem/78211185>

        Reviewed by Devin Rousso.

        Do not show unused inherited CSS variables in the Styles details sidebar.

        When aggregating styles for the selected node in `WI.DOMNodeStyles`, collect a list of names of CSS variables used in CSS property values.
        In the Styles details sidebar, skip rendering declarations of inherited CSS variables that are not found in this list.

        Always show inherited variables that are used, either directly inherited or via reference (variables using other variables in their value).
        Always show inherited variables used as values of inheritable properties like color, font-size, etc.

        When a CSS rule contains hidden inherited variables, offer a button to request disclosing them for that rule.
        Option-click to show unused inherited variables in all matching rules.

        Clicking the "Go to variable" button automatically renders all the unused variables in the CSS rule where the target variable is declared.

        * Localizations/en.lproj/localizedStrings.js:
        * UserInterface/Models/CSSProperty.js:
        (WI.CSSProperty.findVariableNames):
        * UserInterface/Models/DOMNodeStyles.js:
        (WI.DOMNodeStyles):
        (WI.DOMNodeStyles.prototype.get usedCSSVariables):
        (WI.DOMNodeStyles.prototype._updateStyleCascade):
        (WI.DOMNodeStyles.prototype._collectUsedCSSVariables):
        * UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css:
        (.spreadsheet-style-declaration-editor .property):
        (.spreadsheet-style-declaration-editor > .hidden-variables-button):
        * UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js:
        (WI.SpreadsheetCSSStyleDeclarationEditor):
        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.layout):
        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.get propertiesToRender):
        (WI.SpreadsheetCSSStyleDeclarationEditor.prototype.highlightProperty):
        * UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.js:
        (WI.SpreadsheetCSSStyleDeclarationSection.prototype.set propertyVisibilityMode):
        (WI.SpreadsheetCSSStyleDeclarationSection.prototype.spreadsheetCSSStyleDeclarationEditorSetAllPropertyVisibilityMode):
        * UserInterface/Views/SpreadsheetRulesStyleDetailsPanel.js:
        (WI.SpreadsheetRulesStyleDetailsPanel.prototype.spreadsheetCSSStyleDeclarationSectionSetAllPropertyVisibilityMode):

2021-06-04  Devin Rousso  <drousso@apple.com>

        Web Inspector: cannot see experimental settings when inspecting `ServiceWorker`
        https://bugs.webkit.org/show_bug.cgi?id=226666

        Reviewed by Joseph Pecoraro.

        * UserInterface/Views/SettingsTabContentView.js:
        (WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
        There are experimental settings that have nothing to do with preview features or CSS. Don't
        limit the Experimental pane to only if those things exist.

2021-06-04  Devin Rousso  <drousso@apple.com>

        Web Inspector: Uncaught Exception: undefined is not an object (evaluating 'InspectorBackend.Enum.Page.ResourceType')
        https://bugs.webkit.org/show_bug.cgi?id=226664

        Reviewed by Joseph Pecoraro.

        * UserInterface/Protocol/InspectorBackend.js:
        (InspectorBackendClass.prototype.get Enum):
        Use the list of all registered domains, not just the active domains, as only commands/events
        are able to be filtered by target type.

2021-05-15  Said Abou-Hallawa  <said@apple.com>

        Implement CanvasRenderingContext2D.createConicGradient
        https://bugs.webkit.org/show_bug.cgi?id=225539

        Reviewed by Sam Weinig.

        * UserInterface/Models/NativeFunctionParameters.js:
        * UserInterface/Models/Recording.js:
        (WI.Recording.prototype.async swizzle):
        * UserInterface/Views/RecordingActionTreeElement.js:
        (WI.RecordingActionTreeElement._classNameForAction):

2021-05-10  Devin Rousso  <drousso@apple.com>

        Web Inspector: Network: rename "XHR" to "XHR/Fetch"
        https://bugs.webkit.org/show_bug.cgi?id=224900

        Reviewed by Timothy Hatcher.

        * UserInterface/Views/NetworkTableContentView.js:
        (WI.NetworkTableContentView):
        (WI.NetworkTableContentView.addScopeBarItem): Added.
        (WI.NetworkTableContentView.displayNameForResource):
        (WI.NetworkTableContentView.shortDisplayNameForResourceType): Deleted.

        * Localizations/en.lproj/localizedStrings.js:

2021-05-10  Nikita Vasilyev  <nvasilyev@apple.com>

        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
        <rdar://problem/77590883>

        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.

2021-05-10  Devin Rousso  <drousso@apple.com>

        Web Inspector: add support for panning/zooming on images
        https://bugs.webkit.org/show_bug.cgi?id=224655

        Reviewed by Timothy Hatcher.

        * UserInterface/Controllers/GestureController.js: Added.
        (WI.GestureController):
        (WI.GestureController.prototype.get scale):
        (WI.GestureController.prototype.set scale):
        (WI.GestureController.prototype.get translate):
        (WI.GestureController.prototype.set translate):
        (WI.GestureController.prototype.reset):
        (WI.GestureController.prototype._startScaleInteraction):
        (WI.GestureController.prototype._updateScaleInteraction):
        (WI.GestureController.prototype._endScaleInteraction):
        (WI.GestureController.prototype._handleWheel):
        (WI.GestureController.prototype._handleGestureStart):
        (WI.GestureController.prototype._handleGestureChange):
        (WI.GestureController.prototype._handleGestureEnd):
        (WI.GestureController.prototype._handleMouseDown):
        (WI.GestureController.prototype._handleMouseMove):
        (WI.GestureController.prototype._handleMouseUp):
        Add a general controller class that takes a `target` (and optionally a `container`) and adds
        event listeners to handle various gestures:
         - scale (both via trackpad and mouse wheel)
         - transform (mouse click and drag)

        * UserInterface/Views/ImageResourceContentView.js:
        (WI.ImageResourceContentView):
        (WI.ImageResourceContentView.prototype.get navigationItems):
        (WI.ImageResourceContentView.prototype.contentAvailable):
        (WI.ImageResourceContentView.prototype.gestureControllerDidScale): Added.
        (WI.ImageResourceContentView.prototype.gestureControllerDidTranslate): Added.
        (WI.ImageResourceContentView.prototype._updateResetGestureButtonNavigationItemLabel): Added.
        (WI.ImageResourceContentView.prototype._handleResetGestureButtonNavitationItemClicked): Added.
        (WI.ImageResourceContentView.prototype._handleZoomOutGestureButtonNavitationItemClicked): Added.
        (WI.ImageResourceContentView.prototype._handleZoomInGestureButtonNavitationItemClicked): Added.
        * UserInterface/Views/ImageResourceContentView.css:
        (.content-view.resource.image > .img-container):
        (.navigation-bar > .item.image-gesture-reset): Added.
        Add a `WI.GestureController` and manipulate the `scale` and `transform` of the `<img>`.
        Add navigation items that show the current scale (clicking it will reset the gesture), zoom
        in, and zoom out.

        * UserInterface/Views/LocalResourceOverrideLabelView.css:
        (.local-resource-override-label-view):
        Add a `z-index` so that zoomed images don't appear on top.

        * UserInterface/Views/ResourceCollectionContentView.js:
        (WI.ResourceCollectionContentView.prototype.get contentViewConstructorOptions):
        Don't create the `WI.GestureController` in collection views.

        * UserInterface/Main.html:
        * UserInterface/Images/ZoomIn.svg: Added.
        * UserInterface/Images/ZoomOut.svg: Added.
        * Localizations/en.lproj/localizedStrings.js:

2021-05-07  Patrick Angle  <pangle@apple.com>

        Web Inspector: Breakpoint action add/remove buttons are not vertically aligned with action dropdown
        https://bugs.webkit.org/show_bug.cgi?id=225543

        Reviewed by Devin Rousso.

        Change the breakpoint action add/remove button's `margin-top` to `margin-block-start`, and adjust the value to
        properly vertically center the buttons with the action type menu.

        * UserInterface/Views/BreakpointActionView.css:
        (:matches(.breakpoint-action-append-button, .breakpoint-action-remove-button)):

2021-05-07  Patrick Angle  <pangle@apple.com>

        Web Inspector: Default source for new test cases is minified
        https://bugs.webkit.org/show_bug.cgi?id=225546

        Reviewed by Devin Rousso.

        Move the placeholder test code to `WI.DefaultAudits` as part of the non-minified sources so that new audit test
        cases do not have their default placeholder script minified. This also allows us to remove
        `WI.AuditTestCase.stringifyFunction` as it is no longer needed.

        * UserInterface/Models/AuditTestCase.js:
        (WI.AuditTestCase.stringifyFunction): Deleted.
        * UserInterface/NonMinified/DefaultAudits.js:
        (WI.DefaultAudits.newAuditPlaceholder):
        * UserInterface/Views/CreateAuditPopover.js:
        (WI.CreateAuditPopover.prototype.dismiss):
        (WI.CreateAuditPopover.prototype.dismiss.const.placeholderTestFunction): Deleted.

2021-05-04  Devin Rousso  <drousso@apple.com>

        Web Inspector: add assertion for `WI.View` re-entrancy
        https://bugs.webkit.org/show_bug.cgi?id=224678

        Reviewed by Joseph Pecoraro.

        Add `console.assert` (which are removed from production builds) around each critical
        `WI.View` subclass member function to prevent reentrancy.
         - `initialLayout`
         - `sizeDidChange`
         - `layout`
         - `didLayoutSubtree`
        This is important because `WI.View.prototype._layoutSubtree` sets any related state after
        calling any of the above (e.g. `_didInitialLayout` after `initialLayout`), meaning that any
        checks for the related state (which sometimes control whether the function is called, such
        as in the case of `initialLayout`) would think that the function hadn't been called yet. See
        r276170 for an example of how this can happen and the potential problems it can cause.

        * UserInterface/Views/View.js:
        (WI.View.prototype._layoutSubtree):

        * UserInterface/Base/Utilities.js:
        (WI.setReentrantCheck): Added.
        (WI.clearReentrantCheck): Added.

2021-05-04  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Sources: Inconsistent selection in source tree when grouped by path
        https://bugs.webkit.org/show_bug.cgi?id=225317

        Reviewed by Devin Rousso.

        Ensure origin tree elements for different domains in the Sources Tab behave as folder tree elements
        in that they can be individually selected without triggering rendering of any resource.

        In essence, restore behavior prior to https://trac.webkit.org/changeset/248912/webkit

        The only exception is for document resources. Clicking on the origin tree element associated with a document resource,
        triggers rendering of the corresponding document.

        * UserInterface/Views/OriginTreeElement.js:
        (WI.OriginTreeElement):
        * UserInterface/Views/SourcesNavigationSidebarPanel.js:
        (WI.SourcesNavigationSidebarPanel.prototype._addResource):

2021-04-28  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: CSS Grid - measure usage of grid overlay options
        https://bugs.webkit.org/show_bug.cgi?id=225060
        <rdar://75843294>

        Reviewed by BJ Burg.

        Add telemetry instrumentation to track grid overlay configurations and time spent using them.

        * UserInterface/Base/Main.js:
        (WI.contentLoaded):
        * UserInterface/Controllers/GridOverlayConfigurationDiagnosticEventRecorder.js: Added.
        (WI.GridOverlayConfigurationDiagnosticEventRecorder):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.get eventSamplingInterval):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype.setup):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype.teardown):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._handleGridOverlayShown):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._handleGridOverlayHidden):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype.handleEvent):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._startEventSamplingTimer):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._stopEventSamplingTimer):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._sampleCurrentOverlayConfiguration):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._didObserveUserInteraction):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._handleWindowFocus):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._handleWindowBlur):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._handleWindowKeyDown):
        (WI.GridOverlayConfigurationDiagnosticEventRecorder.prototype._handleWindowMouseDown):
        * UserInterface/Controllers/OverlayManager.js:
        (WI.OverlayManager.prototype.hasVisibleGridOverlays):
        * UserInterface/Main.html:

2021-04-27  Patrick Angle  <pangle@apple.com>

        Web Inspector: Rename "Open in New Tab" context menu item to "Open in New Window"
        https://bugs.webkit.org/show_bug.cgi?id=225125

        Reviewed by BJ Burg.

        Update the context menu item label, as the "Open in..." context menu item opens the target item in a new window,
        not a new tab.

        * Localizations/en.lproj/localizedStrings.js:
        * UserInterface/Views/ContextMenuUtilities.js:
        (WI.appendContextMenuItemsForURL):

2021-04-27  Patrick Angle  <pangle@apple.com>

        Web Inspector: Default Audits script are minified in release builds
        https://bugs.webkit.org/show_bug.cgi?id=225009

        Reviewed by BJ Burg.

        Covered by new test:
        - inspector/audit/non-minified-default-audits.html

        The default audits have been moved out of `AuditManager.js` and into a special `DefaultAudits.js` in the new
        `NonMinified` directory, which contains JavaScript sources that should be included in `Main.js` and
        `TestCombined.js`, but should not have whitespace stripped from their contents because the whitespace is
        important to the script. For example, the source for the default audits are visible to the user, and therefore
        we want to present well-formatted source in those contexts.

        * Scripts/combine-resources.pl:
        - Added `NonMinified` directory to list of default `inputDirectoryPattern` exceptions for combining resources.
        - Added `--skip-concatenate-tag` so that we don't add tags for script we will eventually append to another script.
        * Scripts/copy-user-interface-resources.pl:
        - Handle `NonMinified` directory for sources that will be appended to Main.js, but should not be minified.
        - Handle `NonMinified` directory for sources that will be appended to TestCombined.js.
        (combineOrStripResourcesForWebKitAdditions):
        - Drive-by fix for typo in combineOrStripResourcesForWebKitAdditions that caused errors to be emitted during builds.
        * UserInterface/Controllers/AuditManager.js:
        (WI.AuditManager.prototype._addDefaultTests):
        (WI.AuditManager):
        (WI.AuditManager.prototype._addDefaultTests.const.levelPass): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.levelWarn): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.levelFail): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.levelError): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.levelUnsupported): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.dataDOMNodes): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.dataDOMAttributes): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.dataErrors): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.dataCustom): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getElementsByComputedRole): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getActiveDescendant): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getChildNodes): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getComputedProperties): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getControlledNodes): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getFlowedNodes): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getMouseEventNode): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getOwnedNodes): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getParentNode): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getSelectedChildNodes): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.hasEventListeners): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.hasEventListenersClick): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getResources): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.getResourceContent): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.unsupported): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.hasChildWithRole): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testMenuRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testGridRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testForAriaLabelledBySpelling): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testForMultipleBanners): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testForLinkLabels): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testRowGroupRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testTableRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testForMultipleLiveRegions): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testListBoxRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testImageLabels): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testForAriaHiddenFalse): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testTreeRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testRadioGroupRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testFeedRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testTabListRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testButtonLabels): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testRowRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testListRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testComboBoxRoleForRequiredChildren): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testForMultipleMainContentSections): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testDialogsForLabels): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.const.testForInvalidAriaHiddenValue): Deleted.
        (WI.AuditManager.prototype._addDefaultTests.removeWhitespace): Deleted.
        * UserInterface/Main.html:
        * UserInterface/NonMinified/DefaultAudits.js: Added.
        (WI.DefaultAudits.levelPass):
        (WI.DefaultAudits.levelWarn):
        (WI.DefaultAudits.levelFail):
        (WI.DefaultAudits.levelError):
        (WI.DefaultAudits.levelUnsupported):
        (WI.DefaultAudits.dataDOMNodes):
        (WI.DefaultAudits.dataDOMAttributes):
        (WI.DefaultAudits.dataErrors):
        (WI.DefaultAudits.dataCustom):
        (WI.DefaultAudits.getElementsByComputedRole):
        (WI.DefaultAudits.getActiveDescendant):
        (WI.DefaultAudits.getChildNodes):
        (WI.DefaultAudits.getComputedProperties):
        (WI.DefaultAudits.getControlledNodes):
        (WI.DefaultAudits.getFlowedNodes):
        (WI.DefaultAudits.getMouseEventNode):
        (WI.DefaultAudits.getOwnedNodes):
        (WI.DefaultAudits.getParentNode):
        (WI.DefaultAudits.getSelectedChildNodes):
        (WI.DefaultAudits.hasEventListeners):
        (WI.DefaultAudits.hasEventListenersClick):
        (WI.DefaultAudits.getResources):
        (WI.DefaultAudits.getResourceContent):
        (WI.DefaultAudits.unsupported):
        (hasChildWithRole):
        (WI.DefaultAudits.testMenuRoleForRequiredChildren):
        (WI.DefaultAudits.testGridRoleForRequiredChildren):
        (WI.DefaultAudits.testForAriaLabelledBySpelling):
        (WI.DefaultAudits.testForMultipleBanners):
        (WI.DefaultAudits.testForLinkLabels):
        (WI.DefaultAudits.testRowGroupRoleForRequiredChildren):
        (WI.DefaultAudits.testTableRoleForRequiredChildren):
        (WI.DefaultAudits.testForMultipleLiveRegions):
        (WI.DefaultAudits.testListBoxRoleForRequiredChildren):
        (WI.DefaultAudits.testImageLabels):
        (WI.DefaultAudits.testForAriaHiddenFalse):
        (WI.DefaultAudits.testTreeRoleForRequiredChildren):
        (WI.DefaultAudits.testRadioGroupRoleForRequiredChildren):
        (WI.DefaultAudits.testFeedRoleForRequiredChildren):
        (WI.DefaultAudits.testTabListRoleForRequiredChildren):
        (WI.DefaultAudits.testButtonLabels):
        (WI.DefaultAudits.testRowRoleForRequiredChildren):
        (WI.DefaultAudits.testListRoleForRequiredChildren):
        (WI.DefaultAudits.testComboBoxRoleForRequiredChildren):
        (WI.DefaultAudits.testForMultipleMainContentSections):
        (WI.DefaultAudits.testDialogsForLabels):
        (WI.DefaultAudits.testForInvalidAriaHiddenValue):
        * UserInterface/Test.html:

2021-04-27  Don Olmstead  <don.olmstead@sony.com>

        [CMake] Don't use FORWARDING_HEADERS_DIR for GTK WebKit headers
        https://bugs.webkit.org/show_bug.cgi?id=225006

        Reviewed by Michael Catanzaro.

        Use WebKit2Gtk_FRAMEWORK_HEADERS_DIR and WebKit2Gtk_DERIVED_SOURCES_DIR for WebKit2 GTK
        headers instead of FORWARDING_HEADERS_DIR and DERIVED_SOURCES_DIR.

        * PlatformGTK.cmake:

2021-04-26  Nikita Vasilyev  <nvasilyev@apple.com>

        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
        <rdar://problem/76382755>

        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  <drousso@apple.com>

        Web Inspector: Audit: Uncaught Exception: Failed to execute 'delete' on 'IDBObjectStore': The parameter is not a valid key range.
        https://bugs.webkit.org/show_bug.cgi?id=224993

        Reviewed by BJ Burg.

        * UserInterface/Controllers/AuditManager.js:
        (WI.AuditManager.prototype.async processJSON):
        (WI.AuditManager.prototype.async addTest):
        * UserInterface/Views/AuditNavigationSidebarPanel.js:
        (WI.AuditNavigationSidebarPanel.prototype.willDismissPopover):
        * UserInterface/Views/AuditTreeElement.js:
        (WI.AuditTreeElement.prototype.populateContextMenu):
        Make sure to save any newly created audits not already in `WI.objectStores.audits` immediately
        so that if the developer tries to delete it before exiting Edit mode (which is normally when
        everything is saved) an exception isn't thrown about it not being in `WI.objectStores.audits`.

2021-04-26  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: REGRESSION(r270134) Elements Tab: Details Sidebar toggle is unexpectedly disabled  after switching from Timelines tab
        https://bugs.webkit.org/show_bug.cgi?id=224772
        <rdar://73470211>

        Reviewed by Devin Rousso.

        Ensure the logic for identifying and showing the represented object for the selected `DOMNode`
        is not run unless the Elements Tab is visible. This guards agains the partial setting of state
        when the Elements Tab is not the default tab while opening Web Inspector.

        * UserInterface/Views/ElementsTabContentView.js:
        (WI.ElementsTabContentView):
        (WI.ElementsTabContentView.prototype.showRepresentedObject):
        (WI.ElementsTabContentView.prototype.attached):
        (WI.ElementsTabContentView.prototype.detached):
        (WI.ElementsTabContentView.prototype._showDOMTreeContentViewIfNeeded):
        (WI.ElementsTabContentView.prototype._mainFrameDidChange):
        (WI.ElementsTabContentView.prototype._mainResourceDidChange):

2021-04-25  Devin Rousso  <drousso@apple.com>

        Web Inspector: Audit: REGRESSION(?): creating a new test in Edit mode causes the Results folder to appear
        https://bugs.webkit.org/show_bug.cgi?id=224994

        Reviewed by Darin Adler.

        * UserInterface/Views/AuditNavigationSidebarPanel.js:
        (WI.AuditNavigationSidebarPanel.prototype._addTest):

2021-04-22  BJ Burg  <bburg@apple.com>

        [Cocoa] re-enable test case WKInspectorDelegate.InspectorConfiguration
        https://bugs.webkit.org/show_bug.cgi?id=224577
        <rdar://70505272>

        Reviewed by Devin Rousso.

        Adjust the CSP directive list in the <meta> tag to allow for customization
        by WebKit ports. 

        * UserInterface/Main.html:
        - Remove `default-src 'self'` so as not to block custom scheme loads.
        - Remove `connect-src * ws:` so as not to block custom scheme loads.
        - Add `object-src 'none'` as we have no reason to allow <object>, <embed>, or <applet>.

2021-04-20  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Tree Outlines: `ondetach` can be called without `onattach` ever being called
        https://bugs.webkit.org/show_bug.cgi?id=224652
        <rdar://problem/76746385>

        Reviewed by Devin Rousso.

        Ensure `TreeElement.ondetach()` cannot be called if the conditions
        for previously calling `TreeElement.onattach()` have not been met.

        * UserInterface/Views/TreeElement.js:
        (WI.TreeElement.prototype._detach):

2021-04-19  Patrick Angle  <pangle@apple.com>

        REGRESSION (r268691 && r270134): Web Inspector: Clicking on go-to arrow in Computed panel no longer works
        https://bugs.webkit.org/show_bug.cgi?id=224774

        Reviewed by Devin Rousso.

        The Styles panel will not always be part of the same sidebar as the Computed panel as of r268691, so we should
        look for the Styles panel in WI.detailsSidebar, which will report all of the panels it manages across multiple
        sidebars. Additionally, as of r270134, there is no longer a private `_visible` property for
        `WI.StyleDetailsPanel`, so it can not be used by `WI.SpreadsheetRulesStyleDetailsPanel`. Instead, visibility
        should be determined by checking if the panel is attached and not pending layout.

        * UserInterface/Views/ComputedStyleDetailsSidebarPanel.js:
        (WI.ComputedStyleDetailsSidebarPanel.prototype.computedStyleDetailsPanelShowProperty):
        * UserInterface/Views/SpreadsheetRulesStyleDetailsPanel.js:
        (WI.SpreadsheetRulesStyleDetailsPanel.prototype.scrollToSectionAndHighlightProperty):

2021-04-19  Devin Rousso  <drousso@apple.com>

        Web Inspector: Graphics: add support for `steps()`/`spring()` CSS timing functions
        https://bugs.webkit.org/show_bug.cgi?id=224654

        Reviewed by BJ Burg.

        * UserInterface/Models/Geometry.js:
        (WI.StepsFunction): Added.
        (WI.StepsFunction.fromString): Added.
        (WI.StepsFunction.prototype.get type): Added.
        (WI.StepsFunction.prototype.get count): Added.
        (WI.StepsFunction.prototype.copy): Added.
        (WI.StepsFunction.prototype.toString): Added.
        Create a model object for `steps()` CSS timing function.

        * UserInterface/Models/Animation.js:
        (WI.Animation.prototype._updateEffect):
        Also support `effect.timingFunction`/`keyframe.easing` being a `steps()`/`spring()` CSS timing function.

        * UserInterface/Views/AnimationContentView.js:
        (WI.AnimationContentView.prototype._refreshPreview):
        Create a UI for `steps()`/`spring()` CSS timing functions.

2021-04-19  Devin Rousso  <drousso@apple.com>

        Web Inspector: REGRESSION(?): Network: Request (Object Tree) is sometimes empty
        https://bugs.webkit.org/show_bug.cgi?id=224768
        <rdar://problem/76783636>

        Reviewed by BJ Burg.

        * UserInterface/Views/LocalJSONContentView.js:
        (WI.LocalJSONContentView.prototype.renderRemoteObject):
        If the `WI.RemoteObject` is simple enough to be rendered inline, `WI.ObjectTreeView` won't
        show a `WI.TreeOutline` by default. We have to tell it to use a `WI.TreeOutline` by passing
        `forceExpanding = true` into the constructor.

        * UserInterface/Views/ObjectTreeView.js:
        (WI.ObjectTreeView.prototype.showOnlyJSON):
        Add some `console.assert` to help prevent this from happening again.

2021-04-19  Kimmo Kinnunen  <kkinnunen@apple.com>

        Enable -Wthread-safety, add attributes to custom lock classes, and provide macros to declare guards
        https://bugs.webkit.org/show_bug.cgi?id=221614
        <rdar://problem/74396781>

        Reviewed by David Kilzer.

        Add -Wthread-safety to compile flags.

        * Configurations/Base.xcconfig:

2021-04-16  Devin Rousso  <drousso@apple.com>

        Web Inspector: REGRESSION(?): Graphics: dropping a recording leaves behind a drop zone view
        https://bugs.webkit.org/show_bug.cgi?id=224648

        Reviewed by BJ Burg.

        * UserInterface/Views/GraphicsTabContentView.js:
        (WI.GraphicsTabContentView.prototype.initialLayout):
        It appears that it's possible for re-entrancy issues in the `WI.View` system since the
        `_didInitialLayout` flag isn't set until _after_ `initialLayout` returns, meaning that if
        the logic inside `initialLayout` triggers a synchronous `layout` then that second `layout`
        won't know that it's already in the middle of an `initialLayout`. In this case, showing the
        `WI.GraphicsOverviewContentView` causes the navigation sidebar to be shown, which forces a
        synchronous `layout` from handling `WI.Sidebar.Event.WidthDidChange`. For now, there's no
        "rush" to show the `WI.GraphicsOverviewContentView` so we delay it by one event loop turn.

        * UserInterface/Views/CanvasContentView.js:
        (WI.CanvasContentView.prototype.initialLayout):
        (WI.CanvasContentView.prototype.dropZoneShouldAppearForDragEvent): Deleted.
        (WI.CanvasContentView.prototype.dropZoneHandleDrop): Deleted.
        There's no reason to have another `WI.DropZoneView` here since there's already one that
        covers the entire tab.

2021-04-16  Devin Rousso  <drousso@apple.com>

        Web Inspector: Uncaught Exception: null is not an object (evaluating 'this._listeners.get')
        https://bugs.webkit.org/show_bug.cgi?id=224651

        Reviewed by BJ Burg.

        * UserInterface/Base/Object.js:
        (WI.Object.removeEventListener):
        Add early-return checks just in case `_listeners` or `listenersForEventType` is falsy. While
        ideally it would be the case that these would never be falsy, the logic of Web Inspector is
        complex and far reaching, so better safe than sorry.

        * UserInterface/Views/TreeElement.js:
        (WI.TreeElement.prototype._detach):
        * UserInterface/Views/AuditTreeElement.js:
        (WI.AuditTreeElement.prototype.ondetach):
        * UserInterface/Views/BootstrapScriptTreeElement.js:
        (WI.BootstrapScriptTreeElement.prototype.ondetach):
        * UserInterface/Views/BreakpointTreeElement.js:
        (WI.BreakpointTreeElement.prototype.ondetach):
        * UserInterface/Views/DOMTreeElement.js:
        (WI.DOMTreeElement.prototype.ondetach):
        * UserInterface/Views/FrameTreeElement.js:
        (WI.FrameTreeElement.prototype.ondetach):
        * UserInterface/Views/JavaScriptBreakpointTreeElement.js:
        (WI.JavaScriptBreakpointTreeElement.prototype.ondetach):
        * UserInterface/Views/LocalResourceOverrideTreeElement.js:
        (WI.LocalResourceOverrideTreeElement.prototype.ondetach):
        * UserInterface/Views/ShaderProgramTreeElement.js:
        (WI.ShaderProgramTreeElement.prototype.ondetach):
        * UserInterface/Views/WebSocketResourceTreeElement.js:
        (WI.WebSocketResourceTreeElement.prototype.ondetach):
        Add FIXME comments warning of this issue so that future changes can take it into account.
        <https://webkit.org/b/224652> (Web Inspector: Tree Outlines: `ondetach` can be called without `onattach` ever being called)

2021-04-16  Devin Rousso  <drousso@apple.com>

        Web Inspector: Sources: don't show the create local override contextmenu if the navigation item is disabled
        https://bugs.webkit.org/show_bug.cgi?id=224647

        Reviewed by BJ Burg.

        * UserInterface/Views/ResourceContentView.js:
        (WI.ResourceContentView.prototype._populateCreateLocalResourceOverrideContextMenu):

2021-04-13  BJ Burg  <bburg@apple.com>

        Web Inspector: add setting to allow inspecting Web Inspector
        https://bugs.webkit.org/show_bug.cgi?id=224082
        <rdar://75695002>

        Reviewed by Devin Rousso.

        Instead of telling curious users to set the WebKitDeveloperExtras default,
        expose an experimental setting that does the same thing.

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

2021-04-06  BJ Burg  <bburg@apple.com>

        Web Inspector: remove duplicate Box Model section from Layout panel in Elements Tab
        https://bugs.webkit.org/show_bug.cgi?id=224206
        <rdar://problem/76235731>

        Reviewed by Devin Rousso.

        For now, remove it from Layout panel. It may go back there
        when it is able to show used values. It currently only shows computed.

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

2021-04-06  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: Layout sidebar grid overlay color swatch tooltip shouldn't include "switch format" hint
        https://bugs.webkit.org/show_bug.cgi?id=223418
        <rdar://problem/75825793>

        Reviewed by BJ Burg.

        * UserInterface/Views/CSSGridSection.js:
        (WI.CSSGridSection.prototype.layout):
        * UserInterface/Views/InlineSwatch.js:
        (WI.InlineSwatch):
        (WI.InlineSwatch.prototype.set shiftClickColorEnabled):
        (WI.InlineSwatch.prototype._updateSwatch):
        (WI.InlineSwatch.prototype._allowChangingColorFormats):

2021-03-31  Patrick Angle  <pangle@apple.com>

        Web Inspector: Regression (r270134) Timeline recordings 2 and beyond do not show a timescale.
        https://bugs.webkit.org/show_bug.cgi?id=222930

        Reviewed by Devin Rousso.

        When a new `TimelineOverview` is created, it calls `TimelineOverview.prototype._viewModeDidChange` inside the
        constructor, which in turn called `updateLayout`. This was problematic in that a `TimelineRuler` would have
        `sizeDidChange` invoked before it was attached to the DOM, which meant that there was no width to cache. Because
        `sizeDidChange` is only invoked during the first layout and on resize events, the cached width is not updated
        when the ruler is attached to the view hierarchy, having already performed an early initial layout.

        This patch now checks if the `TimelineOverview` has performed its initial layout before updating the layout
        inside `_viewModeDidChange`, which means that the initial layout on the child `TimelineRuler` will be done while
        attached, thus producing a valid width value to cache.

        * UserInterface/Views/TimelineOverview.js:
        (WI.TimelineRuler.prototype._viewModeDidChange):

2021-03-31  Nikita Vasilyev  <nvasilyev@apple.com>

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

        Reviewed by BJ Burg.

        * UserInterface/Models/CSSKeywordCompletions.js:

2021-03-28  Sam Weinig  <weinig@apple.com>

        Remove ENABLE_INDEXED_DATABASE & ENABLE_INDEXED_DATABASE_IN_WORKERS, it seems like it is on for all ports
        https://bugs.webkit.org/show_bug.cgi?id=223810

        Reviewed by Simon Fraser.

        * Versions/Inspector-iOS-14.0.json:
        * Versions/Inspector-iOS-14.5.json:
        Update for removed ENABLE_INDEXED_DATABASE conditional.

2021-03-26  Jessie Berlin  <jberlin@webkit.org>

        Update the BEFORE/SINCE, SYSTEM_VERSION_PREFIX, and MACOSX_DEPLOYMENT_TARGET flags
        https://bugs.webkit.org/show_bug.cgi?id=223779

        Reviewed by Tim Horton.

        * Configurations/DebugRelease.xcconfig:
        * Configurations/Version.xcconfig:

2021-03-25  Jessie Berlin  <jberlin@webkit.org>

        Remove 10.13 DEPLOYMENT_TARGETs and SYSTEM_VERSION_PREFIXs
        https://bugs.webkit.org/show_bug.cgi?id=223765

        Reviewed by Tim Horton.

        * Configurations/Base.xcconfig:
        * Configurations/DebugRelease.xcconfig:
        * Configurations/Version.xcconfig:

2021-03-25  Razvan Caliman  <rcaliman@apple.com>

        REGRESSION (r270134) Web Inspector: Audit: Results are stacked on top of each other.
        https://bugs.webkit.org/show_bug.cgi?id=223381
        <rdar://problem/75528374>

        Reviewed by Devin Rousso.

        Ensure pre-existing `ContentView`s are removed when navigating back/forward
        even when the incoming `ContentView` is already attached.

        For example, `AuditTestContentView` instances for individual tests are already attached
        when shown as part of a test group `AuditTestGroupContentView`.
        Navigating from the group to the individual test view must remove the group view.

        * UserInterface/Views/ContentViewContainer.js:
        (WI.ContentViewContainer.prototype.showBackForwardEntryForIndex):

2021-03-24  Razvan Caliman  <rcaliman@apple.com>

        Web Inspector: REGRESSION (r269359): Timelines: TypeError: this.deselect is not a function
        https://bugs.webkit.org/show_bug.cgi?id=223698
        <rdar://problem/75790983>

        Reviewed by BJ Burg.

        Ensure individual timeline views can be closed to return to the Timelines overview.

        * UserInterface/Views/TimelineTreeElement.js:
        (WI.TimelineTreeElement.prototype._showCloseButton):

2021-03-19  BJ Burg  <bburg@apple.com>

        Uncaught Exception: RangeError: Array size is not a small enough positive integer.
        https://bugs.webkit.org/show_bug.cgi?id=223532
        <rdar://problem/75635080>

        Reviewed by Devin Rousso.

        This patch fixes the broken CPU instrument when viewing a JSON timeline recordng.

        This exception is thrown when viewing a timeline recording that has been
        imported from JSON file. Aside from the exception, the code is functionally
        broken in this situation since passing a negative number to Array() doesn't work.

        I tested this change manually and selection ranges now behave as expected, and
        have not regressed in other instruments / UI.

        * UserInterface/Views/CPUTimelineView.js:
        Based on my investigation, the visibleEndTime is incorrectly computed when
        showing a JSON timeline recording because the currentTime property is always '0'.
        If this is the case, then let's assume that the entire range should be displayed.

== Rolled over to ChangeLog-2021-03-18 ==