New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 669323 link

Starred by 1 user

Issue metadata

Status: Fixed
Owner:
Last visit 29 days ago
Closed: Feb 2017
Components:
EstimatedDays: ----
NextAction: ----
OS: ----
Pri: 2
Type: Bug



Sign in to add a comment

DevTools: migrate icons to UI.Icon

Project Member Reported by lushnikov@chromium.org, Nov 29 2016

Issue description

We should start using UI.Icon class everywhere where we need icons in DevTools.

 
Project Member

Comment 4 by bugdroid1@chromium.org, Nov 30 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/442e6b3e0058cdec555c8ea25fad6e06fe6735fd

commit 442e6b3e0058cdec555c8ea25fad6e06fe6735fd
Author: lushnikov <lushnikov@chromium.org>
Date: Wed Nov 30 22:03:09 2016

DevTools: [SuggestBox] migrate suggestbox icons onto UI.Icon

This patch allows suggestBox providers to specify suggestion icons.

Suggestion Icons are displayed next to suggestion, and, importantly,
they turn 'white' whenever the suggestion gets selected.

In order to support this scenario, the 'force-white-icons' class is
introduced. Whenever container is attributed with this css class, any
descendant icons become white.

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2534383002
Cr-Commit-Position: refs/heads/master@{#435434}

[modify] https://crrev.com/442e6b3e0058cdec555c8ea25fad6e06fe6735fd/third_party/WebKit/Source/devtools/front_end/console/ConsolePrompt.js
[modify] https://crrev.com/442e6b3e0058cdec555c8ea25fad6e06fe6735fd/third_party/WebKit/Source/devtools/front_end/ui/Icon.js
[modify] https://crrev.com/442e6b3e0058cdec555c8ea25fad6e06fe6735fd/third_party/WebKit/Source/devtools/front_end/ui/SuggestBox.js
[modify] https://crrev.com/442e6b3e0058cdec555c8ea25fad6e06fe6735fd/third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css
[modify] https://crrev.com/442e6b3e0058cdec555c8ea25fad6e06fe6735fd/third_party/WebKit/Source/devtools/front_end/ui/suggestBox.css

Project Member

Comment 5 by bugdroid1@chromium.org, Dec 1 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/df15e0911044f80eb118b925b2a3e48288e453ef

commit df15e0911044f80eb118b925b2a3e48288e453ef
Author: lushnikov <lushnikov@chromium.org>
Date: Thu Dec 01 03:16:03 2016

DevTools: [SuggestBox] follow-up to migration icons to UI.Icon

Patch crrev.com/2534383002 introduced flexbox layout for suggestion items.
However, it should also be more accurate with item flexing, which gets
messed up in some rare cases.

This patch wraps suggestion text in its own span so that it shrinks
properly.

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2535393004
Cr-Commit-Position: refs/heads/master@{#435542}

[modify] https://crrev.com/df15e0911044f80eb118b925b2a3e48288e453ef/third_party/WebKit/Source/devtools/front_end/ui/SuggestBox.js
[modify] https://crrev.com/df15e0911044f80eb118b925b2a3e48288e453ef/third_party/WebKit/Source/devtools/front_end/ui/suggestBox.css

Project Member

Comment 6 by bugdroid1@chromium.org, Dec 10 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/d5edba288a314b06675dfe87e603c9e4fcb05108

commit d5edba288a314b06675dfe87e603c9e4fcb05108
Author: lushnikov <lushnikov@chromium.org>
Date: Sat Dec 10 03:33:20 2016

DevTools: migrate last usages of samllIcons.png to UI.Icon

This patch migrates the "left thick blue" icon, which points to the
inspected node, onto UI.Icon. As a result, the icon is now sharp
on retina!

This patch also introduces icon support for treeoutline: every
TreeElement now has TreeElement.setTrailingIcons(icons) method.
Users might call it to add icons after the treeelement's title.

In future, a symmetrical method TreeElement.setLeadingIcons(icons)
method, which will be used to migrate navigator icons over to
the UI.Icon.

BUG= 669323 

Review-Url: https://codereview.chromium.org/2564433004
Cr-Commit-Position: refs/heads/master@{#437738}

[modify] https://crrev.com/d5edba288a314b06675dfe87e603c9e4fcb05108/third_party/WebKit/LayoutTests/http/tests/inspector/security/interstitial-sidebar-expected.txt
[modify] https://crrev.com/d5edba288a314b06675dfe87e603c9e4fcb05108/third_party/WebKit/Source/devtools/front_end/accessibility/AXTreePane.js
[modify] https://crrev.com/d5edba288a314b06675dfe87e603c9e4fcb05108/third_party/WebKit/Source/devtools/front_end/accessibility/accessibilityNode.css
[modify] https://crrev.com/d5edba288a314b06675dfe87e603c9e4fcb05108/third_party/WebKit/Source/devtools/front_end/ui/Icon.js
[modify] https://crrev.com/d5edba288a314b06675dfe87e603c9e4fcb05108/third_party/WebKit/Source/devtools/front_end/ui/treeoutline.css
[modify] https://crrev.com/d5edba288a314b06675dfe87e603c9e4fcb05108/third_party/WebKit/Source/devtools/front_end/ui/treeoutline.js

Project Member

Comment 7 by bugdroid1@chromium.org, Dec 14 2016

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/d2b33e185dd8325dd9bd7c643a466826664f076d

commit d2b33e185dd8325dd9bd7c643a466826664f076d
Author: lushnikov <lushnikov@chromium.org>
Date: Wed Dec 14 22:07:30 2016

DevTools: convert a few more icons to UI.Icon.

This patch migrates a few more instances of icons onto UI.Icon:
- console's expand stack trace triangle
- styles sidebar pane's expand triangle for longhands
- blockedURL's "remove" button

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2570783006
Cr-Commit-Position: refs/heads/master@{#438646}

[modify] https://crrev.com/d2b33e185dd8325dd9bd7c643a466826664f076d/third_party/WebKit/Source/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/d2b33e185dd8325dd9bd7c643a466826664f076d/third_party/WebKit/Source/devtools/front_end/console/consoleView.css
[modify] https://crrev.com/d2b33e185dd8325dd9bd7c643a466826664f076d/third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js
[modify] https://crrev.com/d2b33e185dd8325dd9bd7c643a466826664f076d/third_party/WebKit/Source/devtools/front_end/elements/stylesSectionTree.css
[modify] https://crrev.com/d2b33e185dd8325dd9bd7c643a466826664f076d/third_party/WebKit/Source/devtools/front_end/network/BlockedURLsPane.js
[modify] https://crrev.com/d2b33e185dd8325dd9bd7c643a466826664f076d/third_party/WebKit/Source/devtools/front_end/network/blockedURLsPane.css
[modify] https://crrev.com/d2b33e185dd8325dd9bd7c643a466826664f076d/third_party/WebKit/Source/devtools/front_end/ui/Icon.js
[modify] https://crrev.com/d2b33e185dd8325dd9bd7c643a466826664f076d/third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css

Project Member

Comment 9 by bugdroid1@chromium.org, Dec 19 2016

Project Member

Comment 10 by bugdroid1@chromium.org, Jan 25 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/f2566bcd386311eb6e0d9e12036b582102687e7d

commit f2566bcd386311eb6e0d9e12036b582102687e7d
Author: lushnikov <lushnikov@chromium.org>
Date: Wed Jan 25 04:54:54 2017

DevTools: convert datagrid and network waterfall sort icons to UI.Icon

This patch converts more icons to UI.Icon:
- the "up/down" sort icons on data grid header cells
- the "up/down" sort icon on the network waterfall

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2649153005
Cr-Commit-Position: refs/heads/master@{#445952}

[modify] https://crrev.com/f2566bcd386311eb6e0d9e12036b582102687e7d/third_party/WebKit/Source/devtools/front_end/components/CustomPreviewSection.js
[modify] https://crrev.com/f2566bcd386311eb6e0d9e12036b582102687e7d/third_party/WebKit/Source/devtools/front_end/console/ConsoleViewMessage.js
[modify] https://crrev.com/f2566bcd386311eb6e0d9e12036b582102687e7d/third_party/WebKit/Source/devtools/front_end/data_grid/DataGrid.js
[modify] https://crrev.com/f2566bcd386311eb6e0d9e12036b582102687e7d/third_party/WebKit/Source/devtools/front_end/data_grid/dataGrid.css
[modify] https://crrev.com/f2566bcd386311eb6e0d9e12036b582102687e7d/third_party/WebKit/Source/devtools/front_end/elements/StylesSidebarPane.js
[modify] https://crrev.com/f2566bcd386311eb6e0d9e12036b582102687e7d/third_party/WebKit/Source/devtools/front_end/network/NetworkLogViewColumns.js
[modify] https://crrev.com/f2566bcd386311eb6e0d9e12036b582102687e7d/third_party/WebKit/Source/devtools/front_end/network/networkLogView.css
[modify] https://crrev.com/f2566bcd386311eb6e0d9e12036b582102687e7d/third_party/WebKit/Source/devtools/front_end/ui/Icon.js

Project Member

Comment 11 by bugdroid1@chromium.org, Jan 26 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4

commit 99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4
Author: lushnikov <lushnikov@chromium.org>
Date: Thu Jan 26 05:45:19 2017

DevTools: migrate icons in "search across files" to UI.Icon

This patch migrates to small icons in the search input field: the
"looking glass" icon and the "clear search" icon.

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2657743003
Cr-Commit-Position: refs/heads/master@{#446239}

[modify] https://crrev.com/99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4/third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js
[modify] https://crrev.com/99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4/third_party/WebKit/Source/devtools/front_end/sources/sourcesSearch.css
[modify] https://crrev.com/99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4/third_party/WebKit/Source/devtools/front_end/ui/Icon.js

Project Member

Comment 12 by bugdroid1@chromium.org, Jan 26 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4

commit 99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4
Author: lushnikov <lushnikov@chromium.org>
Date: Thu Jan 26 05:45:19 2017

DevTools: migrate icons in "search across files" to UI.Icon

This patch migrates to small icons in the search input field: the
"looking glass" icon and the "clear search" icon.

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2657743003
Cr-Commit-Position: refs/heads/master@{#446239}

[modify] https://crrev.com/99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4/third_party/WebKit/Source/devtools/front_end/sources/AdvancedSearchView.js
[modify] https://crrev.com/99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4/third_party/WebKit/Source/devtools/front_end/sources/sourcesSearch.css
[modify] https://crrev.com/99fb0a7ab0aa355d6d2bd17ca0d6940b57ec44b4/third_party/WebKit/Source/devtools/front_end/ui/Icon.js

Project Member

Comment 16 by bugdroid1@chromium.org, Jan 26 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/1770ad525ab58b3abad0a40001be00197aae3843

commit 1770ad525ab58b3abad0a40001be00197aae3843
Author: lushnikov <lushnikov@chromium.org>
Date: Thu Jan 26 23:13:12 2017

DevTools: migrate UI.ViewManager's expand icon over to UI.Icon

This patch migrates ViewManager's expand icon over to UI.Icon.
This is the triangle icon in the "CallStack" sidebar pane title element.

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2654043004
Cr-Commit-Position: refs/heads/master@{#446487}

[modify] https://crrev.com/1770ad525ab58b3abad0a40001be00197aae3843/third_party/WebKit/Source/devtools/front_end/ui/View.js
[modify] https://crrev.com/1770ad525ab58b3abad0a40001be00197aae3843/third_party/WebKit/Source/devtools/front_end/ui/viewContainers.css

Project Member

Comment 17 by bugdroid1@chromium.org, Jan 31 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/4b1dc85cf4ee7711aaf07585ec51249e77cfbfac

commit 4b1dc85cf4ee7711aaf07585ec51249e77cfbfac
Author: lushnikov <lushnikov@chromium.org>
Date: Tue Jan 31 04:50:08 2017

DevTools: migrate ResourcesPanel icons over to UI.Icon

This patch migrates ResourcesPanel over to the UI.Icon. This CL is a bit
longer then usual migration CL's because a few thigns had to happen
simultaneously:
- a new spritesheet is created for the resourceGlyphs
- the treeElement.createIcon() method is no longer needed
- the rest of ResourcesPanel is migrated over to the UI.Icon

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2660893002
Cr-Commit-Position: refs/heads/master@{#447191}

[modify] https://crrev.com/4b1dc85cf4ee7711aaf07585ec51249e77cfbfac/third_party/WebKit/Source/devtools/front_end/resources/ResourcesPanel.js
[modify] https://crrev.com/4b1dc85cf4ee7711aaf07585ec51249e77cfbfac/third_party/WebKit/Source/devtools/front_end/resources/resourcesSidebar.css
[modify] https://crrev.com/4b1dc85cf4ee7711aaf07585ec51249e77cfbfac/third_party/WebKit/Source/devtools/front_end/ui/Icon.js
[modify] https://crrev.com/4b1dc85cf4ee7711aaf07585ec51249e77cfbfac/third_party/WebKit/Source/devtools/front_end/ui/inspectorCommon.css
[modify] https://crrev.com/4b1dc85cf4ee7711aaf07585ec51249e77cfbfac/third_party/WebKit/Source/devtools/front_end/ui/treeoutline.js

Project Member

Comment 18 by bugdroid1@chromium.org, Jan 31 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/c92fc23928f524266a2bb85acc086148d51550ac

commit c92fc23928f524266a2bb85acc086148d51550ac
Author: lushnikov <lushnikov@chromium.org>
Date: Tue Jan 31 11:52:05 2017

DevTools: extract treeoutline triangle icons from toolbarButtonGlyphs.png

This patch extracts treeoutline triangle icons from toolbarButtonGlyphs.png.
These are hard to migrate to the UI.Icon and they never change, so this
is a legit compromise.

BUG= 669323 
R=dgozman

Review-Url: https://codereview.chromium.org/2661893002
Cr-Commit-Position: refs/heads/master@{#447217}

[modify] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/BUILD.gn
[modify] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/front_end/Images/src/optimize_png.hashes
[modify] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/front_end/Images/src/svg2png.hashes
[add] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/front_end/Images/src/treeoutlineTriangles.svg
[add] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/front_end/Images/treeoutlineTriangles.png
[add] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/front_end/Images/treeoutlineTriangles_2x.png
[modify] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/front_end/data_grid/dataGrid.css
[modify] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/front_end/elements/elementsTreeOutline.css
[modify] https://crrev.com/c92fc23928f524266a2bb85acc086148d51550ac/third_party/WebKit/Source/devtools/front_end/ui/treeoutline.css

Project Member

Comment 19 by bugdroid1@chromium.org, Feb 2 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/6ba98183e9bfaf01aaa8c247bd3d1c13da47df88

commit 6ba98183e9bfaf01aaa8c247bd3d1c13da47df88
Author: lushnikov <lushnikov@chromium.org>
Date: Thu Feb 02 00:38:36 2017

DevTools: migrate elements panel gutter icon to UI.Icon

This patch migrates elements's panel gutter icon (three dots on the left
of selected node) over to UI.Icon.

BUG= 669323 
R=dgozman_slow

Review-Url: https://codereview.chromium.org/2664393002
Cr-Commit-Position: refs/heads/master@{#447659}

[modify] https://crrev.com/6ba98183e9bfaf01aaa8c247bd3d1c13da47df88/third_party/WebKit/Source/devtools/front_end/elements/ElementsTreeElement.js
[modify] https://crrev.com/6ba98183e9bfaf01aaa8c247bd3d1c13da47df88/third_party/WebKit/Source/devtools/front_end/elements/elementsTreeOutline.css

Project Member

Comment 20 by bugdroid1@chromium.org, Feb 2 2017

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/7aee106060efcc49f9768365b77f1ea697b17230

commit 7aee106060efcc49f9768365b77f1ea697b17230
Author: lushnikov <lushnikov@chromium.org>
Date: Thu Feb 02 06:19:46 2017

DevTools: migrate the closeButton icons over to UI.Icon

This patch migrates closeButton over to the UI.Icon.

CloseButton could be found in a few places, e.g. in the TabbedPane tab
and in the network's panel request view.

BUG= 669323 
R=dgozman_slow

Review-Url: https://codereview.chromium.org/2669093002
Cr-Commit-Position: refs/heads/master@{#447707}

[modify] https://crrev.com/7aee106060efcc49f9768365b77f1ea697b17230/third_party/WebKit/Source/devtools/front_end/ui/Icon.js
[modify] https://crrev.com/7aee106060efcc49f9768365b77f1ea697b17230/third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js
[modify] https://crrev.com/7aee106060efcc49f9768365b77f1ea697b17230/third_party/WebKit/Source/devtools/front_end/ui/closeButton.css

Status: Fixed (was: Assigned)
Yay! That was the last patch!

Sign in to add a comment