25950e81bdecab3724555bfb80187b3a14014a53
[WebKit.git] / Source / WebInspectorUI / ChangeLog
1 2020-04-27  Diego Pino Garcia  <dpino@igalia.com>
2
3         Unreviewed, reverting r260728.
4
5         Build fix after r260672, no needed since r260672 is also being reverted.
6
7         Reverted changeset:
8
9         "[Win] Fix windows build with MSBuild after 260672"
10         https://bugs.webkit.org/show_bug.cgi?id=211047
11         https://trac.webkit.org/changeset/260728
12
13 2020-04-27  Diego Pino Garcia  <dpino@igalia.com>
14
15         Unreviewed, reverting r260696.
16
17         Build fix after r260672, no needed since r260672 is also being reverted.
18
19         Reverted changeset:
20
21         "REGRESSION(210942): [GTK][WPE] Unreviewed, EWS build bots
22         fail in compile-webkit step"
23         https://bugs.webkit.org/show_bug.cgi?id=211014
24         https://trac.webkit.org/changeset/260696
25
26 2020-04-26  Christopher Reid  <chris.reid@sony.com>
27
28         [Win] Fix windows build with MSBuild after 260672
29         https://bugs.webkit.org/show_bug.cgi?id=211047
30
31         Unreviewed build fix.
32
33         * CMakeLists.txt:
34
35 2020-04-25  Darin Adler  <darin@apple.com>
36
37         [Cocoa] Deal with another round of Xcode upgrade checks
38         https://bugs.webkit.org/show_bug.cgi?id=211027
39
40         Reviewed by Alexey Proskuryakov.
41
42         * WebInspectorUI.xcodeproj/project.pbxproj: Bump the upgrade check version.
43         Add a harmless base localization; this project contains nothing localized.
44
45 2020-04-25  Diego Pino Garcia  <dpino@igalia.com>
46
47         REGRESSION(210942): [GTK][WPE] Unreviewed, EWS build bots fail in compile-webkit step
48         https://bugs.webkit.org/show_bug.cgi?id=211014
49
50         * CMakeLists.txt: Remove creation of file 'inspector-resources.stamp'.
51
52 2020-04-24  Christopher Reid  <chris.reid@sony.com>
53
54         [Win] Bundle Inspector Resources in Release builds
55         https://bugs.webkit.org/show_bug.cgi?id=210942
56
57         Reviewed by Fujii Hironori.
58
59         Add CMake files for copying inspector resources
60
61         * CMakeLists.txt: Added.
62         * PlatformGTK.cmake: Added.
63         * PlatformWin.cmake: Added.
64
65 2020-04-23  Devin Rousso  <drousso@apple.com>
66
67         Web Inspector: REGRESSION(r257759): Network: waterfall popover is missing bars
68         https://bugs.webkit.org/show_bug.cgi?id=210947
69
70         Reviewed by Brian Burg.
71
72         `WI.ResourceTimingBreakdownView` is also used inside of a `WI.Popover`, meaning that the
73         waterfall graph won't be a child of the `.network-table`. Add a `.network` class to all
74         instances of `.waterfall` so that the selector can be more specific.
75
76         * UserInterface/Views/NetworkTableContentView.js:
77         (WI.NetworkTableContentView.prototype._populateWaterfallGraph):
78         * UserInterface/Views/NetworkTableContentView.css:
79         (.waterfall.network .block): Added.
80         (body[dir=ltr] .waterfall.network .block): Added.
81         (body[dir=rtl] .waterfall.network .block): Added.
82         (.waterfall.network .block + .block): Added.
83         (.waterfall.network .block:matches(.mouse-tracking, .filler) + .block:not(.mouse-tracking, .filler), .waterfall.network .block:not(.request, .response) + :matches(.request, .response)): Added.
84         (.waterfall.network .block:last-child): Added.
85         (.waterfall.network .block.request,): Added.
86         (.waterfall.network .block.mouse-tracking): Added.
87         (.waterfall.network .block.filler): Added.
88         (.waterfall.network .block.redirect): Added.
89         (.waterfall.network .block.queue): Added.
90         (.waterfall.network .block.dns): Added.
91         (.waterfall.network .block.connect): Added.
92         (.waterfall.network .block.secure): Added.
93         (.waterfall.network .block.request): Added.
94         (.waterfall.network .block.response): Added.
95         (.network-table .waterfall .block): Deleted.
96         (body[dir=ltr] .network-table .waterfall .block): Deleted.
97         (body[dir=rtl] .network-table .waterfall .block): Deleted.
98         (.network-table .waterfall .block + .block): Deleted.
99         (.network-table .waterfall .block:matches(.mouse-tracking, .filler) + .block:not(.mouse-tracking, .filler), .network-table .waterfall .block:not(.request, .response) + :matches(.request, .response)): Deleted.
100         (.network-table .waterfall .block:last-child): Deleted.
101         (.network-table .waterfall .block.request,): Deleted.
102         (.network-table .waterfall .block.mouse-tracking): Deleted.
103         (.network-table .waterfall .block.filler): Deleted.
104         (.network-table .waterfall .block.redirect): Deleted.
105         (.network-table .waterfall .block.queue): Deleted.
106         (.network-table .waterfall .block.dns): Deleted.
107         (.network-table .waterfall .block.connect): Deleted.
108         (.network-table .waterfall .block.secure): Deleted.
109         (.network-table .waterfall .block.request): Deleted.
110         (.network-table .waterfall .block.response): Deleted.
111         * UserInterface/Views/ResourceTimingBreakdownView.js:
112         (WI.ResourceTimingBreakdownView.prototype.initialLayout):
113
114 2020-04-23  Devin Rousso  <drousso@apple.com>
115
116         Web Insspector: Storage: cannot select multiple local storage entries
117         https://bugs.webkit.org/show_bug.cgi?id=210876
118
119         Reviewed by Brian Burg.
120
121         Support multiple selection using `WI.DataGrid`.
122
123         * UserInterface/Views/DataGrid.js:
124         (WI.DataGrid):
125         (WI.DataGrid.prototype.get allowsMultipleSelection): Added.
126         (WI.DataGrid.prototype.set allowsMultipleSelection): Added.
127         (WI.DataGrid.prototype.get selectedNode):
128         (WI.DataGrid.prototype.set selectedNode):
129         (WI.DataGrid.prototype.get selectedDataGridNodes): Added.
130         (WI.DataGrid.prototype._keyDown):
131         (WI.DataGrid.prototype.selectNodes):
132         (WI.DataGrid.prototype._mouseDownInDataTable):
133         (WI.DataGrid.prototype._contextMenuInDataTable):
134         (WI.DataGrid.prototype.handleCopyEvent):
135         (WI.DataGrid.prototype._copyRow):
136         (WI.DataGrid.prototype._copyTable):
137         (WI.DataGrid.prototype._hasCopyableData):
138         (WI.DataGrid.prototype.selectDataGridNodeInternal): Added.
139         (WI.DataGrid.prototype.deselectDataGridNodeInternal): Added.
140         (WI.DataGrid.prototype._dispatchSelectedNodeChangedEvent): Added.
141         (WI.DataGrid.prototype.dataGridNodeForSelectionItem): Added.
142         (WI.DataGrid.prototype.selectionItemForDataGridNode): Added.
143         (WI.DataGrid.prototype.selectionControllerSelectionDidChange): Added.
144         (WI.DataGrid.prototype.selectionControllerFirstSelectableItem): Added.
145         (WI.DataGrid.prototype.selectionControllerLastSelectableItem): Added.
146         (WI.DataGrid.prototype.selectionControllerPreviousSelectableItem): Added.
147         (WI.DataGrid.prototype.selectionControllerNextSelectableItem): Added.
148         * UserInterface/Views/DataGridNode.js:
149         (WI.DataGridNode.prototype.select):
150         (WI.DataGridNode.prototype.deselect):
151         Replace `selectedNode` with a `WI.SelectionController` that behaves like a `WI.TreeOutline`.
152         Use the `WI.SelectionController.Operation` to ensure that `WI.PlaceholderDataGridNode` are
153         not selected unless directly chosen (i.e. not during shift selection or ⌘A). Add logic such
154         that `WI.PlaceholderDataGridNode` are not copied. Prefer `_rows` instead of `children` as
155         the latter is not sorted/filtered.
156
157         * UserInterface/Controllers/SelectionController.js:
158         (WI.SelectionController.createTreeComparator): Added.
159         (WI.SelectionController.createListComparator): Added.
160         Create `static` helper functions for common comparators.
161
162         (WI.SelectionController.prototype.deselectItem):
163         (WI.SelectionController.prototype.selectAll):
164         (WI.SelectionController.prototype.removeSelectedItems):
165         (WI.SelectionController.prototype.handleItemMouseDown):
166         (WI.SelectionController.prototype._selectItemsFromArrowKey):
167         (WI.SelectionController.prototype._firstSelectableItem):
168         (WI.SelectionController.prototype._lastSelectableItem):
169         (WI.SelectionController.prototype._previousSelectableItem):
170         (WI.SelectionController.prototype._nextSelectableItem):
171         (WI.SelectionController.prototype._addRange):
172         (WI.SelectionController.prototype._deleteRange):
173         Introduce a `WI.SelectionController.Operation` which is used to tell the `_delegate` about
174         why it's being asked for information.
175
176         * UserInterface/Views/DOMStorageContentView.js:
177         (WI.DOMStorageContentView):
178         (WI.DOMStorageContentView.prototype._deleteCallback):
179         Support multiple selection, including deleting multiple rows at once.
180
181         * UserInterface/Views/Table.js:
182         (WI.Table):
183         * UserInterface/Views/TreeOutline.js:
184         (WI.TreeOutline):
185         (WI.TreeOutline.prototype.selectionControllerNumberOfItems): Deleted.
186         Removed unused `selectionControllerNumberOfItems`.
187
188         * UserInterface/Views/ProfileView.js:
189         (WI.ProfileView):
190         (WI.ProfileView.prototype._dataGridNodeSelected):
191         Maintain a `_selectedDataGridNode` so that `oldSelectedNode` doesn't have to be included
192         when dispatching `WI.DataGrid.Event.SelectedNodeChanged`.
193
194 2020-04-23  Devin Rousso  <drousso@apple.com>
195
196         Web Inspector: REGRESSION: Elements: Styles: color functions are missing swatches
197         https://bugs.webkit.org/show_bug.cgi?id=210930
198
199         Reviewed by Brian Burg.
200
201         * UserInterface/Views/SpreadsheetStyleProperty.js:
202         (WI.SpreadsheetStyleProperty.prototype._replaceSpecialTokens):
203         (WI.SpreadsheetStyleProperty.prototype._addGradientTokens):
204         (WI.SpreadsheetStyleProperty.prototype._addColorTokens):
205         (WI.SpreadsheetStyleProperty.prototype._addTimingFunctionTokens):
206         (WI.SpreadsheetStyleProperty.prototype._addBoxShadowTokens):
207         (WI.SpreadsheetStyleProperty.prototype._addVariableTokens):
208         Only attempt to `WI.Color.fromString` when at a ")" that is not part of another function.
209         Drive-by: add variable tokens after variable text is resolved, as otherwise the variable is
210                   replaced with a `WI.InlineSwatch`, which replaces the original text, preventing it
211                   from being used for looking up the variable name.
212
213 2020-04-23  Devin Rousso  <drousso@apple.com>
214
215         Web Inspector: Uncaught Exception: SyntaxError: Invalid regular expression: missing )
216         https://bugs.webkit.org/show_bug.cgi?id=210890
217
218         Reviewed by Brian Burg.
219
220         * UserInterface/Base/SearchUtilities.js:
221         (WI.SearchUtilities.prototype._regExpForString):
222         Catch any exceptions from `new RegExp` and return `null` in that case.
223
224         * UserInterface/Views/FilterBar.js:
225         (WI.FilterBar):
226         (WI.FilterBar.prototype.get invalid): Added.
227         (WI.FilterBar.prototype.set invalid): Added.
228         (WI.FilterBar.prototype.clear):
229         * UserInterface/Views/FilterBar.css:
230         (:matches(.filter-bar, .search-bar).invalid > input[type="search"]): Added.
231         * UserInterface/Views/CookieStorageContentView.js:
232         (WI.CookieStorageContentView.prototype._updateFilteredCookies):
233         * UserInterface/Views/IndexedDatabaseObjectStoreContentView.js:
234         (WI.IndexedDatabaseObjectStoreContentView.prototype.dataGridMatchNodeAgainstCustomFilters):
235         * UserInterface/Views/NavigationSidebarPanel.js:
236         (WI.NavigationSidebarPanel.prototype.updateFilter):
237         * UserInterface/Views/NetworkTableContentView.js:
238         (WI.NetworkTableContentView.prototype._urlFilterDidChange):
239         * UserInterface/Views/SearchSidebarPanel.js:
240         (WI.SearchSidebarPanel):
241         (WI.SearchSidebarPanel.prototype.performSearch):
242         (WI.SearchSidebarPanel.prototype.performSearch.forEachMatch):
243         * UserInterface/Views/SearchSidebarPanel.css:
244         (.sidebar > .panel.navigation.search > .search-bar > input[type="search"]): Added.
245         Mark the `WI.FilterBar` as invalid if the `filterRegExpForString` is invalid.
246
247         * UserInterface/Views/DOMTreeElement.js:
248         (WI.DOMTreeElement.prototype._highlightSearchResults):
249         * UserInterface/Views/LogContentView.js:
250         (WI.LogContentView.prototype.performSearch):
251         * UserInterface/Views/ResourceHeadersContentView.js:
252         (WI.ResourceHeadersContentView.prototype._perfomSearchOnKeyValuePairs):
253         * UserInterface/Views/ResourceSecurityContentView.js:
254         (WI.ResourceSecurityContentView.prototype._perfomSearchOnKeyValuePairs):
255         * UserInterface/Views/SourceCodeTextEditor.js:
256         (WI.SourceCodeTextEditor.prototype.customPerformSearch):
257         (WI.SourceCodeTextEditor.prototype.customPerformSearch.searchResultCallback):
258         * UserInterface/Views/TextEditor.js:
259         (WI.TextEditor.prototype.performSearch):
260         Ensure that the `WI.FindBanner` shows 0 results if the `searchRegExpForString` is invalid.
261
262         * UserInterface/Main.html:
263         * UserInterface/Views/SearchBar.js: Removed.
264         * UserInterface/Views/SearchBar.css: Removed.
265         Removed unused `WI.SearchBar`.
266
267 2020-04-22  Devin Rousso  <drousso@apple.com>
268
269         Web Inspector: Storage: unable to filter cookies
270         https://bugs.webkit.org/show_bug.cgi?id=210837
271
272         Reviewed by Brian Burg.
273
274         * UserInterface/Views/CookieStorageContentView.js:
275         (WI.CookieStorageContentView):
276         (WI.CookieStorageContentView.prototype.get navigationItems):
277         (WI.CookieStorageContentView.prototype.get canFocusFilterBar): Added.
278         (WI.CookieStorageContentView.prototype.focusFilterBar): Added.
279         (WI.CookieStorageContentView.prototype.tableIndexForRepresentedObject):
280         (WI.CookieStorageContentView.prototype.tableRepresentedObjectForIndex):
281         (WI.CookieStorageContentView.prototype.tableNumberOfRows):
282         (WI.CookieStorageContentView.prototype.tableSortChanged):
283         (WI.CookieStorageContentView.prototype.tableCellContextMenuClicked):
284         (WI.CookieStorageContentView.prototype.tableDidRemoveRows):
285         (WI.CookieStorageContentView.prototype.tablePopulateCell):
286         (WI.CookieStorageContentView.prototype._getCookiesForHost): Renamed from `_filterCookies`.
287         (WI.CookieStorageContentView.prototype.async _willDismissCookiePopover):
288         (WI.CookieStorageContentView.prototype._handleFilterBarFilterDidChange): Added.
289         (WI.CookieStorageContentView.prototype._handleClearNavigationItemClicked):
290         (WI.CookieStorageContentView.prototype._reloadCookies):
291         (WI.CookieStorageContentView.prototype._updateFilteredCookies): Added.
292         (WI.CookieStorageContentView.prototype._updateEmptyFilterResultsMessage): Added.
293         (WI.CookieStorageContentView.prototype._cookiesAtIndexes):
294         (WI.CookieStorageContentView.prototype._filterCookies): Deleted.
295         * UserInterface/Views/CookieStorageContentView.css:
296         (.content-view.cookie-storage > .message-text-view): Added.
297         (.content-view.cookie-storage > .message-text-view > .message): Added.
298         (.content-view.cookie-storage > .data-grid): Deleted.
299         Add a filter bar to the navigation bar that checks the regex-ified filter text against the
300         formatted text of each cell for each cookie. Also hook it up to the global find shortcut.
301
302         * UserInterface/Views/NetworkTableContentView.js:
303         (WI.NetworkTableContentView.prototype.layout):
304         (WI.NetworkTableContentView.prototype._showEmptyFilterResultsMessage):
305         (WI.NetworkTableContentView.prototype._tableNameColumnDidChangeWidth):
306         (WI.NetworkTableContentView.prototype._positionEmptyFilterMessage): Deleted.
307         * UserInterface/Views/NetworkTableContentView.css:
308         (.content-view.network .message-text-view): Added.
309         Drive-by: instead of having the "No Filter Results" view only cover the "Name" column, it
310                   should cover the entire table so as to be as noticable as possible (not to mention
311                   the table will be empty anyways, so it's not like anything is being hidden).
312         Drive-by: ensure that the "No Filter Results" view doesn't cover the statistics.
313
314 2020-04-21  Devin Rousso  <drousso@apple.com>
315
316         Web Inspector: REGRESSION(r255396): Graphics: viewing a shader program hides the navigation sidebar
317         https://bugs.webkit.org/show_bug.cgi?id=210838
318
319         Reviewed by Joseph Pecoraro.
320
321         * UserInterface/Views/CanvasSidebarPanel.js:
322         (WI.CanvasSidebarPanel.prototype.canShowRepresentedObject):
323         Include `WI.ShaderProgram` in the list of displayable represented objects.
324
325         * UserInterface/Base/Main.js:
326         (WI.tabContentViewClassForRepresentedObject):
327         * UserInterface/Views/GraphicsTabContentView.js:
328         (WI.GraphicsTabContentView.prototype.canShowRepresentedObject):
329         Update the list of represented objects that are displayable by the Graphics Tab.
330
331         * UserInterface/Views/GraphicsOverviewContentView.css:
332         (.content-view.graphics-overview > section > .header):
333         (.content-view.graphics-overview > section:not(:first-of-type) > .header): Deleted.
334         Drive-by: add a top border to the first section when overscrolling.
335
336         * UserInterface/Views/CanvasOverviewContentView.css:
337         (.content-view.canvas-overview > .content-view.canvas > .preview > .message-text-view): Added.
338         Drive-by: ensure that the "No Preview Available" view doesn't overlap the section header.
339
340 2020-04-20  Devin Rousso  <drousso@apple.com>
341
342         Web Inspector: the filter bar in the navigation sidebar should respect the global search settings
343         https://bugs.webkit.org/show_bug.cgi?id=210679
344
345         Reviewed by Joseph Pecoraro.
346
347         * UserInterface/Views/NavigationSidebarPanel.js:
348         (WI.NavigationSidebarPanel.prototype.updateFilter):
349
350 2020-04-20  Devin Rousso  <drousso@apple.com>
351
352         Web Inspector: removing a `WI.TreeElement` in a `WI.NavigationSidebar` doesn't check if the `WI.TreeOutline` still matches the current filter
353         https://bugs.webkit.org/show_bug.cgi?id=210672
354
355         Reviewed by Joseph Pecoraro.
356
357         * UserInterface/Views/NavigationSidebarPanel.js:
358         (WI.NavigationSidebarPanel.prototype.createContentTreeOutline):
359         (WI.NavigationSidebarPanel.prototype.updateFilter):
360         (WI.NavigationSidebarPanel.prototype._checkForEmptyFilterResults):
361         (WI.NavigationSidebarPanel.prototype._treeElementAddedOrChanged):
362         (WI.NavigationSidebarPanel.prototype._handleTreeElementRemoved): Added.
363
364 2020-04-17  Devin Rousso  <drousso@apple.com>
365
366         Web Inspector: REGRESSION(r242018): using `RegExp.prototype.test` with a global `RegExp` will ignore one potential match after each successful match
367         https://bugs.webkit.org/show_bug.cgi?id=210671
368
369         Reviewed by Timothy Hatcher.
370
371         * UserInterface/Base/SearchUtilities.js:
372         (WI.SearchUtilities.searchRegExpForString):
373         (WI.SearchUtilities.filterRegExpForString):
374         (WI.SearchUtilities._regExpForString):
375         (WI.SearchUtilities.regExpForString): Deleted.
376         Many uses of `WI.SearchUtilities.regExpForString` use the returned `RegExp` multiple times,
377         expecting each use to be done in isolation from every other use (e.g. filtering). In these
378         cases, the global flag `g` should not be set on the `RegExp`, as otherwise it will keep a
379         state of the last matched index, thereby breaking this isolation. As such, it is necessary
380         to split `WI.SearchUtilities.regExpForString` into two versions, one for each use case.
381
382         * UserInterface/Views/DOMTreeElement.js:
383         (WI.DOMTreeElement.prototype._highlightSearchResults):
384         * UserInterface/Views/LogContentView.js:
385         (WI.LogContentView.prototype.performSearch):
386         * UserInterface/Views/ResourceHeadersContentView.js:
387         (WI.ResourceHeadersContentView.prototype._perfomSearchOnKeyValuePairs):
388         * UserInterface/Views/ResourceSecurityContentView.js:
389         (WI.ResourceSecurityContentView.prototype._perfomSearchOnKeyValuePairs):
390         * UserInterface/Views/SearchSidebarPanel.js:
391         (WI.SearchSidebarPanel.prototype.performSearch.forEachMatch):
392         Use `WI.SearchUtilities.searchRegExpForString` as these views expect the search to maintain
393         its current position throughout the contents of the view.
394
395         * UserInterface/Views/DataGrid.js:
396         (WI.DataGrid.prototype._updateFilter):
397         * UserInterface/Views/IndexedDatabaseObjectStoreContentView.js:
398         (WI.IndexedDatabaseObjectStoreContentView.prototype.dataGridMatchNodeAgainstCustomFilters):
399         * UserInterface/Views/NetworkTableContentView.js:
400         (WI.NetworkTableContentView.prototype._urlFilterDidChange):
401         * UserInterface/Views/SourceCodeTextEditor.js:
402         (WI.SourceCodeTextEditor.prototype.customPerformSearch.searchResultCallback):
403         * UserInterface/Views/TextEditor.js:
404         (WI.TextEditor.prototype.performSearch):
405         Use `WI.SearchUtilities.filterRegExpForString` as these views expect each search to be done
406         in isolation from every other search (e.g. filtering).
407
408 2020-04-17  Devin Rousso  <drousso@apple.com>
409
410         Implement Promise.any and AggregateError
411         https://bugs.webkit.org/show_bug.cgi?id=202566
412
413         Reviewed by Yusuke Suzuki.
414
415         * UserInterface/Models/IssueMessage.js:
416         Mark `AggregateError` as a `WI.IssueMessage.Type.SemanticIssue`.
417
418 2020-04-17  Alexey Shvayka  <shvaikalesh@gmail.com>
419
420         MediaQueryList should extend EventTarget
421         https://bugs.webkit.org/show_bug.cgi?id=203288
422
423         Reviewed by Darin Adler.
424
425         * UserInterface/Models/NativeFunctionParameters.js:
426
427 2020-04-14  Devin Rousso  <drousso@apple.com>
428
429         Web Inspector: Debugger: add a Step next that steps by expression
430         https://bugs.webkit.org/show_bug.cgi?id=210324
431
432         Reviewed by Timothy Hatcher.
433
434         Step next is a hybrid of Step over and Step into which continues execution to the next pause
435         opportunity within the current (or ancestor) call frame. It is especially useful when trying
436         to debug minified code, such as trying to continue to `c()` in `a() && b() && c();`, where
437         Step over would continue to the next statement (i.e. after the `;`) and Step in would
438         continue to the first line inside `a()` (and would require a Step out to get back).
439
440         * UserInterface/Controllers/DebuggerManager.js:
441         (WI.DebuggerManager.prototype.stepNext): Added.
442
443         * UserInterface/Base/Main.js:
444         (WI.contentLoaded):
445         (WI.debuggerStepNext): Added.
446         * UserInterface/Views/SourcesNavigationSidebarPanel.js:
447         (WI.SourcesNavigationSidebarPanel):
448         (WI.SourcesNavigationSidebarPanel.prototype._handleDebuggerPaused):
449         (WI.SourcesNavigationSidebarPanel.prototype._handleDebuggerResumed):
450
451         * Localizations/en.lproj/localizedStrings.js:
452         * UserInterface/Images/StepNext.svg: Added.
453
454 2020-04-14  Nikita Vasilyev  <nvasilyev@apple.com>
455
456         Web Inspector: Don't show tooltips for tabs
457         https://bugs.webkit.org/show_bug.cgi?id=210464
458
459         Reviewed by Devin Rousso.
460
461         Don't show tooltips when they match the name of the tab. We no longer truncate tab names
462         so the tooltip is redundant.
463
464         Only show tooltips for settings and search (pinned tabs).
465
466         * UserInterface/Views/TabBarItem.js:
467         (WI.TabBarItem):
468         (WI.TabBarItem.prototype.set title):
469
470 2020-04-14  Devin Rousso  <drousso@apple.com>
471
472         Web Inspector: Elements: Computed: de-indent items in the Variables section so that wrapped content doesn't line up with the `--`
473         https://bugs.webkit.org/show_bug.cgi?id=210384
474
475         Reviewed by Timothy Hatcher.
476
477         * UserInterface/Views/ComputedStyleDetailsPanel.css:
478         (.sidebar > .panel.details.css-style > .content > .computed .property):
479
480 2020-04-14  Devin Rousso  <drousso@apple.com>
481
482         Web Inspector: Console: treat long strings as non-simple so they aren't truncated
483         https://bugs.webkit.org/show_bug.cgi?id=210511
484         <rdar://problem/49570592>
485
486         Reviewed by Joseph Pecoraro.
487
488         Treat strings longer than 140 characters (`WI.FormattedValue.MaxPreviewStringLength`) as not
489         simple so that `WI.ConsoleMessageView` makes itself expandable, which will show the full
490         length string when expanded (the truncated string is still shown when collapsed).
491
492         * UserInterface/Views/FormattedValue.js:
493         (WI.FormattedValue.isSimpleString): Added.
494         (WI.FormattedValue.hasSimpleDisplay):
495         * UserInterface/Views/ConsoleMessageView.js:
496         (WI.ConsoleMessageView.prototype._shouldConsiderObjectLossless):
497
498 2020-04-12  Darin Adler  <darin@apple.com>
499
500         Fix a few mispellings of descendant and propagation
501         https://bugs.webkit.org/show_bug.cgi?id=210409
502
503         Reviewed by Mark Lam.
504
505         * UserInterface/Views/TreeOutline.js:
506         (WI.TreeOutline.prototype._rememberTreeElement):
507         (WI.TreeOutline.prototype._forgetTreeElement):
508         (WI.TreeOutline.prototype.selectionControllerNumberOfItems):
509
510 2020-04-11  Devin Rousso  <drousso@apple.com>
511
512         Web Inspector: CSS: variables should have a go-to arrow to quickly jump to the definition
513         https://bugs.webkit.org/show_bug.cgi?id=195775
514         <rdar://problem/48905785>
515
516         Reviewed by Timothy Hatcher.
517
518         Often when debugging/editing styles that use CSS variables, the desired workflow is to
519         modify the variable itself, not that specific usage. This is especially helpful when editing
520         colors saved in CSS variables.
521
522         Add an always visible go-to arrow immediately after the variable (e.g. `--XYZ (->)`) that
523         will jump to the declaration of the variable elsewhere in the style cascade.
524
525         * UserInterface/Views/SpreadsheetStyleProperty.js:
526         (WI.SpreadsheetStyleProperty.prototype._addVariableTokens):
527         * UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css:
528         (.spreadsheet-style-declaration-editor .property .select-variable-property): Added.
529
530         * UserInterface/Base/Setting.js:
531         * UserInterface/Views/SettingsTabContentView.js:
532         (WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
533
534         * Localizations/en.lproj/localizedStrings.js:
535
536 2020-04-09  Devin Rousso  <drousso@apple.com>
537
538         Web Inspector: Storage: should be able to set a cookie with no value
539         https://bugs.webkit.org/show_bug.cgi?id=210237
540
541         Reviewed by Timothy Hatcher.
542
543         * UserInterface/Views/CookiePopover.js:
544         (WI.CookiePopover.prototype.get serializedData):
545         Require an explicitly set `name` instead of falling back to the `placeholder`. Allow the
546         `value` to be an empty string.
547
548         (WI.CookiePopover.prototype.show):
549         Don't have default placeholder values for `name` or `value` for the reasons above.
550         Drive-by: if an existing `WI.Cookie` is provided, use its `SameSite` value.
551
552         * UserInterface/Views/CookiePopover.css: Added.
553         (.popover .cookie-popover-content > table > tr > td > input:matches([type="text"], [type="datetime-local"]):matches(:invalid, .invalid)): Added.
554         (.popover .cookie-popover-content > table > tr > td > input:matches([type="text"], [type="datetime-local"]).invalid): Deleted.
555         Instead of changing the text color, change the border color.
556
557 2020-04-09  Devin Rousso  <drousso@apple.com>
558
559         Web Inspector: Debugger: debug hooks should also be emitted for the first sub-expression in a comma expression
560         https://bugs.webkit.org/show_bug.cgi?id=210253
561
562         Reviewed by Joseph Pecoraro.
563
564         * UserInterface/Workers/Formatter/JSFormatter.js:
565         (JSFormatter.prototype._handleTokenAtNode):
566         (JSFormatter.prototype._isLikelyToHaveNewline): Deleted.
567         If an arrow function wraps it's body with `{` and `}`, always add newlines to make setting
568         breakpoints inside the function body easier.
569
570 2020-04-08  Devin Rousso  <drousso@apple.com>
571
572         Web Inspector: Debugger: treat comma sub-expressions as separate statements
573         https://bugs.webkit.org/show_bug.cgi?id=209998
574
575         Reviewed by Joseph Pecoraro.
576
577         Minifiers sometimes use `,` instead of `;` as a way of compressing multiple statements into
578         a single statement (e.g. inside an `if` conditional). This makes stepping through minified
579         code much less useful, as our current stepping logic is based on expressions (not including
580         step in or step out). In most cases, we do actually want to treat each sub-expression in a
581         comma expression as a statement so as to emulate the behaviour as if there were `;` instead.
582
583         * UserInterface/Workers/Formatter/JSFormatter.js:
584         (JSFormatter.prototype._isLikelyToHaveNewline):
585         (JSFormatter.prototype._handleTokenAtNode):
586         Put each sub-expression in a comma expression on it's own line.
587
588 2020-04-08  Devin Rousso  <drousso@apple.com>
589
590         Web Inspector: Search: populate the search field with the current selection when using the global search shortcut
591         https://bugs.webkit.org/show_bug.cgi?id=210207
592
593         Reviewed by Timothy Hatcher.
594
595         Add a setting to control whether the global search (⇧⌘F) should be populated by the current
596         selection (if it exists), allowing for a quicker flow for "show me everywhere this exists".
597
598         * UserInterface/Base/Setting.js:
599         * UserInterface/Views/SettingsTabContentView.js:
600         (WI.SettingsTabContentView.prototype._createGeneralSettingsView):
601
602         * UserInterface/Base/Main.js:
603         (WI._focusSearchField)
604
605         * Localizations/en.lproj/localizedStrings.js:
606
607 2020-04-08  Devin Rousso  <drousso@apple.com>
608
609         Web Inspector: Storage: cannot clear out multiple or all local storage entries
610         https://bugs.webkit.org/show_bug.cgi?id=209867
611
612         Reviewed by Timothy Hatcher.
613
614         * UserInterface/Models/DOMStorageObject.js:
615         (WI.DOMStorageObject.prototype.removeItem):
616         (WI.DOMStorageObject.prototype.setItem):
617         (WI.DOMStorageObject.prototype.clear): Added.
618         (WI.DOMStorageObject.prototype.itemsCleared):
619         (WI.DOMStorageObject.prototype.itemRemoved):
620         (WI.DOMStorageObject.prototype.itemAdded):
621         (WI.DOMStorageObject.prototype.itemUpdated):
622         Add some assertions.
623
624         * UserInterface/Views/DOMStorageContentView.js:
625         (WI.DOMStorageContentView):
626         (WI.DOMStorageContentView.prototype.get navigationItems):
627         (WI.DOMStorageContentView.prototype._handleClearNavigationItemClicked): Added.
628         Add a "Clear" navigation item that calls the new `DOMStorage.clearDOMStorageItems`.
629
630         * UserInterface/Views/DataGrid.js:
631         (WI.DataGrid.prototype.removeChild):
632         If the removed item was selected, select the next (or previous if there is no next) item.
633
634         * UserInterface/Views/CookieStorageContentView.js:
635         (WI.CookieStorageContentView):
636         (WI.CookieStorageContentView.prototype.get navigationItems):
637         (WI.CookieStorageContentView.prototype._handleClearNavigationItemClicked): Added.
638         Drive-by: also add a "Clear" navigation item that calls `Page.deleteCookie` for each row.
639
640         * UserInterface/Protocol/DOMStorageObserver.js:
641         (WI.DOMStorageObserver.prototype.domStorageItemUpdated):
642         * UserInterface/Controllers/DOMStorageManager.js:
643         (WI.DOMStorageManager.prototype.itemUpdated):
644         Drive-by: rename `value` to `newValue` to match the protocol.
645
646         * Localizations/en.lproj/localizedStrings.js:
647
648 2020-04-08  Devin Rousso  <drousso@apple.com>
649
650         Web Inspector: Uncaught Exception: undefined is not an object (evaluating 'this._target.NetworkAgent.getResponseBody')
651         https://bugs.webkit.org/show_bug.cgi?id=210168
652
653         Reviewed by Timothy Hatcher.
654
655         If a script is loaded by the main page and a `Worker`, the `WI.Script` from the `Worker`
656         will be associated with the `WI.Resource` from the main page, the call stack in the Sources
657         Tab will use the `WI.Resource` over the `WI.Script`, but the `WI.Target` for a `Worker` does
658         not have a `NetworkAgent` or `PageAgent`. As such, inside `WI.Resource`, if the `_target` is
659         a `WI.TargetType.Worker`, use the `DebuggerAgent`.
660
661         * UserInterface/Models/Resource.js:
662         (WI.Resource.prototype.requestContentFromBackend):
663
664         * UserInterface/Main.html:
665         Drive-by: remove unnecessary `<script>`.
666
667 2020-04-08  Devin Rousso  <drousso@apple.com>
668
669         Web Inspector: don't reveal the prototype methods when using the "Expand All" context menu item for property-only object trees
670         https://bugs.webkit.org/show_bug.cgi?id=210123
671
672         Reviewed by Timothy Hatcher.
673
674         * UserInterface/Views/ObjectTreeView.css:
675         (.object-tree.properties-only.json-only .object-tree-property.prototype-property, .object-tree.properties-only.json-only .object-tree-property.prototype-property + .children): Added.
676         (.object-tree.properties-only.json-only .object-tree-property.prototype-property): Deleted.
677
678 2020-04-08  Devin Rousso  <drousso@apple.com>
679
680         Web Inspector: Sources: support copying selected call frame(s) in the Call Stack
681         https://bugs.webkit.org/show_bug.cgi?id=210172
682
683         Reviewed by Timothy Hatcher.
684
685         * UserInterface/Views/SourcesTabContentView.js:
686         (WI.SourcesTabContentView.prototype.handleCopyEvent): Added.
687         * UserInterface/Views/SourcesNavigationSidebarPanel.js:
688         (WI.SourcesNavigationSidebarPanel):
689         (WI.SourcesNavigationSidebarPanel.prototype.handleCopyEvent): Added.
690         Copy the function name and source location for each selected call frame. If the selected
691         call frames span an async boundary, include the async boundary in the form `--- <name> ---`
692         where name is the reason for the async behavior (e.g. `addEventListener`). If the selected
693         call frames span multiple threads (e.g. `Worker`), include the thread name and indent all
694         of the call frames for that thread.
695
696         * UserInterface/Views/CallFrameTreeElement.js:
697         (WI.CallFrameTreeElement):
698         (WI.CallFrameTreeElement.prototype.get isAsyncBoundaryCallFrame): Added.
699
700 2020-04-07  Nikita Vasilyev  <nvasilyev@apple.com>
701
702         Web Inspector: focus outline of scope bar is clipped
703         https://bugs.webkit.org/show_bug.cgi?id=209877
704         <rdar://problem/61173598>
705
706         Reviewed by Timothy Hatcher.
707
708         * UserInterface/Views/ScopeBar.css:
709         (.scope-bar):
710
711 2020-04-03  Devin Rousso  <drousso@apple.com>
712
713         Web Inspector: Sources: disclosure arrows should be shown if a folder is added to the navigation sidebar
714         https://bugs.webkit.org/show_bug.cgi?id=209937
715
716         Reviewed by Timothy Hatcher.
717
718         * UserInterface/Views/SourcesNavigationSidebarPanel.js:
719         (WI.SourcesNavigationSidebarPanel.prototype.treeElementForRepresentedObject):
720         (WI.SourcesNavigationSidebarPanel.prototype._addStyleSheet):
721         (WI.SourcesNavigationSidebarPanel.prototype._addScript):
722
723 2020-04-03  David Kilzer  <ddkilzer@apple.com>
724
725         [Xcode] Replace ASAN_OTHER_CFLAGS and ASAN_OTHER_CPLUSPLUSFLAGS with $(inherited)
726         <https://webkit.org/b/209963>
727         <rdar://problem/61257504>
728
729         Reviewed by Alexey Proskuryakov.
730
731         * Configurations/Base.xcconfig:
732         - Remove ASAN_OTHER_CFLAGS, ASAN_OTHER_CPLUSPLUSFLAGS and
733           ASAN_OTHER_LDFLAGS.
734
735 2020-04-02  Devin Rousso  <drousso@apple.com>
736
737         Context menu for local storage puts quotes around key and value
738         https://bugs.webkit.org/show_bug.cgi?id=209868
739
740         Reviewed by Joseph Pecoraro.
741
742         There are only two `WI.DataGrid` that support editing right now. Both of them use obvious
743         names for their columns (e.g. "Key", "Name", "Value", etc.), so rather than quote the column
744         name in the context menu, just display it as is.
745
746         * UserInterface/Views/DataGrid.js:
747         (WI.DataGrid.prototype._contextMenuInDataTable):
748
749         * Localizations/en.lproj/localizedStrings.js:
750
751 2020-04-02  Nikita Vasilyev  <nvasilyev@apple.com>
752
753         Web Inspector: Network tab summary bar jiggles
754         https://bugs.webkit.org/show_bug.cgi?id=209927
755
756         Reviewed by Timothy Hatcher.
757
758         * UserInterface/Views/NetworkTableContentView.css:
759         (.network-table > .statistics > .statistic > .text):
760
761 2020-04-01  Nikita Vasilyev  <nvasilyev@apple.com>
762
763         Web Inspector: Use ECMAScript Numeric Separators for numbers with 5 or more digits
764         https://bugs.webkit.org/show_bug.cgi?id=209879
765
766         Reviewed by Joseph Pecoraro.
767
768         Instead of `1000000` write `1_000_000` so it's easier to read.
769
770         * UserInterface/Base/Utilities.js:
771         * UserInterface/Controllers/JavaScriptLogViewController.js:
772         * UserInterface/Controllers/TimelineManager.js:
773         * UserInterface/Models/Gradient.js:
774         (WI.Gradient.prototype.stringFromStops):
775         * UserInterface/Models/HeapAllocationsInstrument.js:
776         (WI.HeapAllocationsInstrument.prototype.startInstrumentation):
777         * UserInterface/Protocol/Connection.js:
778         (InspectorBackend.Connection.prototype._dispatchResponse):
779         * UserInterface/Views/Layers3DContentView.js:
780         (WI.Layers3DContentView.prototype.initialLayout):
781         * UserInterface/Views/NetworkTableContentView.js:
782         (WI.NetworkTableContentView.prototype._updateLoadTimeStatistic):
783
784 2020-03-31  Jon Davis  <jond@apple.com>
785
786         Added new WebSocket icon
787         https://bugs.webkit.org/show_bug.cgi?id=209433
788
789         Reviewed by Joseph Pecoraro.
790
791         Drive-by: remove unused #doc-orig
792
793         * UserInterface/Images/DocumentIcons.svg:
794         * UserInterface/Views/ResourceIcons.css:
795         (.resource-icon.resource-type-websocket .icon):
796         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-websocket .icon):
797
798 2020-03-30  Nikita Vasilyev  <nvasilyev@apple.com>
799
800         Web Inspector: the Dock Side navigation item is automatically focused when Web Inspector is opened detached, preventing any global spacebar shortcuts from working
801         https://bugs.webkit.org/show_bug.cgi?id=209760
802
803         Reviewed by Devin Rousso.
804
805         When undocking, Web Inspector focuses on the first visible focusable element. I don't know why.
806         This patch restores the focus to the previously focused element.
807
808         * UserInterface/Base/Main.js:
809
810 2020-03-30  Devin Rousso  <drousso@apple.com>
811
812         Web Inspector: REGRESSION(r259101): items in the contextmenu of the tab bar don't have any text
813         https://bugs.webkit.org/show_bug.cgi?id=209793
814
815         Reviewed by Timothy Hatcher.
816
817         Fix a few places that weren't changed to use `displayName` instead of `title`.
818
819         * UserInterface/Base/Main.js:
820         (WI._tabBrowserSelectedTabContentViewDidChange):
821         * UserInterface/Views/TabBar.js:
822         (WI.TabBar.prototype._handleTabContainerMouseDown):
823         (WI.TabBar.prototype._handleTabContainerContextMenu):
824
825 2020-03-30  Devin Rousso  <drousso@apple.com>
826
827         Web Inspector: provide a way to log messages from the network process
828         https://bugs.webkit.org/show_bug.cgi?id=204775
829
830         Reviewed by Brian Burg.
831
832         ITP can be influenced by multiple pages simultaneously, meaning that sending a console
833         message to the Web Inspector that's connected to the page that caused a change may not be
834         useful as developers often don't test in complete isolation. As such, having a way to
835         broadcast a console message to all Web Inspectors ensures that any changes caused by any
836         page are always able to be seen, no matter which page is being actively inspected.
837
838         * UserInterface/Models/ConsoleMessage.js:
839         * UserInterface/Models/IssueMessage.js:
840         (WI.IssueMessage):
841         Add `ITPDebug` and `AdClickAttribution` message sources.
842
843 2020-03-30  Devin Rousso  <drousso@apple.com>
844
845         Web Inspector: Timelines: the current time marker should always be on top
846         https://bugs.webkit.org/show_bug.cgi?id=209758
847
848         Reviewed by Timothy Hatcher.
849
850         * UserInterface/Views/TimelineRuler.css:
851         (.timeline-ruler > .markers):
852         (.timeline-ruler > .markers > .divider):
853         (.timeline-ruler > .markers > .marker):
854         (.timeline-ruler > .markers > .marker.current-time):
855         Move the `z-index` from the `.markers` container to each individual marker element so that
856         the `.marker.current-time` can override it.
857
858         * UserInterface/Views/Variables.css:
859         (:root):
860         Add `--timeline-current-time-z-index` that is above `--timeline-record-z-index`.
861
862 2020-03-28  Devin Rousso  <drousso@apple.com>
863
864         Web Inspector: support editing cookie key/values from inspector
865         https://bugs.webkit.org/show_bug.cgi?id=31157
866         <rdar://problem/19281523>
867
868         Reviewed by Timothy Hatcher.
869
870         * UserInterface/Models/Cookie.js:
871         (WI.Cookie):
872         (WI.Cookie.fromPayload):
873         (WI.Cookie.parseSetCookieResponseHeader):
874         (WI.Cookie.prototype.get session): Added.
875         (WI.Cookie.prototype.expirationDate):
876         (WI.Cookie.prototype.equals): Added.
877         (WI.Cookie.prototype.toProtocol): Added.
878         Add `session` value in addition to the existing `expires` value. Create helper methods for
879         comparing `WI.Cookie` objects and for using the `WI.Cookie` as a `Page.Cookie` type when
880         invoking protocol commands (right now just `Page.setCookie`).
881
882         * UserInterface/Views/CookieStorageContentView.js:
883         (WI.CookieStorageContentView):
884         (WI.CookieStorageContentView.prototype.get navigationItems):
885         (WI.CookieStorageContentView.prototype.tableCellContextMenuClicked):
886         (WI.CookieStorageContentView.prototype.willDismissPopover): Added.
887         (WI.CookieStorageContentView.prototype.async _willDismissCookiePopover): Added.
888         (WI.CookieStorageContentView.prototype._handleSetCookieButtonClick): Added.
889         (WI.CookieStorageContentView.prototype._reloadCookies):
890         (WI.CookieStorageContentView.prototype._formatCookiePropertyForColumn):
891         Add a + navigation item that shows a popover for creating a new cookie. When contextmenu
892         clicking on a table row, add an "Edit" item that shows a popover for creating a new cookie
893         with the values from the existing cookie, which will "replace" (delete and set) the existing
894         cookie upon being dismissed.
895
896         * UserInterface/Views/ResourceCookiesContentView.js:
897         (WI.ResourceCookiesContentView.prototype.tablePopulateCell):
898         If only use the `expires` value if `session` is not set.
899
900         * UserInterface/Views/CookiePopover.js: Added.
901         (WI.CookiePopover):
902         (WI.CookiePopover.prototype.get serializedData):
903         (WI.CookiePopover.prototype.show.createRow):
904         (WI.CookiePopover.prototype.show.createInputRow):
905         (WI.CookiePopover.prototype.show):
906         (WI.CookiePopover.prototype._presentOverTargetElement):
907         (WI.CookiePopover.prototype._defaultExpires):
908         (WI.CookiePopover.prototype._parseExpires):
909         (WI.CookiePopover.prototype._handleInputKeyDown):
910         * UserInterface/Views/CookiePopover.css: Added.
911         (.popover .cookie-popover-content):
912         (.popover .cookie-popover-content > table):
913         (.popover .cookie-popover-content > table > tr > th):
914         (.popover .cookie-popover-content > table > tr > td):
915         (.popover .cookie-popover-content > table > tr > td > input:matches([type="text"], [type="datetime-local"])):
916         (.popover .cookie-popover-content > table > tr > td > input:matches([type="text"], [type="datetime-local"]).invalid):
917         (@media (prefers-color-scheme: dark) .popover .cookie-popover-content > table > tr > th):
918         Show an  `<input>` (or `<select>`) for each configuration option when creating a cookie.
919         Hide the `<input>` for `expires` if the `<input type="checkbox">` for `session` is checked.
920         Indicate when the value in the `<input>` for `expires` is not a valid date.
921
922         * UserInterface/Main.html:
923         * Localizations/en.lproj/localizedStrings.js:
924
925 2020-03-28  Devin Rousso  <drousso@apple.com>
926
927         Web Inspector: CSS: create visual editor for `box-shadow`
928         https://bugs.webkit.org/show_bug.cgi?id=208380
929
930         Reviewed by Timothy Hatcher.
931
932         Recognize `box-shadow` CSS properties in the Styles sidebar, parse the comma-separated list
933         value for individual box shadows, and create a `WI.InlineSwatch` for each. When clicked,
934         show a `WI.Popover` with a `WI.BoxShadowEditor`, which contains a table of editors:
935
936             Offset X |   <input type="text">   |   [ 2D (X & Y) ]
937             Offset Y |   <input type="text">   |   [   Slider   ]
938                Inset | <input type="checkbox"> |
939                 Blur |   <input type="text">   | <input type="range">
940               Spread |   <input type="text">   | <input type="range">
941             [                                                       ]
942             [                                                       ]
943             [                   full color picker                   ]
944             [                                                       ]
945             [                                                       ]
946
947
948         * UserInterface/Models/BoxShadow.js: Added.
949         (WI.BoxShadow):
950         (WI.BoxShadow.fromString):
951         (WI.BoxShadow.parseNumberComponent):
952         (WI.BoxShadow.prototype.get offsetX):
953         (WI.BoxShadow.prototype.get offsetY):
954         (WI.BoxShadow.prototype.get blurRadius):
955         (WI.BoxShadow.prototype.get spreadRadius):
956         (WI.BoxShadow.prototype.get inset):
957         (WI.BoxShadow.prototype.get color):
958         (WI.BoxShadow.prototype.copy):
959         (WI.BoxShadow.prototype.toString):
960         (WI.BoxShadow.prototype.toString.stringifyNumberComponent):
961
962         * UserInterface/Models/CSSCompletions.js:
963         Add a `Set` of allowed CSS length units.
964
965         * UserInterface/Views/BoxShadowEditor.js: Added.
966         (WI.BoxShadowEditor):
967         (WI.BoxShadowEditor.createInputRow):
968         (WI.BoxShadowEditor.createSlider):
969         (WI.BoxShadowEditor.prototype.get element):
970         (WI.BoxShadowEditor.prototype.get boxShadow):
971         (WI.BoxShadowEditor.prototype.set boxShadow):
972         (WI.BoxShadowEditor.prototype.handleEvent):
973         (WI.BoxShadowEditor.prototype._updateBoxShadow):
974         (WI.BoxShadowEditor.prototype._updateBoxShadowOffsetFromSliderMouseEvent):
975         (WI.BoxShadowEditor.prototype._determineShiftForEvent):
976         (WI.BoxShadowEditor.prototype._handleOffsetSliderSVGKeyDown):
977         (WI.BoxShadowEditor.prototype._handleOffsetSliderSVGMouseDown):
978         (WI.BoxShadowEditor.prototype._handleWindowMouseMove):
979         (WI.BoxShadowEditor.prototype._handleWindowMouseUp):
980         (WI.BoxShadowEditor.prototype._handleOffsetXInputInput):
981         (WI.BoxShadowEditor.prototype._handleOffsetXInputKeyDown):
982         (WI.BoxShadowEditor.prototype._handleOffsetYInputInput):
983         (WI.BoxShadowEditor.prototype._handleOffsetYInputKeyDown):
984         (WI.BoxShadowEditor.prototype._handleBlurRadiusInputInput):
985         (WI.BoxShadowEditor.prototype._handleBlurRadiusInputKeyDown):
986         (WI.BoxShadowEditor.prototype._handleBlurRadiusSliderInput):
987         (WI.BoxShadowEditor.prototype._handleSpreadRadiusInputInput):
988         (WI.BoxShadowEditor.prototype._handleSpreadRadiusInputKeyDown):
989         (WI.BoxShadowEditor.prototype._handleSpreadRadiusSliderInput):
990         (WI.BoxShadowEditor.prototype._handleInsetCheckboxChange):
991         (WI.BoxShadowEditor.prototype._handleColorChanged):
992         * UserInterface/Views/BoxShadowEditor.css: Added.
993         (.box-shadow-editor):
994         (.box-shadow-editor > table):
995         (.box-shadow-editor > table > tr > th):
996         (.box-shadow-editor > table > tr > td):
997         (.box-shadow-editor > table > tr > td > input[type="text"]):
998         (.box-shadow-editor > table > tr > td > input[type="range"]):
999         (.box-shadow-editor > table > tr > td > svg):
1000         (.box-shadow-editor > table > tr > td > svg line.axis):
1001         (.box-shadow-editor > table > tr > td > svg line:not(.axis)):
1002         (.box-shadow-editor > table > tr > td > svg circle):
1003         (@media (prefers-color-scheme: dark) .box-shadow-editor > table > tr > th):
1004
1005         * UserInterface/Views/InlineSwatch.js:
1006         (WI.InlineSwatch):
1007         (WI.InlineSwatch.prototype._fallbackValue):
1008         (WI.InlineSwatch.prototype._valueEditorValueDidChange):
1009         * UserInterface/Views/InlineSwatch.css:
1010         (.inline-swatch):
1011         (.inline-swatch:not(.box-shadow), .inline-swatch.box-shadow:matches(:hover, :active)): Added.
1012         (.inline-swatch:matches(.bezier, .box-shadow, .spring, .variable)): Added.
1013         (.inline-swatch:not(.read-only):matches(.bezier, .box-shadow, .spring, .variable):hover): Added.
1014         (.inline-swatch:not(.read-only):matches(.bezier, .box-shadow, .spring, .variable):active): Added.
1015         (.inline-swatch:matches(.bezier, .box-shadow, .spring, .variable) > span): Added.
1016         (@media (prefers-color-scheme: dark) .inline-swatch.box-shadow > svg): Added.
1017         (.inline-swatch:not(.read-only):matches(.bezier, .spring, .variable):hover): Deleted.
1018         (.inline-swatch:not(.read-only):matches(.bezier, .spring, .variable):active): Deleted.
1019         (.inline-swatch:matches(.bezier, .spring, .variable) > span): Deleted.
1020
1021         * UserInterface/Views/SpreadsheetStyleProperty.js:
1022         (WI.SpreadsheetStyleProperty.prototype._replaceSpecialTokens):
1023         (WI.SpreadsheetStyleProperty.prototype._addGradientTokens):
1024         (WI.SpreadsheetStyleProperty.prototype._addColorTokens):
1025         (WI.SpreadsheetStyleProperty.prototype._addTimingFunctionTokens):
1026         (WI.SpreadsheetStyleProperty.prototype._addBoxShadowTokens):
1027         (WI.SpreadsheetStyleProperty.prototype._resolveVariables):
1028
1029         * UserInterface/Views/Variables.css:
1030         (:root):
1031         * UserInterface/Views/ColorPicker.css:
1032         (.color-picker):
1033         Move `--color-picker-width` to `:root` so that `WI.BoxShadowEditor` can use it.
1034
1035         * UserInterface/Main.html:
1036         * UserInterface/Test.html:
1037         * Localizations/en.lproj/localizedStrings.js:
1038         * UserInterface/Images/BoxShadow.svg: Added.
1039
1040 2020-03-28  Devin Rousso  <drousso@apple.com>
1041
1042         Web Inspector: REGRESSION(r257759): Network: graph in Timing pane of selected resource is missing bars
1043         https://bugs.webkit.org/show_bug.cgi?id=209525
1044
1045         Reviewed by Timothy Hatcher.
1046
1047         `WI.ResourceTimingBreakdownView` uses the same CSS classes and DOM structure as the parent
1048         `WI.NetworkTableContentView`, relying on the styles defined there for it's own styles.
1049
1050         * UserInterface/Views/NetworkTableContentView.css:
1051         (.network-table > .table li:not(.filler, .selected) .cell:not(.current-session)): Added.
1052         (.network-table .error): Added.
1053         (.network-table .waterfall .block): Added.
1054         (body[dir=ltr] .network-table .waterfall .block): Added.
1055         (body[dir=rtl] .network-table .waterfall .block): Added.
1056         (.network-table .waterfall .block.request,): Added.
1057         (.network-table .waterfall .block.mouse-tracking): Added.
1058         (.network-table .waterfall .block.filler): Added.
1059         (.network-table .waterfall .block.redirect): Added.
1060         (.network-table .waterfall .block.queue): Added.
1061         (.network-table .waterfall .block.dns): Added.
1062         (.network-table .waterfall .block.connect): Added.
1063         (.network-table .waterfall .block.secure): Added.
1064         (.network-table .waterfall .block.request): Added.
1065         (.network-table .waterfall .block.response): Added.
1066         (.network-table > .table li:not(.selected) .cell:not(.current-session)): Deleted.
1067         (.network-table > .table .error): Deleted.
1068         (.network-table > .table .waterfall .block): Deleted.
1069         (body[dir=ltr] .network-table > .table .waterfall .block): Deleted.
1070         (body[dir=rtl] .network-table > .table .waterfall .block): Deleted.
1071         (.network-table > .table .waterfall .block.request,): Deleted.
1072         (.network-table > .table .waterfall .block.mouse-tracking): Deleted.
1073         (.network-table > .table .waterfall .block.filler): Deleted.
1074         (.network-table > .table .waterfall .block.redirect): Deleted.
1075         (.network-table > .table .waterfall .block.queue): Deleted.
1076         (.network-table > .table .waterfall .block.dns): Deleted.
1077         (.network-table > .table .waterfall .block.connect): Deleted.
1078         (.network-table > .table .waterfall .block.secure): Deleted.
1079         (.network-table > .table .waterfall .block.request): Deleted.
1080         (.network-table > .table .waterfall .block.response): Deleted.
1081         Drive-by: the `WI.Table` filler row should not be dimmed.
1082
1083         * UserInterface/Views/ResourceTimingBreakdownView.css:
1084         (.resource-timing-breakdown .waterfall .block):
1085
1086 2020-03-28  Nikita Vasilyev  <nvasilyev@apple.com>
1087
1088         Web Inspector: Network: pressing RightArrow or LeftArrow unexpectedly changes panels
1089         https://bugs.webkit.org/show_bug.cgi?id=209625
1090         <rdar://problem/60940609>
1091
1092         Reviewed by Timothy Hatcher.
1093
1094         * UserInterface/Views/NavigationBar.js:
1095         (WI.NavigationBar.prototype._keyDown):
1096
1097 2020-03-27  Devin Rousso  <drousso@apple.com>
1098
1099         Web Inspector: should also escape the method when Copy as cURL
1100         https://bugs.webkit.org/show_bug.cgi?id=209665
1101         <rdar://problem/58432154>
1102
1103         Reviewed by Joseph Pecoraro.
1104
1105         * UserInterface/Models/Resource.js:
1106         (WI.Resource.prototype.generateCURLCommand):
1107         (WI.Resource.prototype.generateCURLCommand.escapeStringPosix):
1108         The method could be maliciously crafted, so we should also escape it (if needed).
1109
1110 2020-03-26  Devin Rousso  <drousso@apple.com>
1111
1112         Web Inspector: add keyboard shortcut to tooltip of pinned tabs
1113         https://bugs.webkit.org/show_bug.cgi?id=209640
1114
1115         Reviewed by Timothy Hatcher.
1116
1117         * UserInterface/Views/TabBarItem.js:
1118         (WI.TabBarItem):
1119         (WI.TabBarItem.prototype.get displayName): Added.
1120         (WI.TabBarItem.prototype.set displayName): Added.
1121         (WI.TabBarItem.prototype.set title):
1122         (WI.TabBarItem.prototype.titleDidChange): Deleted.
1123         * UserInterface/Views/GeneralTabBarItem.js:
1124         (WI.GeneralTabBarItem.fromTabContentView):
1125         (WI.GeneralTabBarItem.prototype.get displayName): Added.
1126         (WI.GeneralTabBarItem.prototype.set displayName): Added.
1127         (WI.GeneralTabBarItem.prototype.get title): Deleted.
1128         (WI.GeneralTabBarItem.prototype.set title): Deleted.
1129         * UserInterface/Views/PinnedTabBarItem.js:
1130         (WI.PinnedTabBarItem):
1131         (WI.PinnedTabBarItem.fromTabContentView):
1132         (WI.PinnedTabBarItem.titleDidChange): Deleted.
1133         * UserInterface/Views/TabBar.css:
1134         (.tab-bar > .tabs > .item > .name): Added.
1135         (body.window-inactive .tab-bar > .tabs > .item > .name): Added.
1136         (.tab-bar > .tabs > .item > .name > .content): Added.
1137         (.tab-bar > .tabs > .item:not(.selected):hover > .name): Added.
1138         (.tab-bar > .tabs > .item:not(.disabled).selected > .name): Added.
1139         (body.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected > .name): Added.
1140         (.tab-bar > .tabs > .item > .title): Deleted.
1141         (body.window-inactive .tab-bar > .tabs > .item > .title): Deleted.
1142         (.tab-bar > .tabs > .item > .title > .content): Deleted.
1143         (.tab-bar > .tabs > .item:not(.selected):hover > .title): Deleted.
1144         (.tab-bar > .tabs > .item:not(.disabled).selected > .title): Deleted.
1145         (body.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected > .title): Deleted.
1146         Separate the shown name of the tab (`displayName`) from the tooltip text (`title`).
1147
1148         * UserInterface/Views/SearchTabContentView.js:
1149         (WI.SearchTabContentView.tabInfo):
1150         * UserInterface/Views/SettingsTabContentView.js:
1151         (WI.SettingsTabContentView.tabInfo):
1152         Move the current `title` value to `displayName` and add a new `title` value with the
1153         keyboard shortcut in parenthesis.
1154
1155         * UserInterface/Views/AuditTabContentView.js:
1156         (WI.AuditTabContentView.tabInfo):
1157         * UserInterface/Views/ConsoleTabContentView.js:
1158         (WI.ConsoleTabContentView.tabInfo):
1159         * UserInterface/Views/ElementsTabContentView.js:
1160         (WI.ElementsTabContentView.tabInfo):
1161         * UserInterface/Views/GraphicsTabContentView.js:
1162         (WI.GraphicsTabContentView.tabInfo):
1163         * UserInterface/Views/LayersTabContentView.js:
1164         (WI.LayersTabContentView.tabInfo):
1165         * UserInterface/Views/NetworkTabContentView.js:
1166         (WI.NetworkTabContentView.tabInfo):
1167         * UserInterface/Views/SourcesTabContentView.js:
1168         (WI.SourcesTabContentView.tabInfo):
1169         * UserInterface/Views/StorageTabContentView.js:
1170         (WI.StorageTabContentView.tabInfo):
1171         * UserInterface/Views/TimelineTabContentView.js:
1172         (WI.TimelineTabContentView.tabInfo):
1173         Use `displayName` instead of `title` since the name is shown in the UI.
1174
1175         * UserInterface/Base/Main.js:
1176         (WI.contentLoaded):
1177         Make the Settings Tab shortcut public.
1178
1179         * Localizations/en.lproj/localizedStrings.js:
1180
1181 2020-03-26  Nikita Vasilyev  <nvasilyev@apple.com>
1182
1183         Web Inspector: RTL: ArrowLeft and ArrowRight keys select wrong navigation bar items
1184         https://bugs.webkit.org/show_bug.cgi?id=209617
1185
1186         Reviewed by Devin Rousso.
1187
1188         * UserInterface/Views/NavigationBar.js:
1189         (WI.NavigationBar.prototype._keyDown):
1190         Reverse direction for RTL mode.
1191
1192 2020-03-23  Devin Rousso  <drousso@apple.com>
1193
1194         Web Inspector: REGRESSION(r257791): event breakpoint icon should be [E]
1195         https://bugs.webkit.org/show_bug.cgi?id=209434
1196
1197         Reviewed by Timothy Hatcher.
1198
1199         * UserInterface/Images/TypeIcons.svg:
1200
1201         * UserInterface/Views/PathComponentIcons.css:
1202         (.snapshot-list-icon .icon):
1203         (@media (prefers-color-scheme: dark) .snapshot-list-icon .icon):
1204         Drive-by: make a separate "HeapSnapshotList" target so that it won't be affected if "Events"
1205                   is ever changed.
1206
1207 2020-03-23  Devin Rousso  <drousso@apple.com>
1208
1209         REGRESSION(r257759, r258623): Web Inspector: Settings icon sometimes placed below the tab bar
1210         https://bugs.webkit.org/show_bug.cgi?id=208603
1211         <rdar://problem/60108967>
1212
1213         Reviewed by Timothy Hatcher.
1214
1215         * UserInterface/Views/TabBar.js:
1216         (WI.TabBar.prototype.layout):
1217         If the total width of all `WI.GeneralTabBarItem` is not an integer, it needs to be rounded
1218         when compared to the width of the container `WI.TabBar`. This is be necessary because CSS
1219         often rounds to the nearest pixel, meaning that `99.5px` would actually render as `100px`,
1220         whereas `99.4px` would render as `99px`.
1221
1222         * UserInterface/Views/TabBar.css:
1223         (body:not(.docked) .tab-bar > .tabs:not(.calculate-width) > .item:not(.pinned)): Added.
1224         (.tab-bar > .tabs.calculate-width > .item:not(.pinned)): Added.
1225         (body:not(.docked) .tab-bar > .tabs > .item:not(.pinned)): Deleted.
1226         (.tab-bar > .tabs.calculate-width > .item): Deleted.
1227         When undocked, force all `WI.GeneralTabBarItem` to take up as little width as possible when
1228         resizing so that if there isn't enough room for all of them, any that `flex-wrap` won't be
1229         incorrectly perceived as needing a much larger width.
1230
1231         * UserInterface/Debug/Bootstrap.css:
1232         (.tab-bar > .navigation-bar .inspect-inspector):
1233         Ensure that the "inspect inspector" navigation item has an integer pixel width.
1234
1235 2020-03-23  Devin Rousso  <drousso@apple.com>
1236
1237         Web Inspector: Uncaught Exception: TypeError: this._springEditor.removeListeners is not a function. (In 'this._springEditor.removeListeners()', 'this._springEditor.removeListeners' is undefined)
1238         https://bugs.webkit.org/show_bug.cgi?id=209325
1239
1240         Reviewed by Brian Burg.
1241
1242         * UserInterface/Controllers/CodeMirrorSpringEditingController.js:
1243         (WI.CodeMirrorSpringEditingController.prototype.popoverDidDismiss): Deleted.
1244
1245 2020-03-22  Devin Rousso  <drousso@apple.com>
1246
1247         Web Inspector: Uncaught Exception: Right side of assignment cannot be destructured (at QuickConsole.js:358:30)
1248         https://bugs.webkit.org/show_bug.cgi?id=209388
1249
1250         Reviewed by Joseph Pecoraro.
1251
1252         * UserInterface/Views/QuickConsole.js:
1253         (WI.QuickConsole.prototype._handleFramePageExecutionContextChanged):
1254
1255 2020-03-21  Devin Rousso  <drousso@apple.com>
1256
1257         Web Inspector: REGRESSION(r257380, r257759): focusing the inspected page when docked dims most of the interface
1258         https://bugs.webkit.org/show_bug.cgi?id=209366
1259
1260         Reviewed by Timothy Hatcher.
1261
1262         * UserInterface/Views/ButtonNavigationItem.css:
1263         (body.window-inactive .navigation-bar .item.button > img): Added.
1264         (body.window-inactive .navigation-bar .item.button.disabled > img): Added.
1265         (body:matches(.window-inactive, .window-docked-inactive) .navigation-bar .item.button > img): Deleted.
1266         (body:matches(.window-inactive, .window-docked-inactive) .navigation-bar .item.button.disabled > img): Deleted.
1267         * UserInterface/Views/RenderingFrameTimelineOverviewGraph.css:
1268         (body.window-inactive .timeline-overview-graph.rendering-frame > .frame-marker): Added.
1269         (body:matches(.window-inactive, .window-docked-inactive) .timeline-overview-graph.rendering-frame > .frame-marker): Deleted.
1270         * UserInterface/Views/TabBar.css:
1271         (body:not(.docked).window-inactive .tab-bar): Added.
1272         (body.docked.window-inactive .tab-bar): Added.
1273         (body.window-inactive .tab-bar > .border): Added.
1274         (body.window-inactive .tab-bar > .navigation-bar > .item.divider): Added.
1275         (body:not(.docked).window-inactive .tab-bar > .tabs > .item): Added.
1276         (body:not(.docked).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Added.
1277         (body.docked.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Added.
1278         (body.window-inactive .tab-bar > .tabs > .item > .icon): Added.
1279         (body.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected > .icon): Added.
1280         (body.window-inactive .tab-bar > .tabs > .item > .title): Added.
1281         (body.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected > .title): Added.
1282         (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): Added.
1283         (@media (prefers-color-scheme: dark) body.docked.window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Added.
1284         (@media (prefers-color-scheme: dark) body:not(.docked).window-inactive .tab-bar): Added.
1285         (@media (prefers-color-scheme: dark) body:not(.docked).window-inactive .tab-bar > .tabs > .item): Added.
1286         (@media (prefers-color-scheme: dark) body:not(.docked).window-inactive .tab-bar > .tabs > .item:not(.disabled).selected): Added.
1287         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar): Deleted.
1288         (body.docked:matches(.window-inactive, .window-docked-inactive) .tab-bar): Deleted.
1289         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .border): Deleted.
1290         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .navigation-bar > .item.divider): Deleted.
1291         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item): Deleted.
1292         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
1293         (body.docked:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
1294         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item > .icon): Deleted.
1295         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected > .icon): Deleted.
1296         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item > .title): Deleted.
1297         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected > .title): Deleted.
1298         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected, body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.static-layout:not(.animating.inserting-tab):not(.dragging-tab) > .item:nth-last-child(1 of :not(.pinned)), body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.animating.closing-tab > .item:not(.disabled).selected): Deleted.
1299         (@media (prefers-color-scheme: dark) body.docked:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
1300         (@media (prefers-color-scheme: dark) body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar): Deleted.
1301         (@media (prefers-color-scheme: dark) body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item): Deleted.
1302         (@media (prefers-color-scheme: dark) body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
1303         * UserInterface/Views/TimelineRecordFrame.css:
1304         (body.window-inactive .timeline-record-frame.selected): Added.
1305         (body:matches(.window-inactive, .window-docked-inactive) .timeline-record-frame.selected): Deleted.
1306         * UserInterface/Views/TimelineRuler.css:
1307         (body.window-inactive .timeline-ruler > .header > .divider): Added.
1308         (body:matches(.window-inactive, .window-docked-inactive) .timeline-ruler > .header > .divider): Deleted.
1309         * UserInterface/Views/Variables.css:
1310         (body.window-inactive): Added.
1311         (body.window-inactive *): Added.
1312         (@media (prefers-color-scheme: dark) body.window-inactive): Added.
1313         (@media (prefers-color-scheme: dark) body.window-inactive *): Added.
1314         (body:matches(.window-inactive, .window-docked-inactive)): Deleted.
1315         (body:matches(.window-inactive, .window-docked-inactive) *): Deleted.
1316         (@media (prefers-color-scheme: dark) body:matches(.window-inactive, .window-docked-inactive)): Deleted.
1317         (@media (prefers-color-scheme: dark) body:matches(.window-inactive, .window-docked-inactive) *): Deleted.
1318         Remove usage of `.window-docked-inactive` as we don't want the UI to change when the focus
1319         switches between the inspected page and the docked Web Inspector area, which happens a lot.
1320
1321         * UserInterface/Views/BreakpointTreeElement.css:
1322         (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.breakpoint.selected .status > .status-image.resolved): Added.
1323         (.tree-outline:focus .item.breakpoint.selected .status > .status-image.resolved): Deleted.
1324         * UserInterface/Views/CallFrameTreeElement.css:
1325         (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.call-frame.selected .status > .status-image): Added.
1326         (.tree-outline:focus .item.call-frame.selected .status > .status-image): Deleted.
1327         * UserInterface/Views/CanvasSidebarPanel.css:
1328         (body:not(.window-inactive, .window-docked-inactive) .sidebar > .panel.navigation.canvas > .content > .recording-content > .tree-outline:focus-within .item.processing.selected .subtitle > progress): Added.
1329         (.sidebar > .panel.navigation.canvas > .content > .recording-content > .tree-outline:focus .item.processing.selected .subtitle > progress): Deleted.
1330         * UserInterface/Views/DOMTreeContentView.css:
1331         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom-tree:focus-within .tree-outline.dom li:matches(.selected, .hovered) .status-image.breakpoint): Added.
1332         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom-tree:focus-within .tree-outline.dom li:matches(.selected, .hovered) .status-image.breakpoint.subtree): Added.
1333         (body:not(.window-inactive, .window-docked-inactive) .content-view.dom-tree .tree-outline.dom:focus li:matches(.selected, .hovered) .status-image.breakpoint): Deleted.
1334         (body:not(.window-inactive, .window-docked-inactive) .content-view.dom-tree .tree-outline.dom:focus li:matches(.selected, .hovered) .status-image.breakpoint.subtree): Deleted.
1335         * UserInterface/Views/DOMTreeOutline.css:
1336         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:not(.non-selectable):focus-within li.selected .selection-area): Added.
1337         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.inspected-node.selected > span::after): Added.
1338         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected .pseudo-class-indicator): Added.
1339         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected): Added.
1340         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.selected *): Added.
1341         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.parent.selected::before): Added.
1342         (body:not(.window-inactive, .window-docked-inactive) .tree-outline.dom:focus-within li.parent.expanded.selected::before): Added.
1343         (.tree-outline.dom:not(.non-selectable):focus-within li.selected .selection-area): Deleted.
1344         (.tree-outline.dom:focus-within li.inspected-node.selected > span::after): Deleted.
1345         (.tree-outline.dom:focus-within li.selected .pseudo-class-indicator): Deleted.
1346         (.tree-outline.dom:focus-within li.selected): Deleted.
1347         (.tree-outline.dom:focus-within li.selected *): Deleted.
1348         (.tree-outline.dom:focus-within li.parent.selected::before): Deleted.
1349         (.tree-outline.dom:focus-within li.parent.expanded.selected::before): Deleted.
1350         * UserInterface/Views/Main.css:
1351         (:focus .selected .go-to-arrow, .selected:focus .go-to-arrow): Added.
1352         (:focus .selected .go-to-arrow:active, .selected .go:focus-to-arrow:active): Added.
1353         (@media (prefers-color-scheme: dark) :focus .selected .go-to-arrow, .selected:focus .go-to-arrow): Added.
1354         (:focus .selected .go-to-arrow): Deleted.
1355         (:focus .selected .go-to-arrow:active): Deleted.
1356         (@media (prefers-color-scheme: dark) :focus .selected .go-to-arrow): Deleted.
1357         * UserInterface/Views/RecordingActionTreeElement.css:
1358         (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.recording-action.selected:not(.invalid, .initial-state, .has-context-replacer, .name-unknown) > .icon): Added.
1359         (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.recording-action.selected > .titles .parameter.swizzled, body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.recording-action.selected::before): Added.
1360         (.tree-outline:focus .item.recording-action.selected:not(.invalid, .initial-state, .has-context-replacer, .name-unknown) > .icon): Deleted.
1361         (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus .item.recording-action.selected > .titles .parameter.swizzled, body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus .item.recording-action.selected::before): Deleted.
1362         * UserInterface/Views/ResourceTreeElement.css:
1363         (.item.resource.resource-type-websocket:not(.selected) .status .ready-state.open, .tree-outline:not(:focus-within) .item.resource.resource-type-websocket.selected .status .ready-state.open, body:matches(.window-inactive, .window-docked-inactive) .item.resource.resource-type-websocket.selected .status .ready-state.open): Added.
1364         (.item.resource.resource-type-websocket:not(.selected) .status .ready-state.connecting, .tree-outline:not(:focus-within) .item.resource.resource-type-websocket.selected .status .ready-state.connecting, body:matches(.window-inactive, .window-docked-inactive) .item.resource.resource-type-websocket.selected .status .ready-state.connecting): Added.
1365         (.item.resource.resource-type-websocket:not(.selected) .status .ready-state.open, .tree-outline:not(:focus) .item.resource.resource-type-websocket.selected .status .ready-state.open, body:matches(.window-inactive, .window-docked-inactive) .item.resource.resource-type-websocket.selected .status .ready-state.open): Deleted.
1366         (.item.resource.resource-type-websocket:not(.selected) .status .ready-state.connecting, .tree-outline:not(:focus) .item.resource.resource-type-websocket.selected .status .ready-state.connecting, body:matches(.window-inactive, .window-docked-inactive) .item.resource.resource-type-websocket.selected .status .ready-state.connecting): Deleted.
1367         * UserInterface/Views/ScriptDetailsTimelineView.css:
1368         (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.selected .alternate-subtitle): Added.
1369         (.tree-outline:focus .item.selected .alternate-subtitle): Deleted.
1370         * UserInterface/Views/SourceCodeTreeElement.css:
1371         (.tree-outline .item .status > .toggle-script-blackbox, body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.selected .status > .toggle-script-blackbox.pattern-blackboxed): Added.
1372         (.tree-outline .item .status > .toggle-script-blackbox, .tree-outline:focus .item.selected .status > .toggle-script-blackbox.pattern-blackboxed): Deleted.
1373         * UserInterface/Views/ThreadTreeElement.css:
1374         (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within > .item.thread.selected .status-button.resume): Added.
1375         (.tree-outline:focus > .item.thread.selected .status-button.resume): Deleted.
1376         * UserInterface/Views/TimelineOverview.css:
1377         (.timeline-overview > .tree-outline.timelines .item.selected + .item): Added.
1378         (body:not(.window-inactive, .window-docked-inactive) .timeline-overview > .tree-outline.timelines:focus-within .item.selected + .item): Added.
1379         (@media (prefers-color-scheme: dark) .timeline-overview > .tree-outline.timelines .item.selected + .item): Added.
1380         (.timeline-overview > .tree-outline.timelines .item.selected + .item, body:matches(.window-inactive, .window-docked-inactive) .timeline-overview > .tree-outline.timelines .item.selected + .item): Deleted.
1381         (.timeline-overview > .tree-outline.timelines :focus .item.selected + .item): Deleted.
1382         (@media (prefers-color-scheme: dark) .timeline-overview > .tree-outline.timelines .item.selected + .item, body:matches(.window-inactive, .window-docked-inactive) .timeline-overview > .tree-outline.timelines .item.selected + .item): Deleted.
1383         * UserInterface/Views/TreeElementStatusButton.css:
1384         (body:not(.window-inactive, .window-docked-inactive) .tree-outline:focus-within .item.selected > .status > .status-button): Added.
1385         (:focus .item.selected > .status > .status-button): Deleted.
1386         Fix cases where `:focus` was still being checked from the `WI.TreeOutline` instead of the
1387         individual `WI.TreeElement`. We should be using `:focus-within`, but only if the window or
1388         docked Web Inspector area is also focused.
1389
1390 2020-03-20  Devin Rousso  <drousso@apple.com>
1391
1392         Web Inspector: REGRESSION(r257835): close and undock buttons are shown in remote inspector
1393         https://bugs.webkit.org/show_bug.cgi?id=209346
1394
1395         Reviewed by Timothy Hatcher.
1396
1397         In the case of remote inspection, the frontend is told that docking is not available before
1398         it is even shown (via `InspectorFrontendAPI.setDockingUnavailable`). Additionally, the
1399         backend (`WebKit::RemoteWebInspectorUI`) never tells the frontend what dock side it actually
1400         is (via `InspectorFrontendAPI.setDockSide`), as there would be no point, given that docking
1401         is unavailable, meaning that the frontend must be undocked.
1402
1403         Before r257835, the docking state held by `WI._dockConfiguration` and `WI.docked`, neither
1404         of which would be set as described above. As a result, in `WI._updateDockNavigationItems`
1405         `WI.docked` would be undefined, which is falsy, thereby causing all docking navigation items
1406         to be hidden. After r257835, these were merged into one `WI.dockConfiguration`, which is
1407         compared against `WI.DockConfiguration.Undocked` instead of just being falsy checked,
1408         meaning it would result in `true` which would not hide all of the docking navigation items.
1409
1410         Change the logic of `WI.updateDockingAvailability` such that if the frontend is told that
1411         docking is unavailable, mark the `WI.dockConfiguration` as `WI.DockConfiguration.Undocked`.
1412         This way, the frontend will always have a valid value for `WI.dockConfiguration`.
1413
1414         Additionally, further leverage `InspectorFrontendHost.supportsDockSide` to only create the
1415         docking navigation items that are actually supported by the host.
1416
1417         * UserInterface/Base/Main.js:
1418         (WI.contentLoaded):
1419         (WI.updateDockingAvailability):
1420         (WI.resizeDockedFrameMouseDown):
1421         (WI.dockedConfigurationSupportsSplitContentBrowser):
1422         (WI._updateDockNavigationItems):
1423         (WI._updateTabBarDividers):
1424
1425         * UserInterface/Views/TabBar.js:
1426         (WI.TabBar.get horizontalPadding):
1427         (WI.TabBar.prototype.resetCachedWidths): Added.
1428         When switching dock configurations, we need to reset the cached width of each tab bar item,
1429         as otherwise, a large width cached when undocked can incorrectly be used when docked.
1430
1431         * UserInterface/Views/TabBarItem.js:
1432         (WI.TabBarItem.get horizontalMargin):
1433         Replace negative checks of `WI.dockConfiguration` with positive ones that can't be fooled by
1434         a falsy value.
1435
1436 2020-03-19  Nikita Vasilyev  <nvasilyev@apple.com>
1437
1438         Web Inspector: AXI: disabled buttons shouldn't be focusable
1439         https://bugs.webkit.org/show_bug.cgi?id=208283
1440         <rdar://problem/59832150>
1441
1442         Reviewed by Devin Rousso.
1443
1444         Set tabIndex to "-1" when button becomes disabled.
1445
1446         * UserInterface/Views/ActivateButtonNavigationItem.js:
1447         (WI.ActivateButtonNavigationItem):
1448         * UserInterface/Views/ButtonNavigationItem.js:
1449         `_role` is defined in the parent class now.
1450
1451         (WI.ButtonNavigationItem):
1452         (WI.ButtonNavigationItem.prototype.set enabled):
1453         (WI.ButtonNavigationItem.prototype.get tabbable):
1454         (WI.ButtonNavigationItem.prototype._updateTabIndex):
1455         * UserInterface/Views/RadioButtonNavigationItem.js:
1456         (WI.RadioButtonNavigationItem.prototype.get tabbable):
1457         (WI.RadioButtonNavigationItem):
1458
1459 2020-03-19  Nikita Vasilyev  <nvasilyev@apple.com>
1460
1461         Web Inspector: remove redundant code in TreeOutline.prototype.removeChildAtIndex
1462         https://bugs.webkit.org/show_bug.cgi?id=209301
1463
1464         Reviewed by Joseph Pecoraro.
1465
1466         * UserInterface/Views/TreeOutline.js:
1467         (WI.TreeOutline.prototype.removeChildAtIndex):
1468         Check `suppressSelectSibling` once instead of three times.
1469
1470 2020-03-17  Devin Rousso  <drousso@apple.com>
1471
1472         Web Inspector: the width of `WI.TabBarItem` can change if the detached window is resized
1473         https://bugs.webkit.org/show_bug.cgi?id=209200
1474
1475         Reviewed by Timothy Hatcher.
1476
1477         * UserInterface/Views/TabBar.js:
1478         (WI.TabBar.prototype.layout):
1479         (WI.TabBar.prototype.layout.measureWidth): Renamed from `measureItemWidth`.
1480         When undocked, `WI.TabBarItem` grow to fill any available space. As a result, if a
1481         `WI.TabBarItem` is added or removed, the width of all `WI.TabBarItem` will change.
1482         Wait to measure widths until all `WI.TabBarItem` are un-hidden for the reason above.
1483
1484 2020-03-17  Devin Rousso  <drousso@apple.com>
1485
1486         Web Inspector: Network: we should prefer showing "Preserve Log" over "Group Media Requests"
1487         https://bugs.webkit.org/show_bug.cgi?id=209199
1488
1489         Reviewed by Timothy Hatcher.
1490
1491         * UserInterface/Views/NetworkTableContentView.js:
1492         (WI.NetworkTableContentView):
1493         Change the `WI.NavigationItem.VisibilityPriority` of the various `WI.NavigationItem`:
1494           High:
1495            - URL filter
1496            - resource type filter
1497            - live/HAR view switcher
1498            - disable resource caching toggle
1499           Normal:
1500            - Preserve Log checkbox
1501            - clear button
1502           Low:
1503            - Group Media Requests checkbox
1504            - HAR import/export buttons
1505         This way, items that have alternate ways of being triggered (e.g. keyboard shortcuts) are
1506         hidden first, and vica versa.
1507
1508 2020-03-17  Devin Rousso  <drousso@apple.com>
1509
1510         Web Inspector: Sources: hovering the title of an object preview popup for a DOM node doesn't highlight it
1511         https://bugs.webkit.org/show_bug.cgi?id=209159
1512
1513         Reviewed by Timothy Hatcher.
1514
1515         * UserInterface/Views/SourceCodeTextEditor.js:
1516         (WI.SourceCodeTextEditor.prototype._showPopoverForObject):
1517
1518 2020-03-17  Devin Rousso  <drousso@apple.com>
1519
1520         REGRESSION(r257759): Web Inspector: Settings icon sometimes placed below the tab bar
1521         https://bugs.webkit.org/show_bug.cgi?id=208603
1522         <rdar://problem/60108967>
1523
1524         Reviewed by Brian Burg.
1525
1526         * UserInterface/Views/TabBar.js:
1527         (WI.TabBar.prototype.layout):
1528         Don't take into account the width of the flexible space before or after the normal tab bar
1529         items since they will shrink to fit (the container is using `display: flex;`). Instead, use
1530         determine the available space by subtracting the width of every `WI.PinnedTabBarItem` from
1531         the `realOffsetWidth` of the container, comparing against the sum of the `realOffsetWidth`
1532         of all `WI.GeneralTabBarItem`. If the sum is greater than the available space, successively
1533         mark items from the end (right in LTR, left in RTL) as hidden until the remaining will fit.
1534
1535 2020-03-16  Nikita Vasilyev  <nvasilyev@apple.com>
1536
1537         REGRESSION(r257380): Web Inspector: deleting node causes TreeOutline to lose focus
1538         https://bugs.webkit.org/show_bug.cgi?id=208364
1539         <rdar://problem/59871772>
1540
1541         Reviewed by Devin Rousso.
1542
1543         Maintain keyboard focus within TreeOutline when selection changes.
1544
1545         * UserInterface/Views/TreeElement.js:
1546         (WI.TreeElement.prototype.select):
1547
1548 2020-03-15  Yusuke Suzuki  <ysuzuki@apple.com>
1549
1550         Should not use variable-length-array (VLA)
1551         https://bugs.webkit.org/show_bug.cgi?id=209043
1552
1553         Reviewed by Mark Lam.
1554
1555         * Configurations/Base.xcconfig:
1556
1557 2020-03-10  Devin Rousso  <drousso@apple.com>
1558
1559         REGRESSION(r253759): Web Inspector: Audits: results folder doesn't get selected by pressing Arrow Down key
1560         https://bugs.webkit.org/show_bug.cgi?id=208679
1561         <rdar://problem/60108942>
1562
1563         Reviewed by Timothy Hatcher.
1564
1565         * UserInterface/Views/AuditNavigationSidebarPanel.js:
1566         (WI.AuditNavigationSidebarPanel.prototype.initialLayout):
1567         (WI.AuditNavigationSidebarPanel.prototype._handleAuditManagerEditingChanged):
1568         We do actually want to prevent repeat selection, as we may end up attempting to select the
1569         same `WI.TreeElement` twice due to the nature of `WI.SelectionController`, which would call
1570         through to `WI.NavigationSidebarPanel.prototype.showDefaultContentView()` which deselects
1571         any selected `WI.TreeElement`. Reselecting the previously selected `WI.TreeElement` when
1572         exiting edit mode is much more of a special case than any of the ways for moving selection
1573         to a `WI.FolderTreeElement`, so add logic just for that case instead of affecting the entire
1574         `WI.TreeOutline`. When restoring the selection after leaving edit mode, if the currently
1575         selected `WI.TreeElement` was also the previously selected `WI.TreeElement`, deselect and
1576         reselect it so we're "reset" back to a fresh state.
1577
1578 2020-03-06  Nikita Vasilyev  <nvasilyev@apple.com>
1579
1580         Web Inspector: AXI: no way to expand/collapse sidebar sections with Tab navigation
1581         https://bugs.webkit.org/show_bug.cgi?id=208562
1582         <rdar://problem/60028941>
1583
1584         Reviewed by Devin Rousso.
1585
1586         * UserInterface/Views/DetailsSection.css:
1587         (.details-section > .header):
1588         (.details-section > .header::before):
1589         Increase the height of the clickble area so it matches the height
1590         of the header section.
1591
1592         (.details-section .header:focus):
1593         (.details-section .header:focus::before):
1594         Adjust the focus ring around the expand/collapse triangle so it has rounded corners.
1595
1596         * UserInterface/Views/DetailsSection.js:
1597         (WI.DetailsSection):
1598         (WI.DetailsSection.prototype._headerElementClicked):
1599         (WI.DetailsSection.prototype._headerElementMouseDown):
1600         (WI.DetailsSection.prototype._headerElementKeyPress):
1601
1602 2020-03-06  Nikita Vasilyev  <nvasilyev@apple.com>
1603
1604         Web Inspector: AXI: scope bars should be focusable when navigating by pressing Tab
1605         https://bugs.webkit.org/show_bug.cgi?id=208277
1606         <rdar://problem/59828111>
1607
1608         Reviewed by Devin Rousso.
1609
1610         Make resource type filter in the Network tab and message type filter in the Console tab focusable.
1611
1612         * UserInterface/Views/AuditTestGroupContentView.css:
1613         (.content-view.audit-test-group > header > nav):
1614         (.content-view.audit-test-group > header > nav > .scope-bar):
1615         Prevent outline of the focused scope bar item from clipping.
1616
1617         * UserInterface/Views/ScopeBar.css:
1618         (.scope-bar > li:focus):
1619         (.scope-bar > li:focus::after,):
1620         * UserInterface/Views/ScopeBar.js:
1621         (WI.ScopeBar):
1622         (WI.ScopeBar.prototype._handleKeyDown):
1623         Make Arrow Left an Arrow Right keys move focus within the scope bar.
1624         This matches the behavior of macOS radio buttons.
1625
1626         * UserInterface/Views/ScopeBarItem.js:
1627         (WI.ScopeBarItem.prototype.get scopeBar):
1628         (WI.ScopeBarItem.prototype.set scopeBar):
1629         (WI.ScopeBarItem.prototype.toggle):
1630         (WI.ScopeBarItem.prototype._updateSelected):
1631         (WI.ScopeBarItem.prototype._handleMouseDown):
1632
1633         (WI.ScopeBarItem.prototype._handleKeyDown):
1634         Allow to toggle focused scope bar item by pressing Space or Enter.
1635
1636 2020-03-06  Jon Davis  <jond@apple.com>
1637
1638         Fixed missing icons for WI.ThreadTreeElement and selected Heap Snapshots
1639         https://bugs.webkit.org/show_bug.cgi?id=208719
1640
1641         Reviewed by Devin Rousso.
1642
1643         * UserInterface/Images/InstrumentIcons.svg: Removed.
1644         * UserInterface/Images/TypeIcons.svg:
1645         * UserInterface/Views/HeapAllocationsTimelineOverviewGraph.css:
1646         (.timeline-overview-graph.heap-allocations > img.snapshot.selected):
1647         * UserInterface/Views/NetworkTableContentView.css:
1648         (.network-table > .table .cell.dom-node.name .icon):
1649         * UserInterface/Views/SourcesNavigationSidebarPanel.css:
1650         (.sidebar > .panel.navigation.sources > .content > .breakpoints-container .tree-outline .item.event-target-window .icon):
1651         (@media (prefers-color-scheme: dark) .sidebar > .panel.navigation.sources > .content > .breakpoints-container .tree-outline .item.event-target-window .icon):
1652         * UserInterface/Views/ThreadTreeElement.css:
1653         (.tree-outline > .item.thread .icon):
1654         (.tree-outline > .item.thread + ol > .item.truncated-call-frames .icon):
1655         (@media (prefers-color-scheme: dark) .tree-outline > .item.thread .icon):
1656         (@media (prefers-color-scheme: dark) .tree-outline > .item.thread + ol > .item.truncated-call-frames .icon):
1657         * UserInterface/Views/TimelineIcons.css:
1658         (.network-icon .icon):
1659         (.script-icon .icon):
1660         (.cpu-icon .icon):
1661         (.memory-icon .icon):
1662         (.heap-allocations-icon .icon):
1663         (.layout-icon .icon):
1664         (.rendering-frame-icon .icon):
1665         (.media-icon .icon):
1666         (@media (prefers-color-scheme: dark) .network-icon .icon):
1667         (@media (prefers-color-scheme: dark) .script-icon .icon):
1668         (@media (prefers-color-scheme: dark) .cpu-icon .icon):
1669         (@media (prefers-color-scheme: dark) .memory-icon .icon):
1670         (@media (prefers-color-scheme: dark) .heap-allocations-icon .icon):
1671         (@media (prefers-color-scheme: dark) .layout-icon .icon):
1672         (@media (prefers-color-scheme: dark) .rendering-frame-icon .icon):
1673         (@media (prefers-color-scheme: dark) .media-icon .icon):
1674
1675 2020-03-05  Nikita Vasilyev  <nvasilyev@apple.com>
1676
1677         Web Inspector: AXI: annotate tab panels
1678         https://bugs.webkit.org/show_bug.cgi?id=208542
1679
1680         Reviewed by Devin Rousso.
1681
1682         * Localizations/en.lproj/localizedStrings.js:
1683         * UserInterface/Base/Main.js:
1684         Remove `role=main` since it was providing very generic and not useful description to VoiceOver.
1685
1686 2020-03-05  Nikita Vasilyev  <nvasilyev@apple.com>
1687
1688         Web Inspector: AXI: can't leave Styles and Computed panels by pressing Tab
1689         https://bugs.webkit.org/show_bug.cgi?id=208549
1690         <rdar://problem/60020149>
1691
1692         Reviewed by Devin Rousso.
1693
1694         Remove focus cycling inside of the Styles and Computed panels.
1695
1696         * UserInterface/Views/GeneralStyleDetailsSidebarPanel.js:
1697         (WI.GeneralStyleDetailsSidebarPanel.prototype._handleForcedPseudoClassCheckboxKeydown):
1698         (WI.GeneralStyleDetailsSidebarPanel.prototype._handleFilterBarInputFieldKeyDown):
1699
1700 2020-03-04  Devin Rousso  <drousso@apple.com>
1701
1702         Web Inspector: the execution context picker is shown on pages with only one execution context if there are internal execution contexts
1703         https://bugs.webkit.org/show_bug.cgi?id=208502
1704
1705         Reviewed by Timothy Hatcher.
1706
1707         * UserInterface/Views/QuickConsole.js:
1708         (WI.QuickConsole.prototype._updateActiveExecutionContextDisplay):
1709         (WI.QuickConsole.prototype._handleEngineeringShowInternalExecutionContextsSettingChanged):
1710
1711 2020-03-04  Devin Rousso  <drousso@apple.com>
1712
1713         Web Inspector: REGRESSION(?): Elements: unable to edit a tag name more than once
1714         https://bugs.webkit.org/show_bug.cgi?id=208586
1715
1716         Reviewed by Timothy Hatcher.
1717
1718         * UserInterface/Views/DOMTreeElement.js:
1719         (WI.DOMTreeElement.prototype._insertInLastAttributePosition):
1720         When inserting a new attribute, don't wipe out the existing DOM structure, which is required
1721         in order for tag name editing to work (specifically having a `.html-tag-name` node).
1722
1723 2020-03-03  Devin Rousso  <drousso@apple.com>
1724
1725         Web Inspector: re-add `InspectorFrontendHost` support for moving the inspected window
1726         https://bugs.webkit.org/show_bug.cgi?id=208555
1727
1728         Reviewed by Timothy Hatcher.
1729
1730         Partially revert r257759, as the design changed enough such that this code is still useful.
1731
1732         * UserInterface/Base/Main.js:
1733         (WI.loaded):
1734         (WI.updateDockedState):
1735         (WI.resizeDockedFrameMouseDown): Added.
1736         (WI.moveUndockedWindowMouseDown): Added.
1737         (WI.dockedConfigurationSupportsSplitContentBrowser):
1738         (WI._windowFocused):
1739         (WI._windowBlurred):
1740         (WI._updateDockNavigationItems):
1741         (WI._handleDockedResizerMouseDown):
1742         (WI._handleUndockedTitleAreaMouseDown):
1743         (WI._updateTabBarDividers):
1744         (WI.setLayoutDirection):
1745         Don't create tab bar navigation items for the various docking configurations if the platform
1746         doesn't support that particular configuration.
1747
1748         * UserInterface/Views/TabBar.js:
1749         (WI.TabBar):
1750         (WI.TabBar.get horizontalPadding):
1751         (WI.TabBar.prototype._handleMouseDown):
1752         (WI.TabBar.prototype._handleTabContainerMouseDown): Added.
1753         (WI.TabBar.prototype._handleTabContainerClick): Added.
1754         (WI.TabBar.prototype._handleTabContainerMouseLeave): Added.
1755         (WI.TabBar.prototype._handleTabContainerContextMenu): Added.
1756         (WI.TabBar.prototype._handleClick): Deleted.
1757         (WI.TabBar.prototype._handleMouseLeave): Deleted.
1758         (WI.TabBar.prototype._handleContextMenu): Deleted.
1759         * UserInterface/Views/TabBar.css:
1760         (body.docked.bottom .tab-bar > .tabs > .flexible-space):
1761         Dragging on empty space in the tab bar should adjust Web Inspector's bottom docked height.
1762
1763         * UserInterface/Views/TabBarItem.js:
1764         (WI.TabBarItem.get horizontalMargin):
1765
1766 2020-03-03  Devin Rousso  <drousso@apple.com>
1767
1768         Web Inspector: the background of the navigation items in the tab bar doesn't match when unfocusing the window
1769         https://bugs.webkit.org/show_bug.cgi?id=208538
1770
1771         Reviewed by Timothy Hatcher.
1772
1773         * UserInterface/Views/TabBar.css:
1774         (body[dir=ltr]:not(.docked) .tab-bar > .tabs > .item:nth-child(n + 3 of :not(.hidden)), body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.hide-border-start) > .item:nth-child(2 of :not(.hidden)), body[dir=ltr]:not(.docked) .tab-bar > .tabs.dragging-tab > .item.selected, body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.hide-border-end) > .item:nth-last-child(1 of :not(.hidden))): Added.
1775         (body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.hide-border-end) > .item:nth-last-child(1 of :not(.hidden)), body[dir=rtl]:not(.docked) .tab-bar > .tabs > .item:nth-child(n + 3 of :not(.hidden)), body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.hide-border-start) > .item:nth-child(2 of :not(.hidden)), body[dir=rtl]:not(.docked) .tab-bar > .tabs.dragging-tab > .item.selected): Added.
1776         (body[dir=ltr]:not(.docked) .tab-bar > .tabs > .item:not(:first-child), body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.hide-border-start) > .item:first-child, body[dir=ltr]:not(.docked) .tab-bar > .tabs.dragging-tab > .item.selected, body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.hide-border-end) > .item:last-child): Deleted.
1777         (body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.hide-border-end) > .item:last-child, body[dir=rtl]:not(.docked) .tab-bar > .tabs > .item:not(:first-child), body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.hide-border-start) > .item:first-child, body[dir=rtl]:not(.docked) .tab-bar > .tabs.dragging-tab > .item.selected): Deleted.
1778         Use `nth-child` and `nth-last-child` instead of `:first-child` and `:last-child` now that
1779         there are `.flexible-space` elements alongside tab bar items.
1780
1781         (@media (prefers-color-scheme: dark) .tab-bar):
1782         (@media (prefers-color-scheme: dark) body:not(.docked) .tab-bar): Added.
1783         (@media (prefers-color-scheme: dark) body.docked .tab-bar): Added.
1784         (@media (prefers-color-scheme: dark) body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar): Added.
1785         (@media (prefers-color-scheme: dark) body:matches(.window-inactive, .window-docked-inactive) .tab-bar): Deleted.
1786         Ensure completely separate styles for `background-color` and `background-image` when `.docked`
1787         vs when `:not(.docked)` so that they don't "bleed" into eachother.
1788
1789         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar):
1790         (body.docked:matches(.window-inactive, .window-docked-inactive) .tab-bar):
1791         (.tab-bar > .navigation-bar > .item.group > .item):
1792         (.tab-bar > .navigation-bar > .item.group > .item:nth-child(1 of :not(.hidden))):
1793         (.tab-bar > .navigation-bar > .item.group > .item:nth-last-child(1 of :not(.hidden))):
1794         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item):
1795         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected):
1796         (.tab-bar > .tabs.static-layout > :matches(.flexible-space, .item)):
1797         (.tab-bar > .tabs.animating.inserting-tab > .item.being-inserted):
1798         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected, body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.static-layout:not(.animating.inserting-tab):not(.dragging-tab) > .item:nth-last-child(1 of :not(.pinned)), body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.animating.closing-tab > .item:not(.disabled).selected):
1799         (@media (prefers-color-scheme: dark) body:not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected):
1800         (@media (prefers-color-scheme: dark) body:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover):
1801         (@media (prefers-color-scheme: dark) body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item):
1802         (@media (prefers-color-scheme: dark) body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected):
1803         Drive-by: remove as many `!important` as possible to make future modification simpler.
1804
1805 2020-03-03  Jon Davis  <jond@apple.com>
1806
1807         Removed old raster icons for object types and resources
1808         https://bugs.webkit.org/show_bug.cgi?id=208458
1809
1810         Reviewed by Devin Rousso.
1811
1812         * UserInterface/Images/ApplicationCache.png: Removed.
1813         * UserInterface/Images/ApplicationCache@2x.png: Removed.
1814         * UserInterface/Images/ApplicationCacheManifest.png: Removed.
1815         * UserInterface/Images/ApplicationCacheManifest@2x.png: Removed.
1816         * UserInterface/Images/Assertion.svg: Removed.
1817         * UserInterface/Images/AuditTestCase.svg: Removed.
1818         * UserInterface/Images/AuditTestCaseResult.svg: Removed.
1819         * UserInterface/Images/AuditTestGroup.svg: Removed.
1820         * UserInterface/Images/AuditTestGroupResult.svg: Removed.
1821         * UserInterface/Images/CPUInstrument.svg: Removed.
1822         * UserInterface/Images/CallTrees.svg: Removed.
1823         * UserInterface/Images/ClippingCSS.png: Removed.
1824         * UserInterface/Images/ClippingCSS@2x.png: Removed.
1825         * UserInterface/Images/ClippingCSSLarge.png: Removed.
1826         * UserInterface/Images/ClippingCSSLarge@2x.png: Removed.
1827         * UserInterface/Images/ClippingGeneric.png: Removed.
1828         * UserInterface/Images/ClippingGeneric@2x.png: Removed.
1829         * UserInterface/Images/ClippingGenericLarge.png: Removed.
1830         * UserInterface/Images/ClippingGenericLarge@2x.png: Removed.
1831         * UserInterface/Images/ClippingJS.png: Removed.
1832         * UserInterface/Images/ClippingJS@2x.png: Removed.
1833         * UserInterface/Images/ClippingJSLarge.png: Removed.
1834         * UserInterface/Images/ClippingJSLarge@2x.png: Removed.
1835         * UserInterface/Images/Cookie.png: Removed.
1836         * UserInterface/Images/Cookie@2x.png: Removed.
1837         * UserInterface/Images/DOMBreakpointAttributeModified.svg: Removed.
1838         * UserInterface/Images/DOMBreakpointNodeRemoved.svg: Removed.
1839         * UserInterface/Images/DOMBreakpointSubtreeModified.svg: Removed.
1840         * UserInterface/Images/DOMCharacterData.svg: Removed.
1841         * UserInterface/Images/DOMComment.svg: Removed.
1842         * UserInterface/Images/DOMDocument.svg: Removed.
1843         * UserInterface/Images/DOMDocumentType.svg: Removed.
1844         * UserInterface/Images/DOMElement.svg: Removed.
1845         * UserInterface/Images/DOMNode.svg: Removed.
1846         * UserInterface/Images/DOMTextNode.svg: Removed.
1847         * UserInterface/Images/Database.png: Removed.
1848         * UserInterface/Images/Database@2x.png: Removed.
1849         * UserInterface/Images/DatabaseTable.png: Removed.
1850         * UserInterface/Images/DatabaseTable@2x.png: Removed.
1851         * UserInterface/Images/DebuggerStatement.svg: Removed.
1852         * UserInterface/Images/DocumentCSS.png: Removed.
1853         * UserInterface/Images/DocumentCSS@2x.png: Removed.
1854         * UserInterface/Images/DocumentCSSLarge.png: Removed.
1855         * UserInterface/Images/DocumentCSSLarge@2x.png: Removed.
1856         * UserInterface/Images/DocumentFont.png: Removed.
1857         * UserInterface/Images/DocumentFont@2x.png: Removed.
1858         * UserInterface/Images/DocumentFontLarge.png: Removed.
1859         * UserInterface/Images/DocumentFontLarge@2x.png: Removed.
1860         * UserInterface/Images/DocumentGL.png: Removed.
1861         * UserInterface/Images/DocumentGL@2x.png: Removed.
1862         * UserInterface/Images/DocumentGeneric.png: Removed.
1863         * UserInterface/Images/DocumentGeneric@2x.png: Removed.
1864         * UserInterface/Images/DocumentGenericLarge.png: Removed.
1865         * UserInterface/Images/DocumentGenericLarge@2x.png: Removed.
1866         * UserInterface/Images/DocumentImage.png: Removed.
1867         * UserInterface/Images/DocumentImage@2x.png: Removed.
1868         * UserInterface/Images/DocumentImageLarge.png: Removed.
1869         * UserInterface/Images/DocumentImageLarge@2x.png: Removed.
1870         * UserInterface/Images/DocumentJS.png: Removed.
1871         * UserInterface/Images/DocumentJS@2x.png: Removed.
1872         * UserInterface/Images/DocumentJSLarge.png: Removed.
1873         * UserInterface/Images/DocumentJSLarge@2x.png: Removed.
1874         * UserInterface/Images/DocumentMarkup.png: Removed.
1875         * UserInterface/Images/DocumentMarkup@2x.png: Removed.
1876         * UserInterface/Images/DocumentMarkupLarge.png: Removed.
1877         * UserInterface/Images/DocumentMarkupLarge@2x.png: Removed.
1878         * UserInterface/Images/EventBreakpointAnimationFrame.svg: Removed.
1879         * UserInterface/Images/EventBreakpointInterval.svg: Removed.
1880         * UserInterface/Images/EventBreakpointListener.svg: Removed.
1881         * UserInterface/Images/EventBreakpointTimeout.svg: Removed.
1882         * UserInterface/Images/EventListener.svg: Removed.
1883         * UserInterface/Images/Events.svg: Removed.
1884         * UserInterface/Images/Exception.svg: Removed.
1885         * UserInterface/Images/FolderGeneric.png: Removed.
1886         * UserInterface/Images/FolderGeneric@2x.png: Removed.
1887         * UserInterface/Images/Function.svg: Removed.
1888         * UserInterface/Images/HeapAllocationsInstrument.svg: Removed.
1889         * UserInterface/Images/HeapSnapshot.svg: Removed.
1890         * UserInterface/Images/HeapSnapshotDiff.svg: Removed.
1891         * UserInterface/Images/HeapSnapshotInstances.svg: Removed.
1892         * UserInterface/Images/HeapSnapshotObjectGraph.svg: Removed.
1893         * UserInterface/Images/HeapSnapshotSelected.svg: Removed.
1894         * UserInterface/Images/HeapSnapshotSummary.svg: Removed.
1895         * UserInterface/Images/LayoutInstrument.svg: Removed.
1896         * UserInterface/Images/LocalStorage.png: Removed.
1897         * UserInterface/Images/LocalStorage@2x.png: Removed.
1898         * UserInterface/Images/MediaInstrument.svg: Removed.
1899         * UserInterface/Images/MemoryInstrument.svg: Removed.
1900         * UserInterface/Images/Microtask.svg: Removed.
1901         * UserInterface/Images/Native.svg: Removed.
1902         * UserInterface/Images/NetworkInstrument.svg: Removed.
1903         * UserInterface/Images/Object.svg: Removed.
1904         * UserInterface/Images/PausedBreakpoint.svg: Removed.
1905         * UserInterface/Images/Program.svg: Removed.
1906         * UserInterface/Images/PseudoElement.svg: Removed.
1907         * UserInterface/Images/Range.svg: Removed.
1908         * UserInterface/Images/RangeLarge.svg: Removed.
1909         * UserInterface/Images/Reflection.svg: Removed.
1910         * UserInterface/Images/RenderingFrame.svg: Removed.
1911         * UserInterface/Images/RenderingFramesInstrument.svg: Removed.
1912         * UserInterface/Images/Request.svg: Removed.
1913         * UserInterface/Images/Response.svg: Removed.
1914         * UserInterface/Images/ScriptsInstrument.svg: Removed.
1915         * UserInterface/Images/SessionStorage.png: Removed.
1916         * UserInterface/Images/SessionStorage@2x.png: Removed.
1917         * UserInterface/Images/Source.svg: Removed.
1918         * UserInterface/Images/StyleRuleInheritedElement.svg: Removed.
1919         * UserInterface/Images/TailDeletedFunction.svg: Removed.
1920         * UserInterface/Images/Thread.svg: Removed.
1921         * UserInterface/Images/TimelineRecordAPI.svg: Removed.
1922         * UserInterface/Images/TimelineRecordAnimationFrame.svg: Removed.
1923         * UserInterface/Images/TimelineRecordCSSAnimation.svg: Removed.
1924         * UserInterface/Images/TimelineRecordCSSTransition.svg: Removed.
1925         * UserInterface/Images/TimelineRecordComposite.svg: Removed.
1926         * UserInterface/Images/TimelineRecordConsoleProfile.svg: Removed.
1927         * UserInterface/Images/TimelineRecordEvent.svg: Removed.
1928         * UserInterface/Images/TimelineRecordGarbageCollection.svg: Removed.
1929         * UserInterface/Images/TimelineRecordLayout.svg: Removed.
1930         * UserInterface/Images/TimelineRecordMediaElement.svg: Removed.
1931         * UserInterface/Images/TimelineRecordPaint.svg: Removed.
1932         * UserInterface/Images/TimelineRecordProbeSampled.svg: Removed.
1933         * UserInterface/Images/TimelineRecordScriptEvaluated.svg: Removed.
1934         * UserInterface/Images/TimelineRecordStyle.svg: Removed.
1935         * UserInterface/Images/TimelineRecordTimer.svg: Removed.
1936         * UserInterface/Images/TypeBigInt.svg: Removed.
1937         * UserInterface/Images/TypeBoolean.svg: Removed.
1938         * UserInterface/Images/TypeNull.svg: Removed.
1939         * UserInterface/Images/TypeNumber.svg: Removed.
1940         * UserInterface/Images/TypeObject.svg: Removed.
1941         * UserInterface/Images/TypeRegex.svg: Removed.
1942         * UserInterface/Images/TypeString.svg: Removed.
1943         * UserInterface/Images/TypeSymbol.svg: Removed.
1944         * UserInterface/Images/TypeUndefined.svg: Removed.
1945         * UserInterface/Images/URLBreakpoint.svg: Removed.
1946         * UserInterface/Images/WebSocket.png: Removed.
1947         * UserInterface/Images/WebSocket@2x.png: Removed.
1948         * UserInterface/Images/WebSocketLarge.png: Removed.
1949         * UserInterface/Images/WebSocketLarge@2x.png: Removed.
1950         * UserInterface/Images/WorkerScript.png: Removed.
1951         * UserInterface/Images/WorkerScript@2x.png: Removed.
1952         * UserInterface/Images/WorkerScriptLarge.png: Removed.
1953         * UserInterface/Images/WorkerScriptLarge@2x.png: Removed.
1954
1955 2020-03-02  Devin Rousso  <drousso@apple.com>
1956
1957         Web Inspector: visual artifacts in the corner of selected tabs when docked in dark mode
1958         https://bugs.webkit.org/show_bug.cgi?id=208498
1959
1960         Reviewed by Timothy Hatcher.
1961
1962         * UserInterface/Views/TabBar.css:
1963         (@media (prefers-color-scheme: dark) body:not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
1964         (@media (prefers-color-scheme: dark) body.docked .tab-bar > .tabs > .item:not(.disabled).selected): Added.
1965         (@media (prefers-color-scheme: dark) body.docked:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
1966         (@media (prefers-color-scheme: dark) .tab-bar > .tabs > .item:not(.disabled).selected): Deleted.
1967         The `background-color` set by `body.docked .tab-bar > .tabs > .item:not(.disabled).selected`
1968         in light mode was also being applied in dark mode. When docked, don't use `background-image`
1969         and instead exclusively use `background-color` so nothing is still applied.
1970
1971 2020-03-02  Devin Rousso  <drousso@apple.com>
1972
1973         Web Inspector: Items in the toolbar take up to much vertical space
1974         https://bugs.webkit.org/show_bug.cgi?id=204627
1975         <rdar://problem/59091905>
1976
1977         Reviewed by Timothy Hatcher.
1978
1979         Merge the toolbar are and tab bar to waste less vertical space.
1980
1981         Existing toolbar buttons have been moved to a space before the tab bar, and are only shown
1982         when needed (e.g. only show the reload button when remotely inspecting).
1983
1984         If there are any console warnings/errors, an icon for each type of message is shown between
1985         the left buttons and the tabs, and each button's opacity is animated whenever a new message
1986         is added.
1987
1988         Whenever the debugger pauses, change the tab bar icon of the Sources Tab to an image that
1989         includes paused iconography to help convey the debugger's state no matter which tab is
1990         currently selected, just like the debugger dashboard.
1991
1992         The dashboard network information has been moved to the Network Tab (described below).
1993
1994         When undocked, the tab bar and all the content below it are pushed down by 22px to make room
1995         for the system close/minimize/maximize buttons and the window title.
1996
1997         * UserInterface/Base/Main.js:
1998         (WI.loaded):
1999         (WI._handleSettingsKeyboardShortcut):
2000         (WI._tryToRestorePendingTabs):
2001         (WI.isNewTabWithTypeAllowed):
2002         (WI._openDefaultTab): Deleted.
2003         (WI.showNewTabTab): Deleted.
2004         * UserInterface/Views/Main.css:
2005         (#undocked-title-area): Added.
2006         (body.docked #undocked-title-area): Added.
2007         (body.window-inactive #undocked-title-area): Added.
2008         (#main):
2009         (@keyframes tab-bar-console-item-pulse): Added.
2010         (.tab-bar > .navigation-bar :matches(.console-warnings, .console-errors):not(.disabled).pulsing): Added.
2011         (@media (prefers-color-scheme: dark) #undocked-title-area): Added.
2012         (@media (prefers-color-scheme: dark) body.window-inactive #undocked-title-area): Added.
2013         (body.docked.bottom): Deleted.
2014         (body.docked.bottom #toolbar): Deleted.
2015         (body.docked.bottom #toolbar .item:not(.flexible-space)): Deleted.
2016
2017         * UserInterface/Views/TabBar.js:
2018         (WI.TabBar):
2019         (WI.TabBar.get horizontalPadding): Added.
2020         (WI.TabBar.prototype.addNavigationItemBefore): Added.
2021         (WI.TabBar.prototype.addNavigationItemAfter): Added.
2022         (WI.TabBar.prototype.insertTabBarItem):
2023         (WI.TabBar.prototype.insertTabBarItem.animateTabs):
2024         (WI.TabBar.prototype.insertTabBarItem.removeStyles):
2025         (WI.TabBar.prototype.removeTabBarItem):
2026         (WI.TabBar.prototype.removeTabBarItem.animateTabs):
2027         (WI.TabBar.prototype.removeTabBarItem.removeStyles):
2028         (WI.TabBar.prototype.set selectedTabBarItem):
2029         (WI.TabBar.prototype.get tabCount): Added.
2030         (WI.TabBar.prototype.layout):
2031         (WI.TabBar.prototype.layout.measureItemWidth):
2032         (WI.TabBar.prototype.layout.recalculateItemWidths):
2033         (WI.TabBar.prototype.didLayoutSubtree): Added.
2034         (WI.TabBar.prototype._recordTabBarItemSizesAndPositions):
2035         (WI.TabBar.prototype._recordTabBarItemSizesAndPositions.add): Added.
2036         (WI.TabBar.prototype._applyTabBarItemSizesAndPositions):
2037         (WI.TabBar.prototype._finishExpandingTabsAfterClose):
2038         (WI.TabBar.prototype._finishExpandingTabsAfterClose.animateTabs):
2039         (WI.TabBar.prototype._finishExpandingTabsAfterClose.removeStyles):
2040         (WI.TabBar.prototype._handleClick):
2041         (WI.TabBar.prototype._handleMouseMoved):
2042         (WI.TabBar.prototype._handleMouseMoved.inlineStyleValue): Added.
2043         (WI.TabBar.prototype._handleMouseUp):
2044         (WI.TabBar.prototype._handleMouseLeave):
2045         (WI.TabBar.prototype._handleContextMenu):
2046         (WI.TabBar.prototype.get saveableTabCount): Deleted.
2047         (WI.TabBar.layout.forceItemHidden): Deleted.
2048         * UserInterface/Views/TabBar.css:
2049         (.tab-bar):
2050         (body:not(.docked) .tab-bar): Added.
2051         (body.docked .tab-bar): Added.
2052         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar): Added.
2053         (.tab-bar > .border): Added.
2054         (.tab-bar > .border.top): Added.
2055         (.tab-bar > .border.bottom): Added.
2056         (body.docked.bottom .tab-bar > .border.top): Added.
2057         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .border): Added.
2058         (.tab-bar > .navigation-bar): Added.
2059         (.tab-bar > .navigation-bar > .item.group > .item): Added.
2060         (.tab-bar > .navigation-bar > .item.group > .item:nth-child(1 of :not(.hidden))): Added.
2061         (.tab-bar > .navigation-bar > .item.group > .item:nth-last-child(1 of :not(.hidden))): Added.
2062         (.tab-bar > .navigation-bar .item.divider): Added.
2063         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .navigation-bar > .item.divider): Added.
2064         (.tab-bar > .tabs): Added.
2065         (body.docked .tab-bar .tabs): Added.
2066         (.tab-bar > .tabs > .item): Added.
2067         (body:not(.docked) .tab-bar > .tabs > .item): Added.
2068         (body:not(.docked) .tab-bar > .tabs > .item:not(.pinned)): Added.
2069         (body.docked .tab-bar > .tabs > .item): Added.
2070         (.tab-bar > .tabs.calculate-width > .item): Added.
2071         (body[dir=ltr]:not(.docked) .tab-bar > .tabs > .item:not(:first-child), body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.hide-border-start) > .item:first-child, body[dir=ltr]:not(.docked) .tab-bar > .tabs.dragging-tab > .item.selected, body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.hide-border-end) > .item:last-child): Added.
2072         (body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.hide-border-end) > .item:last-child, body[dir=rtl]:not(.docked) .tab-bar > .tabs > .item:not(:first-child), body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.hide-border-start) > .item:first-child, body[dir=rtl]:not(.docked) .tab-bar > .tabs.dragging-tab > .item.selected): Added.
2073         (.tab-bar > .tabs > .item.pinned): Added.
2074         (body.docked .tab-bar > .tabs > .item.pinned): Added.
2075         (body:not(.docked) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
2076         (body.docked .tab-bar > .tabs > .item:not(.disabled).selected): Added.
2077         (body:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Added.
2078         (body.docked .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Added.
2079         (body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover, body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover + .item, body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.animating) > .item:last-child:not(.selected, .disabled):hover): Added.
2080         (body[dir=ltr]:not(.docked) .tab-bar > .tabs:not(.animating) > .item:last-child:not(.selected, .disabled):hover, body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover, body[dir=rtl]:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover + .item): Added.
2081         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item): Added.
2082         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
2083         (body.docked:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
2084         (.tab-bar > .tabs > .item > .flex-space): Added.
2085         (.tab-bar > .tabs > .item > .icon): Added.
2086         (.tab-bar > .tabs > .item.pinned > .icon): Added.
2087         (.tab-bar > .tabs > .item:not(.selected):hover > .icon): Added.
2088         (.tab-bar > .tabs > .item:not(.disabled).selected > .icon): Added.
2089         (.tab-bar > .tabs > .item.disabled > .icon): Added.
2090         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item > .icon): Added.
2091         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected > .icon): Added.
2092         (.tab-bar > .tabs > .item > .title): Added.
2093         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item > .title): Added.
2094         (.tab-bar > .tabs > .item > .title > .content): Added.
2095         (.tab-bar > .tabs:not(.animating) > .item:not(.selected):hover > .title): Added.
2096         (.tab-bar > .tabs > .item:not(.disabled).selected > .title): Added.
2097         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected > .title): Added.
2098         (.tab-bar > .tabs.static-layout): Added.
2099         (.tab-bar > .tabs.static-layout > :matches(.flexible-space, .item)): Added.
2100         (.tab-bar > .tabs.animating.closing-tab > .item): Added.
2101         (.tab-bar > .tabs.animating:matches(.expanding-tabs, .inserting-tab) > .item): Added.
2102         (.tab-bar > .tabs.animating.inserting-tab > .item.being-inserted): Added.
2103         (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): Added.
2104         (body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected, body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.static-layout:not(.animating.inserting-tab):not(.dragging-tab) > .item:nth-last-child(1 of :not(.pinned)), body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.animating.closing-tab > .item:not(.disabled).selected): Added.
2105         (.tab-bar > .tabs.dragging-tab > .item:not(.disabled).selected): Added.
2106         (@media (prefers-color-scheme: dark) .tab-bar): Added.
2107         (@media (prefers-color-scheme: dark) body.docked.bottom .tab-bar > .border.top): Added.
2108         (@media (prefers-color-scheme: dark) body:not(.docked) .tab-bar > .tabs > .item): Added.
2109         (@media (prefers-color-scheme: dark) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
2110         (@media (prefers-color-scheme: dark) body:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Added.
2111         (@media (prefers-color-scheme: dark) body.docked .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover): Added.
2112         (@media (prefers-color-scheme: dark) .tab-bar > .tabs > .item > .icon): Added.
2113         (@media (prefers-color-scheme: dark) body:not(.docked) .tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover > .icon): Added.
2114         (@media (prefers-color-scheme: dark) body:matches(.window-inactive, .window-docked-inactive) .tab-bar): Added.
2115         (@media (prefers-color-scheme: dark) body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item): Added.
2116         (@media (prefers-color-scheme: dark) body:not(.docked):matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item:not(.disabled).selected): Added.
2117         (body.window-inactive .tab-bar): Deleted.
2118         (.tab-bar > .top-border): Deleted.
2119         (body.window-inactive .tab-bar > .top-border): Deleted.
2120         (.tab-bar > .item): Deleted.
2121         (.tab-bar.calculate-width > .item): Deleted.
2122         (body[dir=ltr] .tab-bar > :nth-child(n + 2 of .item),): Deleted.
2123         (body[dir=rtl] .tab-bar > :nth-child(n + 2 of .item),): Deleted.
2124         (.tab-bar > .item.pinned): Deleted.
2125         (.tab-bar > .item.pinned.tab-picker): Deleted.
2126         (.tab-bar > .item:not(.disabled).selected): Deleted.
2127         (.tab-bar:not(.animating) > .item:not(.selected, .disabled):hover): Deleted.
2128         (body[dir=ltr] .tab-bar:not(.animating) > .item:not(.selected, .disabled):hover,): Deleted.
2129         (body[dir=rtl] .tab-bar:not(.animating) > .item:not(.selected, .disabled):hover,): Deleted.
2130         (body.window-inactive .tab-bar > .item): Deleted.
2131         (body[dir=ltr].window-inactive .tab-bar > .item): Deleted.
2132         (body[dir=rtl].window-inactive .tab-bar > .item): Deleted.
2133         (body.window-inactive .tab-bar > .item.selected): Deleted.
2134         (.tab-bar > .item > .close): Deleted.
2135         (body:not(.window-inactive) .tab-bar > .item:hover > .close): Deleted.
2136         (body:not(.window-inactive) .tab-bar.single-tab > .item.default-tab:hover > .close): Deleted.
2137         (.tab-bar.single-tab > .item.default-tab > .close): Deleted.
2138         (.tab-bar > .item > .close:hover): Deleted.
2139         (.tab-bar > .item > .close:active): Deleted.
2140         (.tab-bar > .item > .flex-space): Deleted.
2141         (.tab-bar > .item.ephemeral > .flex-space:last-child): Deleted.
2142         (.tab-bar > .item > .icon): Deleted.
2143         (.tab-bar > .item.pinned > .icon): Deleted.
2144         (.tab-bar > .item.selected > .icon): Deleted.
2145         (.tab-bar > .item.disabled > .icon): Deleted.
2146         (@media not (prefers-color-scheme: dark) .tab-bar:not(.animating) > .item:not(.selected, .disabled):hover > .icon): Deleted.
2147         (.tab-bar > .item > .title): Deleted.
2148         (.tab-bar:not(.collapsed) > .item > .title): Deleted.
2149         (.tab-bar > .item > .title > .content): Deleted.
2150         (.tab-bar:not(.animating) > .item:not(.selected):hover > .title): Deleted.
2151         (.tab-bar > .item.selected > .title): Deleted.
2152         (.tab-bar.collapsed > .item): Deleted.
2153         (.tab-bar.collapsed > .item:not(.pinned) > .icon): Deleted.
2154         (.tab-bar.collapsed > .item > .flex-space): Deleted.
2155         (.tab-bar.collapsed > .item > .close): Deleted.
2156         (.tab-bar.collapsed > .item:hover > .close): Deleted.
2157         (.tab-bar.collapsed > .item.ephemeral:hover > .icon): Deleted.
2158         (.tab-bar.collapsed > .item.ephemeral:hover > .title): Deleted.
2159         (.tab-bar.static-layout): Deleted.
2160         (.tab-bar.static-layout > .item): Deleted.
2161         (.tab-bar.animating.closing-tab > .item): Deleted.
2162         (.tab-bar.animating:matches(.expanding-tabs, .inserting-tab) > .item): Deleted.
2163         (.tab-bar.animating.inserting-tab > .item.being-inserted): Deleted.
2164         (.tab-bar.dragging-tab > .item.selected,): Deleted.
2165         (body.window-inactive .tab-bar.dragging-tab > .item.selected,): Deleted.
2166         (.tab-bar.dragging-tab > .item.selected): Deleted.
2167         (@media (prefers-color-scheme: dark) .tab-bar > .item): Deleted.
2168         (@media (prefers-color-scheme: dark) .tab-bar > .item > .title): Deleted.
2169         (@media (prefers-color-scheme: dark) .tab-bar > .item:not(.disabled).selected): Deleted.
2170         (@media (prefers-color-scheme: dark) .tab-bar:not(.animating) > .item:not(.selected):hover): Deleted.
2171         (@media (prefers-color-scheme: dark) .tab-bar > .item > .close,): Deleted.
2172         (@media (prefers-color-scheme: dark) body.window-inactive .tab-bar): Deleted.
2173         (@media (prefers-color-scheme: dark) body.window-inactive .tab-bar > .item): Deleted.
2174         (@media (prefers-color-scheme: dark) body.window-inactive .tab-bar > .item.selected): Deleted.
2175         (@media (prefers-color-scheme: dark) body.window-inactive .tab-bar > .item > .title): Deleted.
2176
2177         * UserInterface/Views/NetworkTableContentView.js:
2178         (WI.NetworkTableContentView):
2179         (WI.NetworkTableContentView.prototype.reset):
2180         (WI.NetworkTableContentView.prototype.tablePopulateCell):
2181         (WI.NetworkTableContentView.prototype._changeCollection):
2182         (WI.NetworkTableContentView.prototype.initialLayout):
2183         (WI.NetworkTableContentView.prototype.processHAR):
2184         (WI.NetworkTableContentView.prototype._processPendingEntries):
2185         (WI.NetworkTableContentView.prototype._updateEntryForResource):
2186         (WI.NetworkTableContentView.prototype._mainResourceDidChange):
2187         (WI.NetworkTableContentView.prototype._handleResourceSizeDidChange): Added.
2188         (WI.NetworkTableContentView.prototype._resourceTransferSizeDidChange):
2189         (WI.NetworkTableContentView.prototype._handleResourceAdded):
2190         (WI.NetworkTableContentView.prototype._handleFrameWasAdded):
2191         (WI.NetworkTableContentView.prototype._entryForResource):
2192         (WI.NetworkTableContentView.prototype._updateStatistics): Added.
2193         (WI.NetworkTableContentView.prototype._updateStatistic): Added.
2194         (WI.NetworkTableContentView.prototype._startUpdatingLoadTimeStatistic): Added.
2195         (WI.NetworkTableContentView.prototype._stopUpdatingLoadTimeStatistic): Added.
2196         (WI.NetworkTableContentView.prototype._updateLoadTimeStatistic): Added.
2197         * UserInterface/Views/NetworkTableContentView.css:
2198         (.content-view.network .network-table): Added.
2199         (.network-table > .statistics): Added.
2200         (.network-table > .statistics > .statistic): Added.
2201         (.network-table > .statistics > .statistic[hidden]): Added.
2202         (.network-table > .statistics > .statistic > .icon): Added.
2203         (.network-table > .statistics > .statistic > .text): Added.
2204         Add a fixed row below the network table that contains statistics information based on the
2205         current shown collection (e.g. live data vs HAR):
2206          - number of domains
2207          - number of resources
2208          - total resource size
2209          - total transfer size
2210          - number of redirects
2211          - time to load
2212         NOTE: elided renaming CSS changes.
2213
2214         * UserInterface/Views/TabBrowser.js:
2215         (WI.TabBrowser.prototype.addTabForContentView):
2216         (WI.TabBrowser.prototype.closeTabForContentView):
2217         (WI.TabBrowser.prototype._tabBarItemSelected):
2218         (WI.TabBrowser.prototype._tabBarItemRemoved):
2219
2220         * UserInterface/Views/TabContentView.js:
2221         (WI.TabContentView.shouldPinTab): Added.
2222         * UserInterface/Views/AuditTabContentView.js:
2223         (WI.AuditTabContentView):
2224         (WI.AuditTabContentView.tabInfo):
2225         * UserInterface/Views/CanvasTabContentView.js:
2226         (WI.CanvasTabContentView):
2227         (WI.CanvasTabContentView.tabInfo):
2228         * UserInterface/Views/ConsoleTabContentView.js:
2229         (WI.ConsoleTabContentView):
2230         (WI.ConsoleTabContentView.tabInfo):
2231         * UserInterface/Views/ContentBrowserTabContentView.js:
2232         (WI.ContentBrowserTabContentView):
2233         * UserInterface/Views/ElementsTabContentView.js:
2234         (WI.ElementsTabContentView):
2235         (WI.ElementsTabContentView.tabInfo):
2236         * UserInterface/Views/LayersTabContentView.js:
2237         (WI.LayersTabContentView):
2238         (WI.LayersTabContentView.tabInfo):
2239         * UserInterface/Views/NetworkTabContentView.js:
2240         (WI.NetworkTabContentView):
2241         (WI.NetworkTabContentView.tabInfo):
2242         * UserInterface/Views/SearchTabContentView.js:
2243         (WI.SearchTabContentView):
2244         (WI.SearchTabContentView.tabInfo):
2245         (WI.SearchTabContentView.shouldPinTab): Added.
2246         (WI.SearchTabContentView.shouldSaveTab): Added.
2247         * UserInterface/Views/SettingsTabContentView.js:
2248         (WI.SettingsTabContentView):
2249         (WI.SettingsTabContentView.tabInfo):
2250         (WI.SettingsTabContentView.shouldPinTab): Added.
2251         (WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
2252         * UserInterface/Views/SourcesTabContentView.js:
2253         (WI.SourcesTabContentView):
2254         (WI.SourcesTabContentView.tabInfo):
2255         (WI.SourcesTabContentView.prototype._handleDebuggerPaused): Added.
2256         (WI.SourcesTabContentView.prototype._handleDebuggerResumed): Added.
2257         * UserInterface/Views/StorageTabContentView.js:
2258         (WI.StorageTabContentView):
2259         (WI.StorageTabContentView.tabInfo):
2260         * UserInterface/Views/TimelineTabContentView.js:
2261         (WI.TimelineTabContentView):
2262         (WI.TimelineTabContentView.tabInfo):
2263         * UserInterface/Views/TabBarItem.js:
2264         (WI.TabBarItem):
2265         (WI.TabBarItem.get horizontalMargin): Added.
2266         (WI.TabBarItem.prototype.get element):
2267         (WI.TabBarItem.prototype.get representedObject):
2268         (WI.TabBarItem.prototype.set disabled):
2269         (WI.TabBarItem.prototype.get hidden): Added.
2270         (WI.TabBarItem.prototype.set hidden): Added.
2271         (WI.TabBarItem.prototype.set representedObject): Deleted.
2272         (WI.TabBarItem.prototype.get isDefaultTab): Deleted.
2273         (WI.TabBarItem.prototype.set isDefaultTab): Deleted.
2274         * UserInterface/Views/GeneralTabBarItem.js:
2275         (WI.GeneralTabBarItem.fromTabContentView): Added.
2276         (WI.GeneralTabBarItem): Deleted.
2277         (WI.GeneralTabBarItem.fromTabInfo): Deleted.
2278         (WI.GeneralTabBarItem.prototype.get isEphemeral): Deleted.
2279         (WI.GeneralTabBarItem.prototype._handleContextMenuEvent): Deleted.
2280         * UserInterface/Views/PinnedTabBarItem.js:
2281         (WI.PinnedTabBarItem):
2282         (WI.PinnedTabBarItem.fromTabContentView): Added.
2283         (WI.PinnedTabBarItem.titleDidChange):
2284         (WI.PinnedTabBarItem.fromTabInfo): Deleted.
2285         (WI.PinnedTabBarItem.prototype.titleDidChange): Deleted.
2286         (WI.PinnedTabBarItem.prototype._handleContextMenuEvent): Deleted.
2287         Simplify how tab bar items are created.
2288
2289         * UserInterface/Views/NavigationBar.js:
2290         (WI.NavigationBar.prototype.get sizesToFit):
2291         (WI.NavigationBar.prototype.addNavigationItem):
2292         (WI.NavigationBar.prototype.insertNavigationItem):
2293         * UserInterface/Views/SizesToFitNavigationBar.js: Removed.
2294         * UserInterface/Views/Sidebar.js:
2295         (WI.Sidebar):
2296         * UserInterface/Views/GraphicsOverviewContentView.js:
2297         (WI.GraphicsOverviewContentView.prototype.initialLayout):
2298         Support marking `sizesToFit` during construction, instead of having to make a subclass.
2299
2300         * UserInterface/Views/ButtonNavigationItem.js:
2301         (WI.ButtonNavigationItem):
2302         (WI.ButtonNavigationItem.prototype.get imageType): Added.
2303         (WI.ButtonNavigationItem.prototype.set imageType): Added.
2304         (WI.ButtonNavigationItem.prototype._update):
2305         * UserInterface/Views/ButtonNavigationItem.css:
2306         (.tab-bar > .navigation-bar .item.button.image-and-text > span): Added.
2307         (.navigation-bar .item.button > img): Added.
2308         (.navigation-bar .item.button.disabled > img): Added.
2309         (body:matches(.window-inactive, .window-docked-inactive) .navigation-bar .item.button > img): Added.
2310         (body:matches(.window-inactive, .window-docked-inactive) .navigation-bar .item.button.disabled > img): Added.
2311         (@media (prefers-color-scheme: dark) .navigation-bar .item.button.disabled > img): Added.
2312         Allow `WI.ButtonNavigationItem` to use an `<img>` instead of an `<svg>` for it's image. This
2313         is to work around a compositing bug <https://webkit.org/b/207022>.
2314
2315         * UserInterface/Views/GroupNavigationItem.js:
2316         (WI.GroupNavigationItem.prototype.get hidden): Added.
2317         (WI.GroupNavigationItem.prototype.set hidden): Added.
2318         (WI.GroupNavigationItem.prototype.get additionalClassNames): Added.
2319         Add a special case where this item is considered `hidden` if all sub-items are also `hidden`.
2320
2321         * UserInterface/Views/Variables.css:
2322         (:root):
2323         (body:matches(.window-inactive, .window-docked-inactive)): Added.
2324         (body:matches(.window-inactive, .window-docked-inactive) *): Added.
2325         (body:not(.docked)): Added.
2326         (@media (prefers-color-scheme: dark) :root):
2327         (@media (prefers-color-scheme: dark) body:matches(.window-inactive, .window-docked-inactive)): Added.
2328         (@media (prefers-color-scheme: dark) body:matches(.window-inactive, .window-docked-inactive) *): Added.
2329         (body.window-inactive): Deleted.
2330         (body.window-inactive *): Deleted.
2331         (@media (prefers-color-scheme: dark) body.window-inactive): Deleted.
2332         (@media (prefers-color-scheme: dark) body.window-inactive *): Deleted.
2333         Replace `--toolbar-height` with `--undocked-title-area-height`, which is set when docked.
2334         Define `--tab-bar-height` in terms of `--navigation-bar-height` so they share the same value.
2335
2336         * UserInterface/Views/DividerNavigationItem.css:
2337         (.navigation-bar .item.divider):
2338         (@media (prefers-color-scheme: dark)):
2339         Simplify the CSS in order to better support being used in the tab bar.
2340
2341         * UserInterface/Views/FlexibleSpaceNavigationItem.css:
2342         (.navigation-bar .item.flexible-space):
2343         (.navigation-bar .item.flexible-space.align-start > .item):
2344         (.navigation-bar .item.flexible-space.align-end > .item):
2345         (:matches(.navigation-bar, .toolbar) .item.flexible-space): Deleted.
2346         (:matches(.navigation-bar, .toolbar) .item.flexible-space.align-start > .item): Deleted.
2347         (:matches(.navigation-bar, .toolbar) .item.flexible-space.align-end > .item): Deleted.
2348         Remove toolbar styles.
2349
2350         * UserInterface/Controllers/ConsoleManager.js:
2351         (WI.ConsoleManager):
2352         (WI.ConsoleManager.prototype.get warningCount): Added.
2353         (WI.ConsoleManager.prototype.get errorCount): Added.
2354         (WI.ConsoleManager.prototype.messageWasAdded):
2355         (WI.ConsoleManager.prototype.messagesCleared):
2356         (WI.ConsoleManager.prototype.messageRepeatCountUpdated):
2357         (WI.ConsoleManager.prototype._incrementMessageLevelCount): Added.
2358         (WI.ConsoleManager.prototype._delayedMessagesCleared):
2359         Keep track of the count of warnings and errors so that they can be used to determine when to
2360         show Console button navigation items in the tab bar.
2361
2362         * UserInterface/Views/DOMTreeContentView.css:
2363         (body:not(.window-inactive, .window-docked-inactive) .content-view.dom-tree .tree-outline.dom:focus li:matches(.selected, .hovered) .status-image.breakpoint): Added.
2364         (body:not(.window-inactive, .window-docked-inactive) .content-view.dom-tree .tree-outline.dom:focus li:matches(.selected, .hovered) .status-image.breakpoint.subtree): Added.
2365         (body:not(.window-inactive) .content-view.dom-tree .tree-outline.dom:focus li:matches(.selected, .hovered) .status-image.breakpoint): Deleted.
2366         (body:not(.window-inactive) .content-view.dom-tree .tree-outline.dom:focus li:matches(.selected, .hovered) .status-image.breakpoint.subtree): Deleted.
2367         * UserInterface/Views/RenderingFrameTimelineOverviewGraph.css:
2368         (body:matches(.window-inactive, .window-docked-inactive) .timeline-overview-graph.rendering-frame > .frame-marker): Added.
2369         (body.window-inactive .timeline-overview-graph.rendering-frame > .frame-marker): Deleted.
2370         * UserInterface/Views/TimelineOverview.css:
2371         (.timeline-overview > .tree-outline.timelines .item.selected + .item, body:matches(.window-inactive, .window-docked-inactive) .timeline-overview > .tree-outline.timelines .item.selected + .item): Added.
2372         (@media (prefers-color-scheme: dark) .timeline-overview > .tree-outline.timelines .item.selected + .item, body:matches(.window-inactive, .window-docked-inactive) .timeline-overview > .tree-outline.timelines .item.selected + .item): Added.
2373         (.timeline-overview > .tree-outline.timelines .item.selected + .item, body.window-inactive .timeline-overview > .tree-outline.timelines .item.selected + .item): Deleted.
2374         (@media (prefers-color-scheme: dark) .timeline-overview > .tree-outline.timelines .item.selected + .item, body.window-inactive .timeline-overview > .tree-outline.timelines .item.selected + .item): Deleted.
2375         * UserInterface/Views/TimelineRecordFrame.css:
2376         (body:matches(.window-inactive, .window-docked-inactive) .timeline-record-frame.selected): Added.
2377         (body.window-inactive .timeline-record-frame.selected): Deleted.
2378         * UserInterface/Views/TimelineRuler.css:
2379         (body:matches(.window-inactive, .window-docked-inactive) .timeline-ruler > .header > .divider): Added.
2380         (body.window-inactive .timeline-ruler > .header > .divider): Deleted.
2381         Add selectors for `.window-docked-inactive` everywhere that `.window-inactive` exists.
2382
2383         * UserInterface/Base/Setting.js:
2384         Remove new tab bar experimental setting.
2385
2386         * UserInterface/Debug/Bootstrap.js:
2387         (WI.runBootstrapOperations):
2388         (WI.runBootstrapOperations.applyDumpMessagesState):
2389         (WI.runBootstrapOperations.updateDebugUI):
2390
2391         * UserInterface/Main.html:
2392         * Localizations/en.lproj/localizedStrings.js:
2393
2394         * UserInterface/Views/ActivateButtonToolbarItem.js: Removed.
2395         * UserInterface/Views/ButtonToolbarItem.js: Removed.
2396         * UserInterface/Views/ButtonToolbarItem.css: Removed.
2397         * UserInterface/Views/ControlToolbarItem.js: Removed.
2398         * UserInterface/Views/ControlToolbarItem.css: Removed.
2399         * UserInterface/Views/Toolbar.js: Removed.
2400         * UserInterface/Views/Toolbar.css: Removed.
2401         Remove toolbar related code now that it has been merged into the tab bar.
2402
2403         * UserInterface/Models/DebuggerDashboard.js: Removed.
2404         * UserInterface/Models/DefaultDashboard.js: Removed.
2405         * UserInterface/Views/DashboardContainerView.js: Removed.
2406         * UserInterface/Views/DashboardContainerView.css: Removed.
2407         * UserInterface/Views/DashboardView.js: Removed.
2408         * UserInterface/Views/DebuggerDashboardView.js: Removed.
2409         * UserInterface/Views/DebuggerDashboardView.css: Removed.
2410         * UserInterface/Views/DefaultDashboardView.js: Removed.
2411         * UserInterface/Views/DefaultDashboardView.css: Removed.
2412         Remove dashboard related code now that it has been merged into the tab bar.
2413
2414         * UserInterface/Views/LegacyTabBar.js: Removed.
2415         * UserInterface/Views/NewTabContentView.js: Removed.
2416         * UserInterface/Views/NewTabContentView.css: Removed.
2417         * UserInterface/Images/NewTab.svg: Removed.
2418         * UserInterface/Images/NewTabPlus.svg: Removed.
2419         * UserInterface/Images/SearchResults.svg: Removed.
2420         Remove the lebacy tab bar in favor of the new tab bar.
2421
2422 2020-03-02  Jon Davis  <jond@apple.com>
2423
2424         Updated breakpoint and search type icons
2425         https://bugs.webkit.org/show_bug.cgi?id=208453
2426
2427         Reviewed by Devin Rousso.
2428
2429         * UserInterface/Images/ApplicationCacheManifest.svg:
2430         * UserInterface/Images/ClippingIcons.svg:
2431         * UserInterface/Images/DocumentIcons.svg:
2432         * UserInterface/Images/FolderGeneric.svg:
2433         * UserInterface/Images/InstrumentIcons.svg:
2434         * UserInterface/Images/NavigationItemNetworkOverride.svg:
2435         * UserInterface/Images/Origin.svg:
2436         * UserInterface/Images/TableIcons.svg:
2437         * UserInterface/Images/TypeIcons.svg:
2438         * UserInterface/Views/BreakpointTreeElement.css:
2439         (.breakpoint-debugger-statement-icon .icon):
2440         (.breakpoint-generic-line-icon .icon):
2441         (@media (prefers-color-scheme: dark) .breakpoint-debugger-statement-icon .icon):
2442         (@media (prefers-color-scheme: dark) .breakpoint-generic-line-icon .icon):
2443         * UserInterface/Views/EventBreakpointTreeElement.css:
2444         (.breakpoint.event.breakpoint-for-animation-frame:not(.breakpoint-paused-icon) .icon):
2445         (.breakpoint.event.breakpoint-for-interval:not(.breakpoint-paused-icon) .icon):
2446         (.breakpoint.event.breakpoint-for-listener:not(.breakpoint-paused-icon) .icon):
2447         (.breakpoint.event.breakpoint-for-timeout:not(.breakpoint-paused-icon) .icon):
2448         (@media(prefers-color-scheme: dark) .breakpoint.event.breakpoint-for-animation-frame:not(.breakpoint-paused-icon) .icon):
2449         (@media(prefers-color-scheme: dark) .breakpoint.event.breakpoint-for-interval:not(.breakpoint-paused-icon) .icon):
2450         (@media(prefers-color-scheme: dark) .breakpoint.event.breakpoint-for-listener:not(.breakpoint-paused-icon) .icon):
2451         (@media(prefers-color-scheme: dark) .breakpoint.event.breakpoint-for-timeout:not(.breakpoint-paused-icon) .icon):
2452         * UserInterface/Views/FolderIcon.css:
2453         (.tree-outline .folder-icon.selected:focus .icon):
2454         (.tree-outline .origin-icon.selected:focus .icon):
2455         (.tree-outline:focus .folder-icon.selected .icon): Deleted.
2456         (.tree-outline:focus .origin-icon.selected .icon): Deleted.
2457         * UserInterface/Views/RecordingActionTreeElement.css:
2458         (.item.recording-action > .icon):
2459         (@media (prefers-color-scheme: dark) .item.recording-action > .icon):
2460
2461 2020-03-02  Jon Davis  <jond@apple.com>
2462
2463         Update the resource override button icon
2464         https://bugs.webkit.org/show_bug.cgi?id=208459
2465
2466         Reviewed by Devin Rousso.
2467
2468         * UserInterface/Images/NavigationItemNetworkOverride.svg:
2469
2470 2020-02-28  Nikita Vasilyev  <nvasilyev@apple.com>
2471
2472         REGRESSION(r257411): Web Inspector: Can't add a breakpoint by pressing the plus button
2473         https://bugs.webkit.org/show_bug.cgi?id=208359
2474         <rdar://problem/59870712>
2475
2476         Reviewed by Brian Burg.
2477
2478         In r257411 I added event.stop() (which is a shortcut for event.preventDefault() and
2479         event.stopImmediatePropagation()) to mousedown handler. Calling event.stopImmediatePropagation()
2480         prevented other mousedown event handlers from running.
2481
2482         This patch no longer calls event.stopImmediatePropagation().
2483
2484         * UserInterface/Views/ButtonNavigationItem.js:
2485         (WI.ButtonNavigationItem.prototype._handleMouseDown):
2486
2487 2020-02-27  Devin Rousso  <drousso@apple.com>
2488
2489         Web Inspector: allow use of dark mode theme independently from system-wide theme
2490         https://bugs.webkit.org/show_bug.cgi?id=186308
2491         <rdar://problem/40785895>
2492
2493         Reviewed by Timothy Hatcher.
2494
2495         * UserInterface/Base/Setting.js:
2496         * UserInterface/Views/SettingsTabContentView.js:
2497         (WI.SettingsTabContentView.prototype._createGeneralSettingsView):
2498         Create a setting for controlling/preserving the theme of the frontend UI.
2499
2500         * UserInterface/Base/Main.js:
2501         (WI.loaded):
2502         (WI.contentLoaded):
2503         Apply the created setting when Web Inspector is opened or if its value changes.
2504
2505         * UserInterface/Views/SettingEditor.js:
2506         (WI.SettingEditor.prototype._createEditorElement):
2507         Allow horizontal dividers in `<select>` setting editors.
2508
2509         * Localizations/en.lproj/localizedStrings.js:
2510
2511 2020-02-27  Devin Rousso  <drousso@apple.com>
2512
2513         Web Inspector: localize the placeholder "Header" and "value" when editing a local override
2514         https://bugs.webkit.org/show_bug.cgi?id=208276
2515         <rdar://problem/59763619>
2516
2517         Reviewed by Brian Burg.
2518
2519         * Localizations/en.lproj/localizedStrings.js:
2520         * UserInterface/Views/LocalResourceOverridePopover.js:
2521         (WI.LocalResourceOverridePopover.prototype.show):
2522
2523 2020-02-26  Devin Rousso  <drousso@apple.com>
2524
2525         REGRESSION: (257410) [ macOS ] inspector/network/client-blocked-load.html is failing
2526         https://bugs.webkit.org/show_bug.cgi?id=208251
2527         <rdar://problem/59812765>
2528
2529         Reviewed by Timothy Hatcher.
2530
2531         * UserInterface/Models/SourceCode.js:
2532         (WI.SourceCode):
2533         The test failed because it expected `url` to be an empty string (`""`) instead of `null`.
2534         Use the given `url` parameter exactly as provided instead of trying to add a fallback in the
2535         case of a falsy value. Given the prevalence of usage of `WI.SourceCode`, it's better to
2536         match the existing behavior of before r257410 than change it and risk other subtle bugs.
2537
2538 2020-02-25  Nikita Vasilyev  <nvasilyev@apple.com>
2539
2540         Web Inspector: AXI: buttons should be focusable when navigating by pressing Tab
2541         https://bugs.webkit.org/show_bug.cgi?id=208163
2542         <rdar://problem/59745448>
2543
2544         Reviewed by Brian Burg.
2545
2546         Buttons now accessible with Tab navigation. The focused button has the native focus outline.
2547
2548         Clicking on the button does NOT move the focus. For example, when you're focused on the
2549         console prompt, clicking on the icon to hide the right sidebar keeps you focused where
2550         you were — the console prompt. This behavior matches macOS.
2551
2552         Convert WI.NavigationItem with role=button from `<div>` to `<button>` elements.
2553         Button elements have implicit tabIndex=0. When focused, pressing Space or Enter
2554         triggers "click" event.
2555
2556         * UserInterface/Views/ActivateButtonNavigationItem.js:
2557         (WI.ActivateButtonNavigationItem.prototype.set activated):
2558         Add "aria-pressed" and "aria-label" attributes for VoiceOver.
2559
2560         * UserInterface/Views/ButtonNavigationItem.css:
2561         (.navigation-bar .item.button:not(.image-only):focus,):
2562         (.navigation-bar .item.button.image-only:focus):
2563         (.navigation-bar .item.button:not(.disabled):matches(.activate.activated, .radio.selected) > .glyph):
2564         (.navigation-bar .item.button:not(.disabled):active:matches(.activate.activated, .radio.selected) > .glyph):
2565         Before this patch, focused button looked the same as activated buttons.
2566         For example, the focused (non-active) bullseye icon looked exactly the
2567         same as unfocused active bullseye icon, which was misleading.
2568
2569         * UserInterface/Views/ButtonNavigationItem.js:
2570         (WI.ButtonNavigationItem):
2571         (WI.ButtonNavigationItem.prototype._mouseClicked):
2572         (WI.ButtonNavigationItem.prototype._handleMouseDown):
2573         Clicking on a button shouldn't move focus. For example, when you're focused on the console prompt,
2574         clicking on the icon to hide the right sidebar should keep you focused where you were - the console prompt.
2575
2576         (WI.ButtonNavigationItem.prototype._handleKeyDown):
2577         * UserInterface/Views/ButtonToolbarItem.css:
2578         (.toolbar .item.button):
2579         Adjust outline offset to remove the gap between the outline and the border of the button.
2580
2581         (.toolbar .item.button:not(.disabled).activate.activated):
2582         (@media (prefers-color-scheme: dark) body:not(.window-inactive) .toolbar .item.button:not(.disabled).activate.activated > .glyph):
2583         * UserInterface/Views/ControlToolbarItem.css:
2584         (.toolbar .item.control:focus):
2585         (.toolbar .item.control:focus > .glyph):
2586         Draw the outline around the X (close button) glyph, not the button itself (which is much wider than the glyph).
2587
2588         * UserInterface/Views/NavigationBar.css:
2589         (.navigation-bar .item):
2590         (.navigation-bar .item:focus):
2591         * UserInterface/Views/NavigationBar.js:
2592         (WI.NavigationBar):
2593         "focus" and "blur" events don't bubble. These event handlers didn't capture the event.
2594
2595         (WI.NavigationBar.prototype._mouseDown):
2596         (WI.NavigationBar.prototype._keyDown):
2597         * UserInterface/Views/NavigationItem.js:
2598         (WI.NavigationItem):
2599         * UserInterface/Views/RadioButtonNavigationItem.css:
2600         (.navigation-bar .item.radio.button:focus):
2601         * UserInterface/Views/Toolbar.css:
2602         (.toolbar .item):
2603
2604 2020-02-25  Devin Rousso  <drousso@apple.com>
2605
2606         Web Inspector: safari app extension isolated worlds and injected files use the extension's identifier instead of its name
2607         https://bugs.webkit.org/show_bug.cgi?id=206911
2608         <rdar://problem/58026635>
2609
2610         Reviewed by Brian Burg.
2611
2612         * UserInterface/Controllers/BrowserManager.js: Added.
2613         (WI.BrowserManager):
2614         (WI.BrowserManager.prototype.initializeTarget):
2615         (WI.BrowserManager.prototype.enable):
2616         (WI.BrowserManager.prototype.disable):
2617         (WI.BrowserManager.prototype.isExtensionScheme):
2618         (WI.BrowserManager.prototype.extensionNameForId):
2619         (WI.BrowserManager.prototype.extensionNameForURL):
2620         * UserInterface/Protocol/BrowserObserver.js: Added.
2621         (WI.BrowserObserver.prototype.extensionsEnabled):
2622         (WI.BrowserObserver.prototype.extensionsDisabled):
2623         * UserInterface/Protocol/Target.js:
2624         (WI.Target.prototype.get BrowserAgent): Added.
2625         * UserInterface/Base/Main.js:
2626         (WI.loaded):
2627         * UserInterface/Main.html:
2628         * UserInterface/Test/Test.js:
2629         (WI.loaded):
2630         * UserInterface/Test.html:
2631         Add an observer and manager for the `Browser` domain.
2632
2633         * UserInterface/Protocol/MultiplexingBackendTarget.js:
2634         (WI.MultiplexingBackendTarget):
2635         (WI.MultiplexingBackendTarget.prototype.initialize):
2636         * UserInterface/Controllers/TargetManager.js:
2637         (WI.TargetManager.prototype.initializeTarget): Added.
2638         The `Browser` agent lives in the UIProcess alongside the `Target` agent (meaning there
2639         should only be one per debuggable rather than one per target) and as such is not routed
2640         through the `Target` agent.
2641
2642         * UserInterface/Views/QuickConsole.js:
2643         (WI.QuickConsole.prototype._displayNameForExecutionContext):
2644         Attempt to match the execution context name against any known extension identifier, and
2645         use the extension's display name if one is found.
2646
2647         * UserInterface/Base/URLUtilities.js:
2648         (WI.displayNameForHost):
2649         Attempt to match the host against any known extension identifier, and use the extension's
2650         display name if one is found.
2651
2652         * UserInterface/Views/SourcesNavigationSidebarPanel.js:
2653         (WI.SourcesNavigationSidebarPanel.prototype._addStyleSheet):
2654         (WI.SourcesNavigationSidebarPanel.prototype._addScript):
2655         * UserInterface/Base/Utilities.js:
2656         (isWebKitExtensionScheme): Deleted.
2657         * .eslintrc:
2658         Use `WI.BrowserManager.prototype.isExtensionScheme` instead of the global function.
2659
2660         * UserInterface/Models/SourceCode.js:
2661         (WI.SourceCode):
2662         (WI.SourceCode.prototype.get url): Added.
2663         (WI.SourceCode.prototype.get urlComponents): Added.
2664         * UserInterface/Models/CSSStyleSheet.js:
2665         (WI.CSSStyleSheet):
2666         (WI.CSSStyleSheet.prototype.get injected):
2667         (WI.CSSStyleSheet.prototype.get url): Deleted.
2668         (WI.CSSStyleSheet.prototype.get urlComponents): Deleted.
2669         * UserInterface/Models/Resource.js:
2670         (WI.Resource):
2671         (WI.Resource.prototype.get url): Deleted.
2672         (WI.Resource.prototype.get urlComponents): Deleted.
2673         * UserInterface/Models/Script.js:
2674         (WI.Script):
2675         (WI.Script.prototype.get url): Deleted.
2676         (WI.Script.prototype.get urlComponents): Deleted.
2677         All subclasses of `WI.SourceCode` have separate `get url` and `get urlComponents` functions,
2678         so unify them in the common superclass so that it's guaranteed to exist.
2679
2680 2020-02-25  Devin Rousso  <drousso@apple.com>
2681
2682         Web Inspector: move code for debug outlined focus element to the Debug folder so it isn't shipped
2683         https://bugs.webkit.org/show_bug.cgi?id=208217
2684
2685         Reviewed by Joseph Pecoraro.
2686
2687         * UserInterface/Base/Main.js:
2688         (WI.contentLoaded):
2689         (WI.contentLoaded.setFocusDebugOutline): Deleted.
2690         * UserInterface/Views/Main.css:
2691         (body.focus-debug *:focus): Deleted.
2692
2693         * UserInterface/Debug/Bootstrap.js:
2694         (WI.runBootstrapOperations):
2695         (WI.runBootstrapOperations.setFocusDebugOutline): Added.
2696         * UserInterface/Debug/Bootstrap.css: Added.
2697         (body.focus-debug *:focus):
2698
2699         * UserInterface/Main.html:
2700
2701 2020-02-25  Nikita Vasilyev  <nvasilyev@apple.com>
2702
2703         Web Inspector: VoiceOver should read "Console prompt" when focusing on it
2704         https://bugs.webkit.org/show_bug.cgi?id=208028
2705         <rdar://problem/59641238>
2706
2707         Reviewed by Brian Burg.
2708
2709         Before this change, VoiceOver read "edit text blank" when focusing on the console prompt.
2710
2711         * Localizations/en.lproj/localizedStrings.js:
2712         * UserInterface/Views/ConsolePrompt.js:
2713         (WI.ConsolePrompt):
2714
2715 2020-02-25  Nikita Vasilyev  <nvasilyev@apple.com>
2716
2717         Web Inspector: VoiceOver: TreeOutline does not correctly indicate selected item
2718         https://bugs.webkit.org/show_bug.cgi?id=207968
2719
2720         Reviewed by Brian Burg.
2721
2722         Previously, the entire TreeOutline's DOM element had focus. With this patch,
2723         selected item DOM element has focus instead. When clicking on the treeElement,
2724         set tabIndex to 0 and focus on it.
2725
2726         * UserInterface/Views/DOMTreeOutline.css:
2727         (.tree-outline.dom): Fix indentation.
2728
2729         (.tree-outline.dom:not(.non-selectable):focus-within li.selected .selection-area):
2730         (.tree-outline.dom:not(.non-selectable) li.hovered:not(.selected) .selection-area):
2731         (.tree-outline.dom:focus-within li.inspected-node.selected > span::after):
2732         (.tree-outline.dom li):
2733         Remove outline - selection is already indicated by the background.
2734
2735         (.tree-outline.dom:focus-within li.selected .pseudo-class-indicator):
2736         (.tree-outline.dom:focus-within li.selected):
2737         (.tree-outline.dom:focus-within li.selected *):
2738         (.tree-outline.dom:focus-within li.parent.selected::before):
2739         (.tree-outline.dom:focus-within li.parent.expanded.selected::before):
2740         * UserInterface/Views/DOMTreeOutline.js:
2741         * UserInterface/Views/TreeElement.js:
2742         (WI.TreeElement.prototype._attach):
2743         (WI.TreeElement.prototype.collapse):
2744         (WI.TreeElement.prototype.expand):
2745         (WI.TreeElement.prototype.select):
2746         (WI.TreeElement.prototype.deselect):
2747         (WI.TreeElement.prototype.focus):
2748         (WI.TreeElement.prototype.unfocus):
2749         * UserInterface/Views/TreeOutline.css:
2750         (.tree-outline .item.selected:focus .disclosure-button):
2751         (.tree-outline .item.selected.expanded:focus .disclosure-button):
2752         (.tree-outline .item.selected:focus):
2753         (.tree-outline .item.selected:focus .subtitle):
2754         (.tree-outline:not(.large) .item.selected:focus .status .indeterminate-progress-spinner):
2755         * UserInterface/Views/TreeOutline.js:
2756         (WI.TreeOutline.prototype._treeKeyDown):
2757         (WI.TreeOutline.prototype._handleMouseDown):
2758
2759 2020-02-19  Jon Davis  <jond@apple.com>
2760
2761         Fixed object trees using the wrong theme of type icon
2762         https://bugs.webkit.org/show_bug.cgi?id=207980
2763
2764         Reviewed by Darin Adler.
2765
2766         * UserInterface/Views/ObjectTreePropertyTreeElement.css:
2767         (.object-tree-property.boolean > .icon):
2768         (.object-tree-property.function > .icon):
2769         (.object-tree-property.number > .icon):
2770         (.object-tree-property.bigint > .icon):
2771         (.object-tree-property.object > .icon):
2772         (.object-tree-property.object.null > .icon):
2773         (.object-tree-property.object.node > .icon):
2774         (.object-tree-property.regex > .icon):
2775         (.object-tree-property.string > .icon):
2776         (.object-tree-property.symbol > .icon):
2777         (.object-tree-property.accessor > .icon,):
2778         (.object-tree-property.had-error > .icon):
2779         (@media (prefers-color-scheme: dark) .object-tree-property.boolean > .icon):
2780         (@media (prefers-color-scheme: dark) .object-tree-property.function > .icon):
2781         (@media (prefers-color-scheme: dark) .object-tree-property.number > .icon):
2782         (@media (prefers-color-scheme: dark) .object-tree-property.bigint > .icon):
2783         (@media (prefers-color-scheme: dark) .object-tree-property.object > .icon):
2784         (@media (prefers-color-scheme: dark) .object-tree-property.object.null > .icon):
2785         (@media (prefers-color-scheme: dark) .object-tree-property.object.node > .icon):
2786         (@media (prefers-color-scheme: dark) .object-tree-property.regex > .icon):
2787         (@media (prefers-color-scheme: dark) .object-tree-property.string > .icon):
2788         (@media (prefers-color-scheme: dark) .object-tree-property.symbol > .icon):
2789         (@media (prefers-color-scheme: dark) .object-tree-property.accessor > .icon,):
2790         (@media (prefers-color-scheme: dark) .object-tree-property.had-error > .icon):
2791
2792 2020-02-17  Nikita Vasilyev  <nvasilyev@apple.com>
2793
2794         Web Inspector: Add "outline focused element" debug setting
2795         https://bugs.webkit.org/show_bug.cgi?id=207819
2796         <rdar://problem/59489993>
2797
2798         Reviewed by Timothy Hatcher.
2799
2800         When debugging accessibility issues of Web Inspector, it's helpful
2801         to know what element is focused. Many elements have `outline: none`
2802         and no clear indication of what's focused.
2803
2804         Add a debug setting to display a bright purple outline for all focused
2805         elements.
2806
2807         * UserInterface/Base/Main.js:
2808         (WI.contentLoaded):
2809         * UserInterface/Base/Setting.js:
2810         * UserInterface/Views/Main.css:
2811         (body.focus-debug *:focus):
2812         * UserInterface/Views/SettingsTabContentView.js:
2813         (WI.SettingsTabContentView.prototype._createDebugSettingsView):
2814
2815 2020-02-17  Jon Davis  <jond@apple.com>
2816
2817         Update resource, type, and instrument icons for light, dark, and override colors
2818         https://bugs.webkit.org/show_bug.cgi?id=207587
2819
2820         Reviewed by Timothy Hatcher.
2821
2822         * UserInterface/Images/ApplicationCacheManifest.svg: Added.
2823         * UserInterface/Images/Beacon.svg:
2824         * UserInterface/Images/ClippingIcons.svg: Added.
2825         * UserInterface/Images/Cookie.svg: Added.
2826         * UserInterface/Images/Database.svg: Added.
2827         * UserInterface/Images/DocumentIcons.svg: Added.
2828         * UserInterface/Images/FolderGeneric.svg: Added.
2829         * UserInterface/Images/InstrumentIcons.svg: Added.
2830         * UserInterface/Images/Origin.svg:
2831         * UserInterface/Images/Stopwatch.svg:
2832         * UserInterface/Images/TableIcons.svg: Added.
2833         * UserInterface/Images/TypeIcons.svg: Added.
2834         * UserInterface/Views/AuditTreeElement.css:
2835         (.audit.test-case .icon):
2836         (.audit.test-group .icon):
2837         (.audit.test-case-result .icon):
2838         (.audit.test-group-result .icon):
2839         (@media (prefers-color-scheme: dark) .audit.test-case .icon):
2840         (@media (prefers-color-scheme: dark) .audit.test-group .icon):
2841         (@media (prefers-color-scheme: dark) .audit.test-case-result .icon):
2842         (@media (prefers-color-scheme: dark) .audit.test-group-result .icon):
2843         * UserInterface/Views/BreakpointTreeElement.css:
2844         (.breakpoint-exception-icon .icon):
2845         (.breakpoint-assertion-icon .icon):
2846         (.breakpoint-microtask-icon .icon):
2847         (.breakpoint-paused-icon .icon):
2848         (@media (prefers-color-scheme: dark) .breakpoint-exception-icon .icon):
2849         (@media (prefers-color-scheme: dark) .breakpoint-assertion-icon .icon):
2850         (@media (prefers-color-scheme: dark) .breakpoint-microtask-icon .icon):
2851         (@media (prefers-color-scheme: dark) .breakpoint-paused-icon .icon):
2852         * UserInterface/Views/CallFrameIcons.css:
2853         (.program-icon .icon):
2854         (.function-icon .icon):
2855         (.event-listener-icon .icon):
2856         (.native-icon .icon):
2857         (.tail-deleted .icon):
2858         (@media (prefers-color-scheme: dark) .program-icon .icon):
2859         (@media (prefers-color-scheme: dark) .function-icon .icon):
2860         (@media (prefers-color-scheme: dark) .event-listener-icon .icon):
2861         (@media (prefers-color-scheme: dark) .native-icon .icon):
2862         (@media (prefers-color-scheme: dark) .tail-deleted .icon):
2863         * UserInterface/Views/CanvasSidebarPanel.css:
2864         (.sidebar > .panel.navigation.canvas > .content > .recording-content > .tree-outline .item.folder-icon > .icon):
2865         (@media (prefers-color-scheme: dark) .sidebar > .panel.navigation.canvas > .content > .recording-content > .tree-outline .item.folder-icon > .icon):
2866         * UserInterface/Views/DOMBreakpointTreeElement.css:
2867         (.breakpoint.dom.breakpoint-for-subtree-modified:not(.breakpoint-paused-icon) .icon):
2868         (.breakpoint.dom.breakpoint-for-attribute-modified:not(.breakpoint-paused-icon) .icon):
2869         (.breakpoint.dom.breakpoint-for-node-removed:not(.breakpoint-paused-icon) .icon):
2870         (@media (prefers-color-scheme: dark) .breakpoint.dom.breakpoint-for-subtree-modified:not(.breakpoint-paused-icon) .icon):
2871         (@media (prefers-color-scheme: dark) .breakpoint.dom.breakpoint-for-attribute-modified:not(.breakpoint-paused-icon) .icon):
2872         (@media (prefers-color-scheme: dark) .breakpoint.dom.breakpoint-for-node-removed:not(.breakpoint-paused-icon) .icon):
2873         * UserInterface/Views/DOMNodeTreeElement.css:
2874         (.tree-outline .item.dom-node .icon):
2875         (@media (prefers-color-scheme: dark) .tree-outline .item.dom-node .icon):
2876         * UserInterface/Views/FolderIcon.css:
2877         (.folder-icon .icon):
2878         (.tree-outline:focus .folder-icon.selected .icon):
2879         (.origin-icon .icon):
2880         (.tree-outline:focus .origin-icon.selected .icon):
2881         (@media (prefers-color-scheme: dark) .folder-icon .icon):
2882         (@media (prefers-color-scheme: dark) .origin-icon .icon):
2883         * UserInterface/Views/HeapAllocationsTimelineOverviewGraph.css:
2884         (.timeline-overview-graph.heap-allocations > img.snapshot):
2885         (@media (prefers-color-scheme: dark) .timeline-overview-graph.heap-allocations > img.snapshot):
2886         * UserInterface/Views/HeapAllocationsTimelineView.css:
2887         (.timeline-view.heap-allocations > .data-grid td .icon.heap-snapshot):
2888         (@media (prefers-color-scheme: dark) .timeline-view.heap-allocations > .data-grid td .icon.heap-snapshot):
2889         * UserInterface/Views/HeapSnapshotInstancesContentView.css:
2890         (.heap-snapshot .icon):
2891         (.heap-snapshot .icon.native):
2892         (.heap-snapshot .icon.boolean):
2893         (.heap-snapshot .icon.function):
2894         (.heap-snapshot .icon.number):
2895         (.heap-snapshot .icon.bigint):
2896         (.heap-snapshot .icon.object):
2897         (.heap-snapshot .icon.node):
2898         (.heap-snapshot .icon.regex):
2899         (.heap-snapshot .icon.string):
2900         (.heap-snapshot .icon.symbol):
2901         (@media (prefers-color-scheme: dark) .heap-snapshot .icon):
2902         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.native):
2903         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.boolean):
2904         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.function):
2905         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.number):
2906         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.bigint):
2907         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.object):
2908         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.node):
2909         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.regex):
2910         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.string):
2911         (@media (prefers-color-scheme: dark) .heap-snapshot .icon.symbol):
2912         * UserInterface/Views/IdleTreeElement.css:
2913         (.details-section.call-stack .idle .icon):
2914         (@media (prefers-color-scheme: dark) .details-section.call-stack .idle .icon):
2915         * UserInterface/Views/LayerDetailsSidebarPanel.css:
2916         (.panel.details.layer .name-column .icon):
2917         (.panel.details.layer tr.reflection .name-column .icon):
2918         (.panel.details.layer tr.pseudo-element .name-column .icon):
2919         (@media (prefers-color-scheme: dark) .panel.details.layer .name-column .icon):
2920         (@media (prefers-color-scheme: dark) .panel.details.layer tr.reflection .name-column .icon):
2921         (@media (prefers-color-scheme: dark) .panel.details.layer tr.pseudo-element .name-column .icon):
2922         * UserInterface/Views/LayerTreeDetailsSidebarPanel.css:
2923         (.panel.details.layer-tree .name-column .icon):
2924         (.panel.details.layer-tree tr.reflection .name-column .icon):
2925         (.panel.details.layer-tree tr.pseudo-element .name-column .icon):
2926         (@media (prefers-color-scheme: dark) .panel.details.layer-tree .name-column .icon):
2927         (@media (prefers-color-scheme: dark) .panel.details.layer-tree tr.reflection .name-column .icon):
2928         (@media (prefers-color-scheme: dark) .panel.details.layer-tree tr.pseudo-element .name-column .icon):
2929         * UserInterface/Views/NetworkTableContentView.css:
2930         (.network-table > .table li:not(.selected) .cell:not(.current-session)):
2931         (.network-table > .table .cell.dom-node.name .icon):
2932         (@media (prefers-color-scheme: dark) .breakpoint-assertion-icon .icon):
2933         (@media (prefers-color-scheme: dark) .network-table > .table .cell.dom-node.name .icon):
2934         (.network-table .cell.dom-node.name .icon): Deleted.
2935         * UserInterface/Views/ObjectTreePropertyTreeElement.css:
2936         (.object-tree-property.boolean > .icon):
2937         (.object-tree-property.function > .icon):
2938         (.object-tree-property.number > .icon):
2939         (.object-tree-property.bigint > .icon):
2940         (.object-tree-property.object > .icon):
2941         (.object-tree-property.object.null > .icon):
2942         (.object-tree-property.object.node > .icon):
2943         (.object-tree-property.regex > .icon):
2944         (.object-tree-property.string > .icon):
2945         (.object-tree-property.symbol > .icon):
2946         (.object-tree-property.accessor > .icon,):
2947         (.object-tree-property.had-error > .icon):
2948         (@media (prefers-color-scheme: dark) .object-tree-property.boolean > .icon):
2949         (@media (prefers-color-scheme: dark) .object-tree-property.function > .icon):
2950         (@media (prefers-color-scheme: dark) .object-tree-property.number > .icon):
2951         (@media (prefers-color-scheme: dark) .object-tree-property.bigint > .icon):
2952         (@media (prefers-color-scheme: dark) .object-tree-property.object > .icon):
2953         (@media (prefers-color-scheme: dark) .object-tree-property.object.null > .icon):
2954         (@media (prefers-color-scheme: dark) .object-tree-property.object.node > .icon):
2955         (@media (prefers-color-scheme: dark) .object-tree-property.regex > .icon):
2956         (@media (prefers-color-scheme: dark) .object-tree-property.string > .icon):
2957         (@media (prefers-color-scheme: dark) .object-tree-property.symbol > .icon):
2958         (@media (prefers-color-scheme: dark) .object-tree-property.accessor > .icon,):
2959         (@media (prefers-color-scheme: dark) .object-tree-property.had-error > .icon):
2960         * UserInterface/Views/PathComponentIcons.css:
2961         (.request-icon .icon):
2962         (.response-icon .icon):
2963         (.heap-snapshot-summary-icon .icon):
2964         (.heap-snapshot-instances-icon .icon):
2965         (.heap-snapshot-object-graph-icon .icon):
2966         (.dom-element-icon .icon):
2967         (.dom-pseudo-element-icon .icon):
2968         (.dom-text-node-icon .icon):
2969         (.dom-comment-icon .icon):
2970         (.dom-document-type-icon .icon):
2971         (.dom-document-icon .icon):
2972         (.dom-character-data-icon .icon):
2973         (.dom-node-icon .icon):
2974         (.object-icon .icon):
2975         (.function-icon .icon):
2976         (.native-icon .icon):
2977         (.program-icon .icon):
2978         (.events-icon .icon):
2979         (.call-trees-icon .icon):
2980         (.snapshot-list-icon .icon):
2981         (.snapshot-diff-icon .icon):
2982         (.image-icon .icon):
2983         (.source-icon .icon):
2984         (@media (prefers-color-scheme: dark) .request-icon .icon):
2985         (@media (prefers-color-scheme: dark) .response-icon .icon):
2986         (@media (prefers-color-scheme: dark) .heap-snapshot-summary-icon .icon):
2987         (@media (prefers-color-scheme: dark) .heap-snapshot-instances-icon .icon):
2988         (@media (prefers-color-scheme: dark) .heap-snapshot-object-graph-icon .icon):
2989         (@media (prefers-color-scheme: dark) .dom-element-icon .icon):
2990         (@media (prefers-color-scheme: dark) .dom-pseudo-element-icon .icon):
2991         (@media (prefers-color-scheme: dark) .dom-text-node-icon .icon):
2992         (@media (prefers-color-scheme: dark) .dom-comment-icon .icon):
2993         (@media (prefers-color-scheme: dark) .dom-document-type-icon .icon):
2994         (@media (prefers-color-scheme: dark) .dom-document-icon .icon):
2995         (@media (prefers-color-scheme: dark) .dom-character-data-icon .icon):
2996         (@media (prefers-color-scheme: dark) .dom-node-icon .icon):
2997         (@media (prefers-color-scheme: dark) .object-icon .icon):
2998         (@media (prefers-color-scheme: dark) .function-icon .icon):
2999         (@media (prefers-color-scheme: dark) .native-icon .icon):
3000         (@media (prefers-color-scheme: dark) .program-icon .icon):
3001         (@media (prefers-color-scheme: dark) .events-icon .icon):
3002         (@media (prefers-color-scheme: dark) .call-trees-icon .icon):
3003         (@media (prefers-color-scheme: dark) .snapshot-list-icon .icon):
3004         (@media (prefers-color-scheme: dark) .snapshot-diff-icon .icon):
3005         (@media (prefers-color-scheme: dark) .source-icon .icon):
3006         * UserInterface/Views/ProfileView.css:
3007         (.profile > .data-grid td .icon.function-icon):
3008         (.profile > .data-grid td .icon.native-icon):
3009         (.profile > .data-grid td .icon.program-icon):
3010         (@media (prefers-color-scheme: dark) .profile > .data-grid td .icon.function-icon):
3011         (@media (prefers-color-scheme: dark) .profile > .data-grid td .icon.native-icon):
3012         (@media (prefers-color-scheme: dark) .profile > .data-grid td .icon.program-icon):
3013         * UserInterface/Views/ResourceIcons.css:
3014         (.resource-icon .icon):
3015         (.resource-icon.override .icon):
3016         (.resource-icon.resource-type-document .icon):
3017         (.resource-icon.resource-type-document.override .icon):
3018         (.resource-icon.resource-type-image .icon):
3019         (.resource-icon.resource-type-image.override .icon):
3020         (.resource-icon.resource-type-font .icon):
3021         (.resource-icon.resource-type-font.override .icon):
3022         (:matches(.resource-icon.resource-type-style-sheet, .style-sheet-icon) .icon):
3023         (:matches(.resource-icon.resource-type-style-sheet.override, .style-sheet-icon.override) .icon):
3024         (.resource-icon.resource-type-script .icon):
3025         (.resource-icon.resource-type-script.override .icon):
3026         (.anonymous-script-icon .icon):
3027         (.source-map-resource.resource-icon .icon):
3028         (.source-map-resource.resource-icon.resource-type-style-sheet .icon):
3029         (.source-map-resource.resource-icon.resource-type-script .icon):
3030         (.script.worker-icon .icon):
3031         (.script.worker-icon.override .icon):
3032         (.resource-icon.resource-type-websocket .icon):
3033         (.resource-icon.resource-type-ping .icon,):
3034         (.resource-icon.resource-type-range .icon):
3035         (@media (prefers-color-scheme: dark) .resource-icon .icon):
3036         (@media (prefers-color-scheme: dark) .resource-icon.override .icon):
3037         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-document .icon):
3038         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-document.override .icon):
3039         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-image .icon):
3040         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-image.override .icon):
3041         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-font .icon):
3042         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-font.override .icon):
3043         (@media (prefers-color-scheme: dark) :matches(.resource-icon.resource-type-style-sheet, .style-sheet-icon) .icon):
3044         (@media (prefers-color-scheme: dark) :matches(.resource-icon.resource-type-style-sheet.override, .style-sheet-icon.override) .icon):
3045         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-script .icon):
3046         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-script.override .icon):
3047         (@media (prefers-color-scheme: dark) .anonymous-script-icon .icon):
3048         (@media (prefers-color-scheme: dark) .source-map-resource.resource-icon .icon):
3049         (@media (prefers-color-scheme: dark) .source-map-resource.resource-icon.resource-type-style-sheet .icon):
3050         (@media (prefers-color-scheme: dark) .source-map-resource.resource-icon.resource-type-script .icon):
3051         (@media (prefers-color-scheme: dark) .script.worker-icon .icon):
3052         (@media (prefers-color-scheme: dark) .script.worker-icon.override .icon):
3053         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-websocket .icon):
3054         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-ping .icon,):
3055         (@media (prefers-color-scheme: dark) .resource-icon.resource-type-range .icon):
3056         (.large .resource-icon .icon): Deleted.
3057         (.large .resource-icon.resource-type-document .icon): Deleted.
3058         (.large .resource-icon.resource-type-image .icon): Deleted.
3059         (.large .resource-icon.resource-type-font .icon): Deleted.
3060         (.large :matches(.resource-icon.resource-type-style-sheet, .style-sheet-icon) .icon): Deleted.
3061         (.large .resource-icon.resource-type-script .icon): Deleted.
3062         (.large .anonymous-script-icon .icon): Deleted.
3063         (.large .source-map-resource.resource-icon .icon): Deleted.
3064         (.large .source-map-resource.resource-icon.resource-type-style-sheet .icon): Deleted.
3065         (.large .source-map-resource.resource-icon.resource-type-script .icon): Deleted.
3066         (.large .script.worker-icon .icon): Deleted.
3067         (.large .resource-icon.resource-type-websocket .icon): Deleted.
3068         (.large .resource-icon.resource-type-range .icon): Deleted.
3069         * UserInterface/Views/SearchIcons.css:
3070         (.dom-match-element-icon .icon):
3071         (.dom-match-text-node-icon .icon):
3072         (.dom-match-comment-icon .icon):
3073         (.dom-match-document-type-icon .icon):
3074         (.dom-match-character-data-icon .icon):
3075         (.dom-match-node-icon .icon):
3076         (.source-code-match .icon):
3077         (@media (prefers-color-scheme: dark) .dom-match-element-icon .icon):
3078         (@media (prefers-color-scheme: dark) .dom-match-text-node-icon .icon):
3079         (@media (prefers-color-scheme: dark) .dom-match-comment-icon .icon):
3080         (@media (prefers-color-scheme: dark) .dom-match-document-type-icon .icon):
3081         (@media (prefers-color-scheme: dark) .dom-match-character-data-icon .icon):
3082         (@media (prefers-color-scheme: dark) .dom-match-node-icon .icon):
3083         (@media (prefers-color-scheme: dark) .source-code-match .icon):
3084         * UserInterface/Views/StorageIcons.css:
3085         (.application-cache-manifest .icon):
3086         (.application-cache-frame .icon):
3087         (.cookie-icon .icon):
3088         (.local-storage-icon .icon):
3089         (.session-storage-icon .icon):
3090         (.database-icon .icon):
3091         (.database-table-icon .icon):
3092         (@media (prefers-color-scheme: dark) .application-cache-manifest .icon):
3093         (@media (prefers-color-scheme: dark) .application-cache-frame .icon):
3094         (@media (prefers-color-scheme: dark) .local-storage-icon .icon):
3095         (@media (prefers-color-scheme: dark) .session-storage-icon .icon):
3096         (@media (prefers-color-scheme: dark) .database-icon .icon):
3097         (@media (prefers-color-scheme: dark) .database-table-icon .icon):
3098         * UserInterface/Views/StyleRuleIcons.css:
3099         (.author-style-rule-icon .icon):
3100         (.author-style-rule-icon.pseudo-selector .icon):
3101         (.user-style-rule-icon .icon):
3102         (.user-style-rule-icon.pseudo-selector .icon):
3103         (.user-agent-style-rule-icon .icon):
3104         (.user-agent-style-rule-icon.pseudo-selector .icon):
3105         (.inspector-style-rule-icon .icon):
3106         (.inspector-style-rule-icon.pseudo-selector .icon):
3107         (.inherited-style-rule-icon .icon):
3108         (.inherited-element-style-rule-icon .icon):
3109         (@media (prefers-color-scheme: dark) .author-style-rule-icon .icon):
3110         (@media (prefers-color-scheme: dark) .author-style-rule-icon.pseudo-selector .icon):
3111         (@media (prefers-color-scheme: dark) .user-style-rule-icon .icon):
3112         (@media (prefers-color-scheme: dark) .user-style-rule-icon.pseudo-selector .icon):
3113         (@media (prefers-color-scheme: dark) .user-agent-style-rule-icon .icon):
3114         (@media (prefers-color-scheme: dark) .user-agent-style-rule-icon.pseudo-selector .icon):
3115         (@media (prefers-color-scheme: dark) .inspector-style-rule-icon .icon):
3116         (@media (prefers-color-scheme: dark) .inspector-style-rule-icon.pseudo-selector .icon):
3117         (@media (prefers-color-scheme: dark) .inherited-style-rule-icon .icon):
3118         (@media (prefers-color-scheme: dark) .inherited-element-style-rule-icon .icon):
3119         * UserInterface/Views/TimelineIcons.css:
3120         (.network-icon .icon):
3121         (.script-icon .icon):
3122         (.cpu-icon .icon):
3123         (.memory-icon .icon):
3124         (.heap-allocations-icon .icon):
3125         (.layout-icon .icon):
3126         (.rendering-frame-icon .icon):
3127         (.media-icon .icon):
3128         (.stopwatch-icon .icon):
3129         (.style-record .icon):
3130         (.layout-record .icon):
3131         (.paint-record .icon):
3132         (.composite-record .icon):
3133         (.rendering-frame-record .icon):
3134         (.api-record .icon):
3135         (.evaluated-record .icon):
3136         (.event-record .icon):
3137         (.probe-record .icon):
3138         (.console-profile-record .icon):
3139         (.garbage-collection-profile-record .icon):
3140         (.timer-record .icon):
3141         (.animation-frame-record .icon):
3142         (.css-animation-record .icon):
3143         (.css-transition-record .icon):
3144         (.media-element-record .icon):
3145         (.heap-snapshot-record .icon):
3146         (@media (prefers-color-scheme: dark) .network-icon .icon):
3147         (@media (prefers-color-scheme: dark) .script-icon .icon):
3148         (@media (prefers-color-scheme: dark) .cpu-icon .icon):
3149         (@media (prefers-color-scheme: dark) .memory-icon .icon):
3150         (@media (prefers-color-scheme: dark) .heap-allocations-icon .icon):
3151         (@media (prefers-color-scheme: dark) .layout-icon .icon):
3152         (@media (prefers-color-scheme: dark) .rendering-frame-icon .icon):
3153         (@media (prefers-color-scheme: dark) .media-icon .icon):
3154         (@media (prefers-color-scheme: dark) .stopwatch-icon .icon):
3155         (@media (prefers-color-scheme: dark) .style-record .icon):
3156         (@media (prefers-color-scheme: dark) .layout-record .icon):
3157         (@media (prefers-color-scheme: dark) .paint-record .icon):
3158         (@media (prefers-color-scheme: dark) .composite-record .icon):
3159         (@media (prefers-color-scheme: dark) .rendering-frame-record .icon):
3160         (@media (prefers-color-scheme: dark) .api-record .icon):
3161         (@media (prefers-color-scheme: dark) .evaluated-record .icon):
3162         (@media (prefers-color-scheme: dark) .event-record .icon):
3163         (@media (prefers-color-scheme: dark) .probe-record .icon):
3164         (@media (prefers-color-scheme: dark) .console-profile-record .icon):
3165         (@media (prefers-color-scheme: dark) .garbage-collection-profile-record .icon):
3166         (@media (prefers-color-scheme: dark) .timer-record .icon):
3167         (@media (prefers-color-scheme: dark) .animation-frame-record .icon):
3168         (@media (prefers-color-scheme: dark) .css-animation-record .icon):
3169         (@media (prefers-color-scheme: dark) .css-transition-record .icon):
3170         (@media (prefers-color-scheme: dark) .media-element-record .icon):
3171         (@media (prefers-color-scheme: dark) .heap-snapshot-record .icon):
3172         * UserInterface/Views/URLBreakpointTreeElement.css:
3173         (.breakpoint.url:not(.breakpoint-paused-icon) .icon):
3174         (@media (prefers-color-scheme: dark) .breakpoint.url:not(.breakpoint-paused-icon) .icon):
3175
3176 2020-02-14  Nikita Vasilyev  <nvasilyev@apple.com>
3177
3178         Web Inspector: VoiceOver doesn't read selected panel tab
3179         https://bugs.webkit.org/show_bug.cgi?id=207735
3180         <rdar://problem/59445157>
3181
3182         Reviewed by Timothy Hatcher.
3183
3184         * UserInterface/Views/NavigationBar.js:
3185         (WI.NavigationBar):
3186         (WI.NavigationBar.prototype._mouseDown):
3187         (WI.NavigationBar.prototype._mouseUp):
3188         Navigation bar itself shouldn't receive focus - its items should.
3189
3190         * UserInterface/Views/RadioButtonNavigationItem.js:
3191         (WI.RadioButtonNavigationItem):
3192         "tab" was passed as a label by mistake. VoiceOver read every tab as "tab" instead of it's actual label.
3193
3194         (WI.RadioButtonNavigationItem.prototype.set selected):
3195         When clicking on a tab, focus on it so VoiceOver could read it.
3196
3197 2020-02-14  Nikita Vasilyev  <nvasilyev@apple.com>
3198
3199         Web Inspector: Bezier editor popover should be strictly LTR
3200         https://bugs.webkit.org/show_bug.cgi?id=206968
3201         <rdar://problem/59007065>
3202
3203         Reviewed by Timothy Hatcher.
3204
3205         webkitConvertPointFromPageToNode does not work correctly with the zoom level other than 1.
3206         Replace all uses of webkitConvertPointFromPageToNode with getBoundingClientRect.
3207
3208         * UserInterface/Models/Geometry.js:
3209         (WI.Point.fromEventInElement):
3210         * UserInterface/Views/ColorSquare.js:
3211         (WI.ColorSquare.prototype._updateColorForMouseEvent):
3212         * UserInterface/Views/GradientSlider.js:
3213         (WI.GradientSlider.prototype._updateShadowKnob):
3214         * UserInterface/Views/Slider.js:
3215         (WI.Slider.prototype._localPointForEvent):
3216         (WI.Slider):
3217
3218 2020-02-12  Pavel Feldman  <pavel.feldman@gmail.com>
3219
3220         Web Inspector: encode binary web socket frames using base64
3221         https://bugs.webkit.org/show_bug.cgi?id=207448
3222         
3223         Previous representation of binary frames is lossy using fromUTF8WithLatin1Fallback,
3224         this patch consistently encodes binary data using base64.
3225
3226         Reviewed by Timothy Hatcher.
3227
3228         * UserInterface/Models/WebSocketResource.js:
3229         (WI.WebSocketResource.prototype.addFrame):
3230
3231 2020-02-11  Nikita Vasilyev  <nvasilyev@apple.com>
3232
3233         Web Inspector RTL: Elements closing tag is reversed
3234         https://bugs.webkit.org/show_bug.cgi?id=207214
3235
3236         Reviewed by Timothy Hatcher.
3237
3238         Wrap text nodes in `unicode-bidi: isolate-override`. From MDN:
3239
3240         isolate-override:
3241             This keyword applies the isolation behavior of the isolate
3242             keyword to the surrounding content and the override behavior
3243             of the bidi-override keyword to the inner content.
3244
3245         * UserInterface/Views/DOMTreeOutline.css:
3246         (.tree-outline.dom li > span > .html-text-node):
3247
3248 2020-02-09  Keith Rollin  <krollin@apple.com>
3249
3250         Re-enable LTO for ARM builds
3251         https://bugs.webkit.org/show_bug.cgi?id=207402
3252         <rdar://problem/49190767>
3253
3254         Reviewed by Sam Weinig.
3255
3256         Bug 190758 re-enabled LTO for Production builds for x86-family CPUs.
3257         Enabling it for ARM was left out due to a compiler issue. That issue
3258         has been fixed, and so now we can re-enable LTO for ARM.
3259
3260         * Configurations/Base.xcconfig:
3261
3262 2020-02-07  Jon Lee  <jonlee@apple.com>
3263
3264         Web Inspector: Revert slim toolbar
3265         https://bugs.webkit.org/show_bug.cgi?id=207422
3266
3267         Reviewed by Timothy Hatcher.
3268
3269         The slim toolbar needs a little more work before landing.
3270
3271         This patch reverts r255547, r255557, r255890, r255892, r255893, r255901, r255980.
3272
3273         * Localizations/en.lproj/localizedStrings.js:
3274         * UserInterface/Base/Main.js:
3275         * UserInterface/Base/Setting.js:
3276         * UserInterface/Controllers/ConsoleManager.js:
3277         * UserInterface/Debug/Bootstrap.js:
3278         * UserInterface/Images/NewTab.svg: Added.
3279         * UserInterface/Images/NewTabPlus.svg: Added.
3280         * UserInterface/Images/Origin.svg:
3281         * UserInterface/Images/SearchResults.svg: Added.
3282         * UserInterface/Images/SourcesPaused.svg: Removed.
3283         * UserInterface/Main.html:
3284         * UserInterface/Models/DebuggerDashboard.js: Copied from Source/WebInspectorUI/UserInterface/Views/FlexibleSpaceNavigationItem.css.
3285         * UserInterface/Models/DefaultDashboard.js: Added.
3286         * UserInterface/Views/ActivateButtonToolbarItem.js: Copied from Source/WebInspectorUI/UserInterface/Views/FlexibleSpaceNavigationItem.css.
3287         * UserInterface/Views/AuditTabContentView.js:
3288         * UserInterface/Views/ButtonNavigationItem.css:
3289         * UserInterface/Views/ButtonNavigationItem.js:
3290         * UserInterface/Views/ButtonToolbarItem.css: Copied from Source/WebInspectorUI/UserInterface/Views/DividerNavigationItem.css.
3291         * UserInterface/Views/ButtonToolbarItem.js: Copied from Source/WebInspectorUI/UserInterface/Views/FlexibleSpaceNavigationItem.css.
3292         * UserInterface/Views/ConsoleTabContentView.js:
3293         * UserInterface/Views/ContentBrowserTabContentView.js:
3294         * UserInterface/Views/ControlToolbarItem.css: Copied from Source/WebInspectorUI/UserInterface/Views/DividerNavigationItem.css.
3295         * UserInterface/Views/ControlToolbarItem.js: Copied from Source/WebInspectorUI/UserInterface/Views/DividerNavigationItem.css.
3296         * UserInterface/Views/DOMTreeContentView.css:
3297         * UserInterface/Views/DashboardContainerView.css: Added.
3298         * UserInterface/Views/DashboardContainerView.js: Added.
3299         * UserInterface/Views/DashboardView.js: Copied from Source/WebInspectorUI/UserInterface/Views/PinnedTabBarItem.js.
3300         * UserInterface/Views/DebuggerDashboardView.css: Added.
3301         * UserInterface/Views/DebuggerDashboardView.js: Added.
3302         * UserInterface/Views/DefaultDashboardView.css: Added.
3303         * UserInterface/Views/DefaultDashboardView.js: Added.
3304         * UserInterface/Views/DividerNavigationItem.css:
3305         * UserInterface/Views/ElementsTabContentView.js:
3306         * UserInterface/Views/FlexibleSpaceNavigationItem.css:
3307         * UserInterface/Views/GeneralTabBarItem.js:
3308         * UserInterface/Views/GraphicsTabContentView.js:
3309         * UserInterface/Views/GroupNavigationItem.js:
3310         * UserInterface/Views/LayersTabContentView.js:
3311         * UserInterface/Views/LegacyTabBar.js: Copied from Source/WebInspectorUI/UserInterface/Views/TabBar.js.
3312         * UserInterface/Views/Main.css:
3313         * UserInterface/Views/NavigationBar.js:
3314         * UserInterface/Views/NetworkDetailView.css:
3315         * UserInterface/Views/NetworkTabContentView.js:
3316         * UserInterface/Views/NetworkTableContentView.css:
3317         * UserInterface/Views/NetworkTableContentView.js:
3318         * UserInterface/Views/NewTabContentView.css: Copied from Source/WebInspectorUI/UserInterface/Views/RenderingFrameTimelineOverviewGraph.css.
3319         * UserInterface/Views/NewTabContentView.js: Added.
3320         * UserInterface/Views/PinnedTabBarItem.js:
3321         * UserInterface/Views/QuickConsole.js:
3322         * UserInterface/Views/RenderingFrameTimelineOverviewGraph.css:
3323         * UserInterface/Views/SearchTabContentView.js:
3324         * UserInterface/Views/SettingsTabContentView.js:
3325         * UserInterface/Views/Sidebar.js:
3326         * UserInterface/Views/SizesToFitNavigationBar.js: Copied from Source/WebInspectorUI/UserInterface/Views/FlexibleSpaceNavigationItem.css.
3327         * UserInterface/Views/SourcesTabContentView.js:
3328         * UserInterface/Views/StorageTabContentView.js:
3329         * UserInterface/Views/TabBar.css:
3330         * UserInterface/Views/TabBar.js:
3331         * UserInterface/Views/TabBarItem.js:
3332         * UserInterface/Views/TabBrowser.js:
3333         * UserInterface/Views/TabContentView.js:
3334         * UserInterface/Views/TimelineOverview.css:
3335         * UserInterface/Views/TimelineRecordFrame.css:
3336         * UserInterface/Views/TimelineRuler.css:
3337         * UserInterface/Views/TimelineTabContentView.js:
3338         * UserInterface/Views/Toolbar.css: Added.
3339         * UserInterface/Views/Toolbar.js: Added.
3340         * UserInterface/Views/Variables.css:
3341
3342 2020-02-07  Devin Rousso  <drousso@apple.com>
3343
3344         Web Inspector: Add another Protocol Version (iOS 13.4)
3345         https://bugs.webkit.org/show_bug.cgi?id=207213
3346         <rdar://problem/52846208>
3347
3348         Reviewed by Timothy Hatcher.
3349
3350         * UserInterface/Protocol/Legacy/13.4/InspectorBackendCommands.js: Added.
3351         * Versions/Inspector-iOS-13.4.json: Added.
3352
3353 2020-02-06  Fujii Hironori  <Hironori.Fujii@sony.com>
3354
3355         [Web Inspector][WinCairo] Selecting an error message in Console causes "TypeError:​ selection.focusNode.closest is not a function."
3356         https://bugs.webkit.org/show_bug.cgi?id=207248
3357
3358         Reviewed by Devin Rousso.
3359
3360         r242174 replaced Node.enclosingNodeOrSelfWithClass with
3361         Element.closest. However, selection.focusNode isn't necessarily an
3362         Element, but can be a Text node.
3363
3364         * UserInterface/Views/LogContentView.js:
3365         (WI.LogContentView.prototype._mousemove): Use selection.focusNode.parentElement.closest
3366         if selection.focusNode is not a instance of Element.
3367
3368 2020-02-06  Devin Rousso  <drousso@apple.com>
3369
3370         Web Inspector: REGRESSION(r249831): Sources: endless spinner when trying to view a resource
3371         https://bugs.webkit.org/show_bug.cgi?id=207346
3372         <rdar://problem/59209016>
3373
3374         Reviewed by Timothy Hatcher.
3375
3376         * UserInterface/Workers/Formatter/HTMLParser.js:
3377         (HTMLParser.prototype._parseAttr):
3378         Attributes are allowed to contain "/".
3379         https://html.spec.whatwg.org/multipage/parsing.html#before-attribute-value-state
3380
3381 2020-02-06  Devin Rousso  <drousso@apple.com>
3382
3383         Web Inspector: REGRESSION(?): Search: selecting a DOM node search result switches to the Elements Tab
3384         https://bugs.webkit.org/show_bug.cgi?id=207322
3385
3386         Reviewed by Timothy Hatcher.
3387
3388         * UserInterface/Views/TabBrowser.js:
3389         (WI.TabBrowser.prototype._tabBarItemSelected):
3390         The Search Tab is marked such that it isn't saved to `WI._openTabsSetting`, as otherwise
3391         more than one Search Tab could be added to the tab bar (one from the setting and one from
3392         the default pinned tab). It is also marked as being pinned, however, meaning that we know it
3393         will always be in the tab bar, even if we also know it won't be in `WI._openTabsSetting`. As
3394         such, we should update it's position in the `_recentTabContentViews` list so that we can use
3395         it when showing represented objects (if able) via `bestTabContentViewForRepresentedObject`.
3396
3397 2020-02-05  Devin Rousso  <drousso@apple.com>
3398
3399         Web Inspector: the height of the undocked title area shouldn't change when zoomed
3400         https://bugs.webkit.org/show_bug.cgi?id=207228
3401
3402         Reviewed by Timothy Hatcher.
3403
3404         * UserInterface/Base/Main.js:
3405         (WI.contentLoaded):
3406         (WI.contentLoaded.updateZoomFactorCSSVariable): Added.
3407         Save the zoom factor as a number in a CSS variable on the `<body>`.
3408
3409         * UserInterface/Views/Variables.css:
3410         (body.mac-platform:not(.docked)): Added.
3411         (body:not(.docked)): Deleted.
3412         Divide the default `22px` by the current zoom factor so that it cancels out when rendered.
3413         Make it so that the undocked title area is only shown on macOS <https://webkit.org/b/204627#c47>
3414
3415 2020-02-05  Nikita Vasilyev  <nvasilyev@apple.com>
3416
3417         Web Inspector: Some cookie table column headers should not be localizable
3418         https://bugs.webkit.org/show_bug.cgi?id=206920
3419
3420         Reviewed by Timothy Hatcher.
3421
3422         Keep headers that match cookie directives always in English.
3423
3424         * Localizations/en.lproj/localizedStrings.js:
3425         * UserInterface/Views/CookieStorageContentView.js:
3426         (WI.CookieStorageContentView.prototype.initialLayout):
3427
3428 2020-02-05  Devin Rousso  <drousso@apple.com>
3429
3430         Web Inspector: slightly increase the horizontal padding around scope bar items
3431         https://bugs.webkit.org/show_bug.cgi?id=207321
3432
3433         Reviewed by Timothy Hatcher.
3434
3435         * UserInterface/Views/ScopeBar.css:
3436         (.scope-bar):
3437         (body[dir=ltr] .scope-bar > li.multiple > select):
3438         (body[dir=rtl] .scope-bar > li.multiple > select):
3439         * UserInterface/Views/RadioButtonNavigationItem.css:
3440         (.navigation-bar .item.radio.button.text-only):
3441
3442 2020-02-05  Devin Rousso  <drousso@apple.com>
3443
3444         Web Inspector: Tab Bar: move window management items to the left and don't show reload/download unless remotely inspecting
3445         https://bugs.webkit.org/show_bug.cgi?id=207318
3446
3447         Reviewed by Timothy Hatcher.
3448
3449         Move the window management buttons to the left side to match the system look/feel.
3450
3451         Hide the reload/download buttons when inspecting locally, as there are other ways of
3452         reloading the inspected page or downloading a Web Archive.
3453
3454         * UserInterface/Base/Main.js:
3455         (WI.contentLoaded):
3456         (WI._updateDockNavigationItems):
3457         (WI._updateReloadTabBarButton):
3458         (WI._updateDownloadTabBarButton):
3459         (WI._updateInspectModeTabBarButton):
3460         (WI._updateTabBarDividers): Added.
3461         (WI._updateConsoleTabBarButtons):
3462
3463         * UserInterface/Debug/Bootstrap.js:
3464         (updateDebugUI):
3465         (WI.runBootstrapOperations):
3466
3467 2020-02-05  Devin Rousso  <drousso@apple.com>
3468
3469         Web Inspector: Network: the resource detail view cuts off the bottom statistics bar
3470         https://bugs.webkit.org/show_bug.cgi?id=207320
3471
3472         Reviewed by Timothy Hatcher.
3473
3474         * UserInterface/Views/Variables.css:
3475         (:root):
3476         Add a `--network-statistics-height` variable.
3477
3478         * UserInterface/Views/NetworkDetailView.css:
3479         (.network-detail):
3480         * UserInterface/Views/NetworkTableContentView.css:
3481         (.network-table > .statistics):
3482         Use the `--network-statistics-height` variable to make sure the statistics row and the
3483         details view for the selected network entry don't overlap.
3484         Drive-by: center the content of the statistics row to better match the system look/feel.
3485
3486 2020-02-05  Devin Rousso  <drousso@apple.com>
3487
3488         Web Inspector: increase the height of the tab bar to match other navigation bars
3489         https://bugs.webkit.org/show_bug.cgi?id=207317
3490
3491         Reviewed by Timothy Hatcher.
3492
3493         * UserInterface/Views/Variables.css:
3494         (:root):
3495         Define `--tab-bar-height` in terms of `--navigation-bar-height` so they share the same value.
3496
3497         * UserInterface/Views/TabBar.css:
3498         (.tab-bar > .tabs > .item):
3499         (.tab-bar > .tabs > .item.pinned):
3500         (.tab-bar > .tabs > .item.pinned.tab-picker): Deleted.
3501         Increase the width to match the `--tab-bar-height` so that pinned tab bar items are square.
3502
3503 2020-02-05  Nikita Vasilyev  <nvasilyev@apple.com>
3504
3505         Web Inspector: Dragging handles in the easing popover selects sidebar text
3506         https://bugs.webkit.org/show_bug.cgi?id=207316
3507
3508         Reviewed by Timothy Hatcher.
3509
3510         * UserInterface/Views/BezierEditor.js:
3511         (WI.BezierEditor.prototype._handleMousedown):
3512
3513 2020-02-05  Devin Rousso  <drousso@apple.com>
3514
3515         Web Inspector: Sources: add a special breakpoint for controlling whether `debugger` statements pause
3516         https://bugs.webkit.org/show_bug.cgi?id=206818
3517
3518         Reviewed by Timothy Hatcher.
3519
3520         * UserInterface/Controllers/DebuggerManager.js:
3521         (WI.DebuggerManager):
3522         (WI.DebuggerManager.prototype.async initializeTarget):
3523         (WI.DebuggerManager.prototype.get debuggerStatementsBreakpoint): Added.
3524         (WI.DebuggerManager.prototype.isBreakpointRemovable):
3525         (WI.DebuggerManager.prototype._breakpointDisabledStateDidChange):
3526
3527         * UserInterface/Views/SourcesNavigationSidebarPanel.js:
3528         (WI.SourcesNavigationSidebarPanel):
3529         (WI.SourcesNavigationSidebarPanel.prototype._insertDebuggerTreeElement):
3530         (WI.SourcesNavigationSidebarPanel.prototype._addBreakpoint):
3531
3532         * UserInterface/Views/BreakpointTreeElement.css:
3533         (.breakpoint-debugger-statement-icon .icon): Added.
3534         * UserInterface/Images/DebuggerStatement.svg: Added.
3535
3536         * Localizations/en.lproj/localizedStrings.js:
3537
3538 2020-02-05  Nikita Vasilyev  <nvasilyev@apple.com>
3539
3540         Web Inspector: Bezier editor popover should be strictly LTR
3541         https://bugs.webkit.org/show_bug.cgi?id=206968
3542         <rdar://problem/59007065>
3543
3544         Reviewed by Timothy Hatcher.
3545
3546         - Don't mirror the coordinate system.
3547         - Don't reverste the order of the cubic bezier values, e.g. `cubic-bezier(0, 0.5, 1, 0.5)`.
3548
3549         * UserInterface/Views/BezierEditor.css:
3550         (90%):
3551         (to):
3552         (body[dir=ltr] .bezier-editor): Deleted.
3553         (body[dir=rtl] .bezier-editor): Deleted.
3554         (body[dir=rtl] .bezier-editor > .bezier-container): Deleted.
3555         * UserInterface/Views/BezierEditor.js:
3556
3557 2020-02-03  Carlos Garcia Campos  <cgarcia@igalia.com>
3558
3559         Unreviewed. Fix the inspector files combination after r255547
3560
3561         * UserInterface/Main.html: Remove Views/SizesToFitNavigationBar.js that was removed in r255547
3562
3563 2020-02-01  Devin Rousso  <drousso@apple.com>
3564
3565         Web Inspector: move the items in the toolbar into the tab bar to save vertical space
3566         https://bugs.webkit.org/show_bug.cgi?id=204627
3567
3568         Reviewed by Timothy Hatcher.
3569
3570         Merge the toolbar are and tab bar to waste less vertical space.
3571
3572         The inspect, download, reload, and device settings buttons are pinned before the tabs.
3573
3574         If there are any console warnings/errors, an icon for each type of message is shown between
3575         the left buttons and the tabs, and each button's opacity is animated whenever a new message
3576         is added.
3577
3578         Whenever the debugger pauses, change the tab bar icon of the Sources Tab to an image that
3579         includes paused iconography (||) to help convey the debugger's state no matter which tab is
3580         currently selected, just like the debugger dashboard.
3581
3582         The docking configuration, debug, and close buttons are pinned after the tabs.
3583
3584         The dashboard network information has been moved to the Network Tab (described below).
3585
3586         When undocked, the tab bar and all the content below it are pushed down by 22px to make room
3587         for the system close/minimize/maximize buttons and the window title.
3588
3589         * UserInterface/Base/Main.js:
3590         (WI.loaded):
3591         (WI._handleSettingsKeyboardShortcut):
3592         (WI._tryToRestorePendingTabs):
3593         (WI.isNewTabWithTypeAllowed):
3594         (WI._openDefaultTab): Deleted.
3595         (WI.showNewTabTab): Deleted.
3596         * UserInterface/Views/Main.css:
3597         (#undocked-title-area): Added.
3598         (body.docked #undocked-title-area): Added.
3599         (body.window-inactive #undocked-title-area): Added.
3600         (#main):
3601         (@keyframes tab-bar-console-item-pulse): Added.
3602         (.tab-bar > .navigation-bar :matches(.console-warnings, .console-errors):not(.disabled).pulsing): Added.
3603         (@media (prefers-color-scheme: dark) #undocked-title-area): Added.
3604         (@media (prefers-color-scheme: dark) body.window-inactive #undocked-title-area): Added.
3605         (body.docked.bottom): Deleted.
3606         (body.docked.bottom #toolbar): Deleted.
3607         (body.docked.bottom #toolbar .item:not(.flexible-space)): Deleted.
3608
3609         * UserInterface/Views/TabBar.js:
3610         (WI.TabBar):
3611         (WI.TabBar.prototype.addNavigationItemBefore): Added.
3612         (WI.TabBar.prototype.addNavigationItemAfter): Added.
3613         (WI.TabBar.prototype.insertTabBarItem):
3614         (WI.TabBar.prototype.insertTabBarItem.animateTabs):
3615         (WI.TabBar.prototype.insertTabBarItem.removeStyles):
3616         (WI.TabBar.prototype.removeTabBarItem):
3617         (WI.TabBar.prototype.removeTabBarItem.animateTabs):
3618         (WI.TabBar.prototype.removeTabBarItem.removeStyles):
3619         (WI.TabBar.prototype.set selectedTabBarItem):
3620         (WI.TabBar.prototype.get tabCount): Added.
3621         (WI.TabBar.prototype.layout):
3622         (WI.TabBar.prototype.didLayoutSubtree): Added.
3623         (WI.TabBar.prototype._recordTabBarItemSizesAndPositions):
3624         (WI.TabBar.prototype._finishExpandingTabsAfterClose):
3625         (WI.TabBar.prototype._finishExpandingTabsAfterClose.animateTabs):
3626         (WI.TabBar.prototype._finishExpandingTabsAfterClose.removeStyles):
3627         (WI.TabBar.prototype._handleClick):
3628         (WI.TabBar.prototype._handleMouseMoved):
3629         (WI.TabBar.prototype._handleMouseUp):
3630         (WI.TabBar.prototype._handleMouseLeave):
3631         (WI.TabBar.prototype._handleContextMenu):
3632         (WI.TabBar.prototype.get saveableTabCount): Deleted.
3633         (WI.TabBar.layout.forceItemHidden): Deleted.
3634         * UserInterface/Views/TabBar.css:
3635         (.tab-bar):
3636         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar): Added.
3637         (.tab-bar > .border): Added.
3638         (.tab-bar > .border.top): Added.
3639         (.tab-bar > .border.bottom): Added.
3640         (body.docked.bottom .tab-bar > .border.top): Added.
3641         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .border): Added.
3642         (@media (-webkit-max-device-pixel-ratio: 1) body.docked:matches(.right, .left):not(.window-docked-inactive) .tab-bar > .border.top): Added.
3643         (@media (-webkit-min-device-pixel-ratio: 2) body.docked:matches(.right, .left):not(.window-docked-inactive) .tab-bar > .border.top): Added.
3644         (.tab-bar > .tabs > .item):
3645         (.tab-bar > .tabs > .item:not(.disabled).selected):
3646         (.tab-bar > .tabs:not(.animating) > .item:not(.selected, .disabled):hover):
3647         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item):
3648         (.tab-bar > .navigation-bar): Added.
3649         (.tab-bar > .navigation-bar > .item.group > .item): Added.
3650         (.tab-bar > .navigation-bar > .item.group > .item:nth-child(1 of :not(.hidden))): Added.
3651         (.tab-bar > .navigation-bar > .item.group > .item:nth-last-child(1 of :not(.hidden))): Added.
3652         (.tab-bar > .navigation-bar .item.divider): Added.
3653         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .navigation-bar > .item.divider): Added.
3654         (.tab-bar > .tabs): Added.
3655         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs > .item): Added.
3656         (.tab-bar > .tabs.dragging-tab > .item.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.selected): Added.
3657         (body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.dragging-tab > .item.selected, body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.static-layout:not(.animating.inserting-tab):not(.dragging-tab) > .item:nth-last-child(1 of :not(.pinned)), body:matches(.window-inactive, .window-docked-inactive) .tab-bar > .tabs.animating.closing-tab > .item.selected): Added.
3658         (@media (prefers-color-scheme: dark) body.docked.bottom .tab-bar > .border.top): Added.
3659         (@media (prefers-color-scheme: dark) .tab-bar > .tabs > .item:not(.disabled).selected):
3660         (body:not(.window-inactive) .tab-bar.single-tab > .item.default-tab:hover > .close): Deleted.
3661         (.tab-bar.single-tab > .item.default-tab > .close): Deleted.
3662         (body[dir=ltr].window-inactive .tab-bar > .item): Deleted.
3663         (body[dir=rtl].window-inactive .tab-bar > .item): Deleted.
3664         NOTE: elided renaming CSS changes.
3665
3666         * UserInterface/Views/NetworkTableContentView.js:
3667         (WI.NetworkTableContentView):
3668         (WI.NetworkTableContentView.prototype.reset):
3669         (WI.NetworkTableContentView.prototype.tablePopulateCell):
3670         (WI.NetworkTableContentView.prototype._changeCollection):
3671         (WI.NetworkTableContentView.prototype.initialLayout):
3672         (WI.NetworkTableContentView.prototype.processHAR):
3673         (WI.NetworkTableContentView.prototype._processPendingEntries):
3674         (WI.NetworkTableContentView.prototype._updateEntryForResource):
3675         (WI.NetworkTableContentView.prototype._mainResourceDidChange):
3676         (WI.NetworkTableContentView.prototype._handleResourceSizeDidChange): Added.
3677         (WI.NetworkTableContentView.prototype._resourceTransferSizeDidChange):
3678         (WI.NetworkTableContentView.prototype._handleResourceAdded):
3679         (WI.NetworkTableContentView.prototype._handleFrameWasAdded):
3680         (WI.NetworkTableContentView.prototype._entryForResource):
3681         (WI.NetworkTableContentView.prototype._updateStatistics): Added.
3682         (WI.NetworkTableContentView.prototype._updateStatistic): Added.
3683         (WI.NetworkTableContentView.prototype._startUpdatingLoadTimeStatistic): Added.
3684         (WI.NetworkTableContentView.prototype._stopUpdatingLoadTimeStatistic): Added.
3685         (WI.NetworkTableContentView.prototype._updateLoadTimeStatistic): Added.
3686         * UserInterface/Views/NetworkTableContentView.css:
3687         (.network-table > .statistics): Added.
3688         (.network-table > .statistics > .statistic): Added.
3689         (.network-table > .statistics > .statistic[hidden]): Added.
3690         (.network-table > .statistics > .statistic > .icon): Added.
3691         (.network-table > .statistics > .statistic > .text): Added.
3692         (@media (prefers-color-scheme: dark) .network-table > .statistics > .statistic.domain-count > .icon): Added.
3693         Add a fixed row below the network table that contains statistics information based on the
3694         current shown collection (e.g. live data vs HAR):
3695          - number of domains
3696          - number of resources
3697          - total resource size
3698          - total transfer size
3699          - number of redirects
3700          - time to load
3701         Slightly dim entries for previous sessions if Preserve Log is checked, since the statistics
3702         data is calculated from the current session.
3703         NOTE: elided renaming CSS changes.
3704
3705         * UserInterface/Views/TabBrowser.js:
3706         (WI.TabBrowser.prototype.addTabForContentView):
3707         (WI.TabBrowser.prototype.closeTabForContentView):
3708         (WI.TabBrowser.prototype._tabBarItemSelected):
3709         (WI.TabBrowser.prototype._tabBarItemRemoved):
3710
3711         * UserInterface/Views/TabContentView.js:
3712         (WI.TabContentView.shouldPinTab): Added.
3713         * UserInterface/Views/AuditTabContentView.js:
3714         (WI.AuditTabContentView):
3715         (WI.AuditTabContentView.tabInfo):
3716         * UserInterface/Views/CanvasTabContentView.js:
3717         (WI.CanvasTabContentView):
3718         (WI.CanvasTabContentView.tabInfo):
3719         * UserInterface/Views/ConsoleTabContentView.js:
3720         (WI.ConsoleTabContentView):
3721         (WI.ConsoleTabContentView.tabInfo):
3722         * UserInterface/Views/ContentBrowserTabContentView.js:
3723         (WI.ContentBrowserTabContentView):
3724         * UserInterface/Views/ElementsTabContentView.js:
3725         (WI.ElementsTabContentView):
3726         (WI.ElementsTabContentView.tabInfo):
3727         * UserInterface/Views/LayersTabContentView.js:
3728         (WI.LayersTabContentView):
3729         (WI.LayersTabContentView.tabInfo):
3730         * UserInterface/Views/NetworkTabContentView.js:
3731         (WI.NetworkTabContentView):
3732         (WI.NetworkTabContentView.tabInfo):
3733         * UserInterface/Views/SearchTabContentView.js:
3734         (WI.SearchTabContentView):
3735         (WI.SearchTabContentView.tabInfo):
3736         (WI.SearchTabContentView.shouldPinTab): Added.
3737         (WI.SearchTabContentView.shouldSaveTab): Added.
3738         * UserInterface/Views/SettingsTabContentView.js:
3739         (WI.SettingsTabContentView):
3740         (WI.SettingsTabContentView.tabInfo):
3741         (WI.SettingsTabContentView.shouldPinTab): Added.
3742         (WI.SettingsTabContentView.prototype._createExperimentalSettingsView):
3743         * UserInterface/Views/SourcesTabContentView.js:
3744         (WI.SourcesTabContentView):
3745         (WI.SourcesTabContentView.tabInfo):
3746         (WI.SourcesTabContentView.prototype._handleDebuggerPaused): Added.
3747         (WI.SourcesTabContentView.prototype._handleDebuggerResumed): Added.
3748         * UserInterface/Views/StorageTabContentView.js:
3749         (WI.StorageTabContentView):
3750         (WI.StorageTabContentView.tabInfo):
3751         * UserInterface/Views/TimelineTabContentView.js:
3752         (WI.TimelineTabContentView):
3753         (WI.TimelineTabContentView.tabInfo):
3754         * UserInterface/Views/TabBarItem.js:
3755         (WI.TabBarItem):
3756         (WI.TabBarItem.prototype.get element):
3757         (WI.TabBarItem.prototype.get representedObject):
3758         (WI.TabBarItem.prototype.set disabled):
3759         (WI.TabBarItem.prototype.get hidden): Added.
3760         (WI.TabBarItem.prototype.set hidden): Added.
3761         (WI.TabBarItem.prototype.set representedObject): Deleted.
3762         (WI.TabBarItem.prototype.get isDefaultTab): Deleted.
3763         (WI.TabBarItem.prototype.set isDefaultTab): Deleted.
3764         * UserInterface/Views/GeneralTabBarItem.js:
3765         (WI.GeneralTabBarItem.fromTabContentView): Added.
3766         (WI.GeneralTabBarItem.fromTabInfo): Deleted.
3767         * UserInterface/Views/PinnedTabBarItem.js:
3768         (WI.PinnedTabBarItem):
3769         (WI.PinnedTabBarItem.fromTabContentView): Added.
3770         (WI.PinnedTabBarItem.titleDidChange):
3771         (WI.PinnedTabBarItem.fromTabInfo): Deleted.
3772         (WI.PinnedTabBarItem.prototype.titleDidChange): Deleted.
3773         (WI.PinnedTabBarItem.prototype._handleContextMenuEvent): Deleted.
3774         Simplify how tab bar items are created.
3775
3776         * UserInterface/Views/NavigationBar.js:
3777         (WI.NavigationBar.prototype.get sizesToFit):
3778         (WI.NavigationBar.prototype.addNavigationItem):
3779         (WI.NavigationBar.prototype.insertNavigationItem):
3780         * UserInterface/Views/SizesToFitNavigationBar.js: Removed.
3781         * UserInterface/Views/Sidebar.js: