Bug 149533 – Web Inspector: make it easy to disable sidebar filters if everything is filtered out

• Component: Web Inspector
• Status: NEW

[Blaze Burg]

This is especially mysterious on the debugger sidebar.

Two ideas:

 * Placeholder text "No files match (20 files not shown)."
 * Underneath placeholder text, show hyperlinks/buttons to toggle the currently active filters.

[Radar WebKit Bug Importer]

<rdar://problem/22841740>

[Matt Baker]

Created attachment 264178 [details]
[Image] Working UI

WIP patch to follow

[Matt Baker]

(In reply to comment #2)
> Created attachment 264178 [details]
> [Image] Working UI
> 
> WIP patch to follow

The message bubble could probably use a more modern look, so I'm experimenting with removing the text-shadow and box-shadow.

[Devin Rousso]

This looks really nice!  I am assuming that if the user clicks on the "Show # hidden items" then it will remove the filter entirely and show everything?

[Nikita Vasilyev]

Created attachment 264199 [details]
[Image] Mockup

How about:

— Show all files when there are no matches. Showing only "No Filter Results" is just not very useful.
— Add "Show X hidden items" button after the items list

[Matt Baker]

(In reply to comment #4)
> This looks really nice!  I am assuming that if the user clicks on the "Show
> # hidden items" then it will remove the filter entirely and show everything?

Correct. This means different things depending on the content view associated with the sidebar panel. The default behavior can be for NavigationSidebarPanel to simply call:

this._filterBar.filters = null;

but if a derived sidebar panel has custom filters, more work needs to be done. Timeline views filter based on the timeline ruler selection, the frames view filters based on task type and frame duration, and so on.

[Matt Baker]

(In reply to comment #5)
> Created attachment 264199 [details]
> [Image] Mockup
> 
> How about:
> 
> — Show all files when there are no matches. Showing only "No Filter Results"
> is just not very useful.
> — Add "Show X hidden items" button after the items list

I think these are interesting ideas, and think the second would be very useful. Positioning the message in the correct location requires some additional layout logic (see https://bugs.webkit.org/show_bug.cgi?id=150608), so if we tackle this let's do it as a follow up.

[Matt Baker]

This complicates the Debugger sidebar, which has multiple filterable tree outlines (Sources, Breakpoints). I think we should defer pending a re-think of our current sidebar design.