Changeset 260523 in webkit


Ignore:
Timestamp:
Apr 22, 2020 11:33:32 AM (4 years ago)
Author:
Devin Rousso
Message:

Web Inspector: Storage: unable to filter cookies
​https://bugs.webkit.org/show_bug.cgi?id=210837

Reviewed by Brian Burg.

  • UserInterface/Views/CookieStorageContentView.js:

(WI.CookieStorageContentView):
(WI.CookieStorageContentView.prototype.get navigationItems):
(WI.CookieStorageContentView.prototype.get canFocusFilterBar): Added.
(WI.CookieStorageContentView.prototype.focusFilterBar): Added.
(WI.CookieStorageContentView.prototype.tableIndexForRepresentedObject):
(WI.CookieStorageContentView.prototype.tableRepresentedObjectForIndex):
(WI.CookieStorageContentView.prototype.tableNumberOfRows):
(WI.CookieStorageContentView.prototype.tableSortChanged):
(WI.CookieStorageContentView.prototype.tableCellContextMenuClicked):
(WI.CookieStorageContentView.prototype.tableDidRemoveRows):
(WI.CookieStorageContentView.prototype.tablePopulateCell):
(WI.CookieStorageContentView.prototype._getCookiesForHost): Renamed from _filterCookies.
(WI.CookieStorageContentView.prototype.async _willDismissCookiePopover):
(WI.CookieStorageContentView.prototype._handleFilterBarFilterDidChange): Added.
(WI.CookieStorageContentView.prototype._handleClearNavigationItemClicked):
(WI.CookieStorageContentView.prototype._reloadCookies):
(WI.CookieStorageContentView.prototype._updateFilteredCookies): Added.
(WI.CookieStorageContentView.prototype._updateEmptyFilterResultsMessage): Added.
(WI.CookieStorageContentView.prototype._cookiesAtIndexes):
(WI.CookieStorageContentView.prototype._filterCookies): Deleted.

  • UserInterface/Views/CookieStorageContentView.css:

(.content-view.cookie-storage > .message-text-view): Added.
(.content-view.cookie-storage > .message-text-view > .message): Added.
(.content-view.cookie-storage > .data-grid): Deleted.
Add a filter bar to the navigation bar that checks the regex-ified filter text against the
formatted text of each cell for each cookie. Also hook it up to the global find shortcut.

  • UserInterface/Views/NetworkTableContentView.js:

(WI.NetworkTableContentView.prototype.layout):
(WI.NetworkTableContentView.prototype._showEmptyFilterResultsMessage):
(WI.NetworkTableContentView.prototype._tableNameColumnDidChangeWidth):
(WI.NetworkTableContentView.prototype._positionEmptyFilterMessage): Deleted.

  • UserInterface/Views/NetworkTableContentView.css:

(.content-view.network .message-text-view): Added.
Drive-by: instead of having the "No Filter Results" view only cover the "Name" column, it

should cover the entire table so as to be as noticable as possible (not to mention
the table will be empty anyways, so it's not like anything is being hidden).

Drive-by: ensure that the "No Filter Results" view doesn't cover the statistics.

Location:
trunk/Source/WebInspectorUI
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/Source/WebInspectorUI/ChangeLog

    r260502 r260523  
     12020-04-22  Devin Rousso  <drousso@apple.com>
     2
     3        Web Inspector: Storage: unable to filter cookies
     4        https://bugs.webkit.org/show_bug.cgi?id=210837
     5
     6        Reviewed by Brian Burg.
     7
     8        * UserInterface/Views/CookieStorageContentView.js:
     9        (WI.CookieStorageContentView):
     10        (WI.CookieStorageContentView.prototype.get navigationItems):
     11        (WI.CookieStorageContentView.prototype.get canFocusFilterBar): Added.
     12        (WI.CookieStorageContentView.prototype.focusFilterBar): Added.
     13        (WI.CookieStorageContentView.prototype.tableIndexForRepresentedObject):
     14        (WI.CookieStorageContentView.prototype.tableRepresentedObjectForIndex):
     15        (WI.CookieStorageContentView.prototype.tableNumberOfRows):
     16        (WI.CookieStorageContentView.prototype.tableSortChanged):
     17        (WI.CookieStorageContentView.prototype.tableCellContextMenuClicked):
     18        (WI.CookieStorageContentView.prototype.tableDidRemoveRows):
     19        (WI.CookieStorageContentView.prototype.tablePopulateCell):
     20        (WI.CookieStorageContentView.prototype._getCookiesForHost): Renamed from `_filterCookies`.
     21        (WI.CookieStorageContentView.prototype.async _willDismissCookiePopover):
     22        (WI.CookieStorageContentView.prototype._handleFilterBarFilterDidChange): Added.
     23        (WI.CookieStorageContentView.prototype._handleClearNavigationItemClicked):
     24        (WI.CookieStorageContentView.prototype._reloadCookies):
     25        (WI.CookieStorageContentView.prototype._updateFilteredCookies): Added.
     26        (WI.CookieStorageContentView.prototype._updateEmptyFilterResultsMessage): Added.
     27        (WI.CookieStorageContentView.prototype._cookiesAtIndexes):
     28        (WI.CookieStorageContentView.prototype._filterCookies): Deleted.
     29        * UserInterface/Views/CookieStorageContentView.css:
     30        (.content-view.cookie-storage > .message-text-view): Added.
     31        (.content-view.cookie-storage > .message-text-view > .message): Added.
     32        (.content-view.cookie-storage > .data-grid): Deleted.
     33        Add a filter bar to the navigation bar that checks the regex-ified filter text against the
     34        formatted text of each cell for each cookie. Also hook it up to the global find shortcut.
     35
     36        * UserInterface/Views/NetworkTableContentView.js:
     37        (WI.NetworkTableContentView.prototype.layout):
     38        (WI.NetworkTableContentView.prototype._showEmptyFilterResultsMessage):
     39        (WI.NetworkTableContentView.prototype._tableNameColumnDidChangeWidth):
     40        (WI.NetworkTableContentView.prototype._positionEmptyFilterMessage): Deleted.
     41        * UserInterface/Views/NetworkTableContentView.css:
     42        (.content-view.network .message-text-view): Added.
     43        Drive-by: instead of having the "No Filter Results" view only cover the "Name" column, it
     44                  should cover the entire table so as to be as noticable as possible (not to mention
     45                  the table will be empty anyways, so it's not like anything is being hidden).
     46        Drive-by: ensure that the "No Filter Results" view doesn't cover the statistics.
     47
    1482020-04-21  Devin Rousso  <drousso@apple.com>
    249

  • trunk/Source/WebInspectorUI/UserInterface/Views/CookieStorageContentView.css

    r172399 r260523  
    11/*
    2  * Copyright (C) 2013 Apple Inc. All rights reserved.
     2 * Copyright (C) 2013-2020 Apple Inc. All rights reserved.
    33 *
    44 * Redistribution and use in source and binary forms, with or without
    … …  
    2424 */
    2525
    26 .content-view.cookie-storage > .data-grid {
    27     position: absolute;
    28     top: 0;
    29     left: 0;
    30     right: 0;
    31     bottom: 0;
     26.content-view.cookie-storage > .message-text-view {
     27    top: var(--navigation-bar-height);
    3228}
     29
     30.content-view.cookie-storage > .message-text-view > .message {
     31    font-size: var(--message-text-view-font-size);
     32    font-weight: normal;
     33}

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

    r259744 r260523  
    3333
    3434        this._cookies = [];
     35        this._filteredCookies = [];
    3536        this._sortComparator = null;
    3637        this._table = null;
     38
     39        this._emptyFilterResultsMessageElement = null;
     40
     41        this._filterBarNavigationItem = new WI.FilterBarNavigationItem;
     42        this._filterBarNavigationItem.filterBar.addEventListener(WI.FilterBar.Event.FilterDidChange, this._handleFilterBarFilterDidChange, this);
    3743
    3844        if (InspectorBackend.hasCommand("Page.setCookie")) {
    … …  
    5460    {
    5561        let navigationItems = [];
     62        navigationItems.push(this._filterBarNavigationItem);
     63        navigationItems.push(new WI.DividerNavigationItem);
    5664        if (this._setCookieButtonNavigationItem)
    5765            navigationItems.push(this._setCookieButtonNavigationItem);
    … …  
    7482    }
    7583
     84    get canFocusFilterBar()
     85    {
     86        return true;
     87    }
     88
     89    focusFilterBar()
     90    {
     91        this._filterBarNavigationItem.filterBar.focus();
     92    }
     93
    7694    handleCopyEvent(event)
    7795    {
    … …  
    92110    tableIndexForRepresentedObject(table, object)
    93111    {
    94         let index = this._cookies.indexOf(object);
     112        let index = this._filteredCookies.indexOf(object);
    95113        console.assert(index >= 0);
    96114        return index;
    … …  
    99117    tableRepresentedObjectForIndex(table, index)
    100118    {
    101         console.assert(index >= 0 && index < this._cookies.length);
    102         return this._cookies[index];
     119        console.assert(index >= 0 && index < this._filteredCookies.length);
     120        return this._filteredCookies[index];
    103121    }
    104122
    105123    tableNumberOfRows(table)
    106124    {
    107         return this._cookies.length;
     125        return this._filteredCookies.length;
    108126    }
    109127
    … …  
    116134
    117135        this._updateSort();
     136        this._updateFilteredCookies();
     137        this._updateEmptyFilterResultsMessage();
    118138        this._table.reloadData();
    119139    }
    … …  
    130150            contextMenu.appendItem(WI.UIString("Edit"), () => {
    131151                console.assert(!this._editingCookie);
    132                 this._editingCookie = this._cookies[rowIndex];
     152                this._editingCookie = this._filteredCookies[rowIndex];
    133153
    134154                let popover = new WI.CookiePopover(this);
    … …  
    165185        for (let i = rowIndexes.length - 1; i >= 0; --i) {
    166186            let rowIndex = rowIndexes[i];
    167             let cookie = this._cookies[rowIndex];
     187            let cookie = this._filteredCookies[rowIndex];
    168188            console.assert(cookie, "Missing cookie for row " + rowIndex);
    169189            if (!cookie)
    170190                continue;
    171191
    172             this._cookies.splice(rowIndex, 1);
     192            this._filteredCookies.splice(rowIndex, 1);
     193            this._cookies.remove(cookie);
    173194
    174195            let target = WI.assumingMainTarget();
    … …  
    179200    tablePopulateCell(table, cell, column, rowIndex)
    180201    {
    181         let cookie = this._cookies[rowIndex];
     202        let cookie = this._filteredCookies[rowIndex];
    182203        cell.textContent = this._formatCookiePropertyForColumn(cookie, column);
    183204        return cell;
    … …  
    287308    // Private
    288309
    289     _filterCookies(cookies)
     310    _getCookiesForHost(cookies, host)
    290311    {
    291312        let resourceMatchesStorageDomain = (resource) => {
    292313            let urlComponents = resource.urlComponents;
    293             return urlComponents && urlComponents.host && urlComponents.host === this.representedObject.host;
     314            return urlComponents && urlComponents.host && urlComponents.host === host;
    294315        };
    295316
    … …  
    382403        await Promise.all(promises);
    383404
    384         let index = this._cookies.findIndex((existingCookie) => cookieToSet.equals(existingCookie));
     405        let index = this._filteredCookies.findIndex((existingCookie) => cookieToSet.equals(existingCookie));
    385406        if (index >= 0)
    386407            this._table.selectRow(index);
    387408    }
    388409
     410    _handleFilterBarFilterDidChange(event)
     411    {
     412        this._updateFilteredCookies();
     413        this._updateEmptyFilterResultsMessage();
     414        this._table.reloadData();
     415    }
     416
    389417    _handleSetCookieButtonClick(event)
    390418    {
    … …  
    401429    {
    402430        let target = WI.assumingMainTarget();
    403         for (let cookie of this._cookies.splice(0))
     431        for (let cookie of this._cookies)
    404432            target.PageAgent.deleteCookie(cookie.name, cookie.url);
    405433
    406         this._table.reloadData();
     434        this._reloadCookies();
    407435    }
    408436
    … …  
    411439        let target = WI.assumingMainTarget();
    412440        return target.PageAgent.getCookies().then((payload) => {
    413             this._cookies = this._filterCookies(payload.cookies.map(WI.Cookie.fromPayload));
     441            this._cookies = this._getCookiesForHost(payload.cookies.map(WI.Cookie.fromPayload), this.representedObject.host);
    414442            this._updateSort();
     443            this._updateFilteredCookies();
     444            this._updateEmptyFilterResultsMessage();
    415445            this._table.reloadData();
    416446        }).catch((error) => {
    … …  
    427457    }
    428458
     459    _updateFilteredCookies()
     460    {
     461        let filterText = this._filterBarNavigationItem.filterBar.filters.text;
     462        if (filterText) {
     463            let regex = WI.SearchUtilities.filterRegExpForString(filterText, WI.SearchUtilities.defaultSettings);
     464            this._filteredCookies = this._cookies.filter((cookie) => {
     465                for (let column of this._table.columns) {
     466                    let text = this._formatCookiePropertyForColumn(cookie, column);
     467                    if (text && regex.test(text))
     468                        return true;
     469                }
     470                return false;
     471            });
     472        } else
     473            this._filteredCookies = this._cookies;
     474    }
     475
     476    _updateEmptyFilterResultsMessage()
     477    {
     478        if (this._filteredCookies.length || !this._filterBarNavigationItem.filterBar.filters.text) {
     479            if (this._emptyFilterResultsMessageElement)
     480                this._emptyFilterResultsMessageElement.remove();
     481            this._emptyFilterResultsMessageElement = null;
     482        } else {
     483            if (!this._emptyFilterResultsMessageElement) {
     484                let buttonElement = document.createElement("button");
     485                buttonElement.textContent = WI.UIString("Clear Filters");
     486                buttonElement.addEventListener("click", (event) => {
     487                    this._filterBarNavigationItem.filterBar.clear();
     488                });
     489
     490                this._emptyFilterResultsMessageElement = WI.createMessageTextView(WI.UIString("No Filter Results"));
     491                this._emptyFilterResultsMessageElement.appendChild(buttonElement);
     492            }
     493
     494            this.element.appendChild(this._emptyFilterResultsMessageElement);
     495        }
     496    }
     497
    429498    _handleTableKeyDown(event)
    430499    {
    … …  
    435504    _cookiesAtIndexes(indexes)
    436505    {
    437         if (!this._cookies.length)
     506        if (!this._filteredCookies.length)
    438507            return [];
    439         return indexes.map((index) => this._cookies[index]);
     508        return indexes.map((index) => this._filteredCookies[index]);
    440509    }
    441510

  • trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css

    r259423 r260523  
    228228}
    229229
     230.content-view.network .message-text-view {
     231    top: var(--navigation-bar-height);
     232    bottom: var(--network-statistics-height);
     233}
     234
    230235.content-view.network .message-text-view > .message {
    231236    font-size: var(--message-text-view-font-size);

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

    r260291 r260523  
    12851285        this._processPendingEntries();
    12861286        this._positionDetailView();
    1287         this._positionEmptyFilterMessage();
    12881287        this._updateExportButton();
    12891288    }
    … …  
    16041603
    16051604        this.element.appendChild(this._emptyFilterResultsMessageElement);
    1606         this._positionEmptyFilterMessage();
    16071605    }
    16081606
    … …  
    16131611
    16141612        this._emptyFilterResultsMessageElement.remove();
    1615     }
    1616 
    1617     _positionEmptyFilterMessage()
    1618     {
    1619         if (!this._emptyFilterResultsMessageElement)
    1620             return;
    1621 
    1622         let width = this._nameColumn.width - 1; // For the 1px border.
    1623         this._emptyFilterResultsMessageElement.style.width = width + "px";
    16241613    }
    16251614
    … …  
    24952484
    24962485        this._positionDetailView();
    2497         this._positionEmptyFilterMessage();
    24982486    }
    24992487
Note: See TracChangeset for help on using the changeset viewer.