Web Inspector: Support search on IndexedDB stores and indexes
https://bugs.webkit.org/show_bug.cgi?id=129208
<rdar://problem/16142046>
Reviewed by Timothy Hatcher.
Add filter bars to the navigation bars for `IndexedDB`, `LocalStorage`, and `SessionStorage`.
* UserInterface/Views/StorageTabContentView.js:
(WI.StorageTabContentView.prototype.get canHandleFindEvent): Added.
(WI.StorageTabContentView.prototype.handleFindEvent): Added.
* UserInterface/Views/DOMStorageContentView.js:
(WI.DOMStorageContentView):
(WI.DOMStorageContentView.prototype.get navigationItems): Added.
(WI.DOMStorageContentView.prototype.get canFocusFilterBar): Added.
(WI.DOMStorageContentView.prototype.focusFilterBar): Added.
(WI.DOMStorageContentView.prototype._handleFilterBarFilterDidChange): Added.
* UserInterface/Views/IndexedDatabaseObjectStoreContentView.js:
(WI.IndexedDatabaseObjectStoreContentView):
(WI.IndexedDatabaseObjectStoreContentView.prototype.get navigationItems):
(WI.IndexedDatabaseObjectStoreContentView.prototype.get canFocusFilterBar): Added.
(WI.IndexedDatabaseObjectStoreContentView.prototype.focusFilterBar): Added.
(WI.IndexedDatabaseObjectStoreContentView.prototype.dataGridMatchNodeAgainstCustomFilters): Added.
(WI.IndexedDatabaseObjectStoreContentView.prototype._handleFilterBarFilterDidChange): Added.
Check against the `textContent` of each cell for a given `WI.DataGridNode` to see if it
matches the filter text as all of the pieces of data are `WI.RemoteObject`s.
* UserInterface/Views/FilterBar.css:
(.filter-bar):
* UserInterface/Views/NetworkTableContentView.css:
(.content-view.network .navigation-bar .filter-bar): Deleted.
Remove the `background-color` to let it match the background content.
git-svn-id: http://svn.webkit.org/repository/webkit/trunk@253161 268f45cc-cd09-0410-ab3c-d52691b4dbfc
diff --git a/Source/WebInspectorUI/ChangeLog b/Source/WebInspectorUI/ChangeLog
index 277992a..7514fd7 100644
--- a/Source/WebInspectorUI/ChangeLog
+++ b/Source/WebInspectorUI/ChangeLog
@@ -1,5 +1,42 @@
2019-12-05 Devin Rousso <drousso@apple.com>
+ Web Inspector: Support search on IndexedDB stores and indexes
+ https://bugs.webkit.org/show_bug.cgi?id=129208
+ <rdar://problem/16142046>
+
+ Reviewed by Timothy Hatcher.
+
+ Add filter bars to the navigation bars for `IndexedDB`, `LocalStorage`, and `SessionStorage`.
+
+ * UserInterface/Views/StorageTabContentView.js:
+ (WI.StorageTabContentView.prototype.get canHandleFindEvent): Added.
+ (WI.StorageTabContentView.prototype.handleFindEvent): Added.
+
+ * UserInterface/Views/DOMStorageContentView.js:
+ (WI.DOMStorageContentView):
+ (WI.DOMStorageContentView.prototype.get navigationItems): Added.
+ (WI.DOMStorageContentView.prototype.get canFocusFilterBar): Added.
+ (WI.DOMStorageContentView.prototype.focusFilterBar): Added.
+ (WI.DOMStorageContentView.prototype._handleFilterBarFilterDidChange): Added.
+
+ * UserInterface/Views/IndexedDatabaseObjectStoreContentView.js:
+ (WI.IndexedDatabaseObjectStoreContentView):
+ (WI.IndexedDatabaseObjectStoreContentView.prototype.get navigationItems):
+ (WI.IndexedDatabaseObjectStoreContentView.prototype.get canFocusFilterBar): Added.
+ (WI.IndexedDatabaseObjectStoreContentView.prototype.focusFilterBar): Added.
+ (WI.IndexedDatabaseObjectStoreContentView.prototype.dataGridMatchNodeAgainstCustomFilters): Added.
+ (WI.IndexedDatabaseObjectStoreContentView.prototype._handleFilterBarFilterDidChange): Added.
+ Check against the `textContent` of each cell for a given `WI.DataGridNode` to see if it
+ matches the filter text as all of the pieces of data are `WI.RemoteObject`s.
+
+ * UserInterface/Views/FilterBar.css:
+ (.filter-bar):
+ * UserInterface/Views/NetworkTableContentView.css:
+ (.content-view.network .navigation-bar .filter-bar): Deleted.
+ Remove the `background-color` to let it match the background content.
+
+2019-12-05 Devin Rousso <drousso@apple.com>
+
Web Inspector: Network: pressing ⌘F when no network item is selected should focus the filter bar
https://bugs.webkit.org/show_bug.cgi?id=204862
diff --git a/Source/WebInspectorUI/UserInterface/Views/DOMStorageContentView.js b/Source/WebInspectorUI/UserInterface/Views/DOMStorageContentView.js
index a9551da..e0fd85e 100644
--- a/Source/WebInspectorUI/UserInterface/Views/DOMStorageContentView.js
+++ b/Source/WebInspectorUI/UserInterface/Views/DOMStorageContentView.js
@@ -50,14 +50,21 @@
this._dataGrid.sortColumnIdentifier = "key";
this._dataGrid.createSettings("dom-storage-content-view");
this._dataGrid.addEventListener(WI.DataGrid.Event.SortChanged, this._sortDataGrid, this);
-
this.addSubview(this._dataGrid);
+ this._filterBarNavigationItem = new WI.FilterBarNavigationItem;
+ this._filterBarNavigationItem.filterBar.addEventListener(WI.FilterBar.Event.FilterDidChange, this._handleFilterBarFilterDidChange, this);
+
this._populate();
}
// Public
+ get navigationItems()
+ {
+ return [this._filterBarNavigationItem];
+ }
+
saveToCookie(cookie)
{
cookie.type = WI.ContentViewCookieType.DOMStorage;
@@ -70,6 +77,16 @@
return [this._dataGrid.scrollContainer];
}
+ get canFocusFilterBar()
+ {
+ return true;
+ }
+
+ focusFilterBar()
+ {
+ this._filterBarNavigationItem.filterBar.focus();
+ }
+
itemsCleared(event)
{
this._dataGrid.removeChildren();
@@ -268,6 +285,11 @@
return node.data.originalValue;
return text;
}
+
+ _handleFilterBarFilterDidChange(event)
+ {
+ this._dataGrid.filterText = this._filterBarNavigationItem.filterBar.filters.text || "";
+ }
};
WI.DOMStorageContentView.DuplicateKeyStyleClassName = "duplicate-key";
diff --git a/Source/WebInspectorUI/UserInterface/Views/FilterBar.css b/Source/WebInspectorUI/UserInterface/Views/FilterBar.css
index 7df5875..fe54a40 100644
--- a/Source/WebInspectorUI/UserInterface/Views/FilterBar.css
+++ b/Source/WebInspectorUI/UserInterface/Views/FilterBar.css
@@ -25,13 +25,9 @@
.filter-bar {
display: flex;
-
height: var(--navigation-bar-height);
-
white-space: nowrap;
overflow: hidden;
-
- background-color: var(--panel-background-color);
}
.filter-bar > .navigation-bar {
diff --git a/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreContentView.js b/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreContentView.js
index 66202ad..a7e60a7 100644
--- a/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreContentView.js
+++ b/Source/WebInspectorUI/UserInterface/Views/IndexedDatabaseObjectStoreContentView.js
@@ -69,6 +69,7 @@
this._dataGrid = new WI.DataGrid(columnInfo);
this._dataGrid.variableHeightRows = true;
+ this._dataGrid.filterDelegate = this;
this._dataGrid.scrollContainer.addEventListener("scroll", this._dataGridScrolled.bind(this));
this.addSubview(this._dataGrid);
@@ -77,6 +78,9 @@
this._fetchingMoreData = false;
this._fetchMoreData();
+ this._filterBarNavigationItem = new WI.FilterBarNavigationItem;
+ this._filterBarNavigationItem.filterBar.addEventListener(WI.FilterBar.Event.FilterDidChange, this._handleFilterBarFilterDidChange, this);
+
this._refreshButtonNavigationItem = new WI.ButtonNavigationItem("indexed-database-object-store-refresh", WI.UIString("Refresh"), "Images/ReloadFull.svg", 13, 13);
this._refreshButtonNavigationItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._refreshButtonClicked, this);
@@ -89,7 +93,12 @@
get navigationItems()
{
- return [this._refreshButtonNavigationItem, this._clearButtonNavigationItem];
+ return [
+ this._filterBarNavigationItem,
+ new WI.DividerNavigationItem,
+ this._refreshButtonNavigationItem,
+ this._clearButtonNavigationItem,
+ ];
}
closed()
@@ -113,6 +122,35 @@
return [this._dataGrid.scrollContainer];
}
+ get canFocusFilterBar()
+ {
+ return true;
+ }
+
+ focusFilterBar()
+ {
+ this._filterBarNavigationItem.filterBar.focus();
+ }
+
+ // Protected
+
+ dataGridMatchNodeAgainstCustomFilters(node)
+ {
+ let filterText = this._filterBarNavigationItem.filterBar.filters.text;
+ if (!filterText)
+ return true;
+
+ let regex = WI.SearchUtilities.regExpForString(filterText, WI.SearchUtilities.defaultSettings);
+
+ // Iterate over each cell.
+ for (let child of node.element.children) {
+ if (regex.test(child.textContent))
+ return true;
+ }
+
+ return false;
+ }
+
// Private
_reset()
@@ -161,6 +199,11 @@
WI.indexedDBManager.requestIndexedDatabaseData(this._objectStore, this._objectStoreIndex, this._entries.length, 25, processEntries.bind(this));
}
+ _handleFilterBarFilterDidChange(event)
+ {
+ this._dataGrid.filterDidChange();
+ }
+
_refreshButtonClicked()
{
this._reset();
diff --git a/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css b/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css
index 880848e..b4fdb12 100644
--- a/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css
+++ b/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css
@@ -23,10 +23,6 @@
* THE POSSIBILITY OF SUCH DAMAGE.
*/
-.content-view.network .navigation-bar .filter-bar {
- background: none;
-}
-
.content-view.tab.network > .content-browser > .navigation-bar .hierarchical-path .icon {
-webkit-margin-start: 8px;
-webkit-margin-end: 4px;
diff --git a/Source/WebInspectorUI/UserInterface/Views/StorageTabContentView.js b/Source/WebInspectorUI/UserInterface/Views/StorageTabContentView.js
index fd91ef3..3d1f155 100644
--- a/Source/WebInspectorUI/UserInterface/Views/StorageTabContentView.js
+++ b/Source/WebInspectorUI/UserInterface/Views/StorageTabContentView.js
@@ -78,6 +78,16 @@
|| representedObject instanceof WI.IndexedDatabaseObjectStoreIndex;
}
+ get canHandleFindEvent()
+ {
+ return this.contentBrowser.currentContentView.canFocusFilterBar;
+ }
+
+ handleFindEvent(event)
+ {
+ this.contentBrowser.currentContentView.focusFilterBar();
+ }
+
closed()
{
WI.applicationCacheManager.disable();
