Bug 35971 – Web Inspector: Implement a progress indicator in the Audits panel when checks are running

• Status: RESOLVED
• Resolution: FIXED
• Component: Web Inspector (Deprecated)

[Alexander Pavlov (apavlov)]

When audits are running (with/without page refresh), there is no way for a user to know if something is happening or not in the Web Inspector.

[Alexander Pavlov (apavlov)]

Created attachment 50584 [details]
[PATCH] Suggested solution

Only resource loading progress is needed, audits run nearly instantly.

[Alexander Pavlov (apavlov)]

Created attachment 50585 [details]
[IMAGE] Resource loading progress reported in the button caption

[Timothy Hatcher]

I don't think turning thr button into a progress indicator is great.

A spinner with status text next to it would be better. But having it be a button is confusing, what happens if you press it?

[Timothy Hatcher]

Created attachment 50590 [details]
Spinner

[Alexander Pavlov (apavlov)]

Created attachment 50607 [details]
[PATCH] Separated progress message, added spinner

[Timothy Hatcher]

Comment on attachment 50607 [details]
[PATCH] Separated progress message, added spinner

> +        this.totalResources = 1;

Why 1 not 0?

> +        this.totalResources++;

Should be ++this.totalResources;

> +        this.loadedResources++;

Ditto.


> +            this._resourceProgressTextElement.textContent = WebInspector.UIString("Loading, completed %d of %d items", this.loadedResources, this.totalResources);

I think "Loading (%d of %d)" is just as clear and shorter.

> +    vertical-align: sub;

I would expect middle, I never heard of sub until now. What does sub do? Does middle give the same result?

Looks good. Will r+ if you fix these things.

[Alexander Pavlov (apavlov)]

Created attachment 50701 [details]
[IMAGE] Standalone message with spinner at "vertical-align: middle"

[Alexander Pavlov (apavlov)]

Created attachment 50706 [details]
[IMAGE] Message with spinner at "vertical-align: text-top"

[Alexander Pavlov (apavlov)]

Created attachment 50707 [details]
[PATCH] Comments addressed, "vertical-align: text-top"

[Alexander Pavlov (apavlov)]

(In reply to comment #6)
> (From update of attachment 50607 [details])
> > +        this.totalResources = 1;
> 
> Why 1 not 0?

Comment added

> > +        this.totalResources++;
> 
> Should be ++this.totalResources;

Done

> > +        this.loadedResources++;
> 
> Ditto.

Done

> 
> > +            this._resourceProgressTextElement.textContent = WebInspector.UIString("Loading, completed %d of %d items", this.loadedResources, this.totalResources);
> 
> I think "Loading (%d of %d)" is just as clear and shorter.

This was borrowed from the Safari page loading status. Done

> 
> > +    vertical-align: sub;
> 
> I would expect middle, I never heard of sub until now. What does sub do? Does
> middle give the same result?

No, using "text-top" instead.

[Alexander Pavlov (apavlov)]

Committing to http://svn.webkit.org/repository/webkit/trunk ...
        M       WebCore/ChangeLog
        M       WebCore/English.lproj/localizedStrings.js
        M       WebCore/GNUmakefile.am
        M       WebCore/WebCore.gypi
        M       WebCore/inspector/front-end/AuditLauncherView.js
        M       WebCore/inspector/front-end/AuditsPanel.js
        A       WebCore/inspector/front-end/Images/spinner.gif
        M       WebCore/inspector/front-end/WebKit.qrc
        M       WebCore/inspector/front-end/audits.css
        M       WebCore/inspector/front-end/inspector.js
Committed r55999