Bug 74292 - Web Inspector: [Styles] Update selected DOM element styles whenever applicable media queries change
Summary: Web Inspector: [Styles] Update selected DOM element styles whenever applicabl...
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Web Inspector (Deprecated) (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Normal
Assignee: Alexander Pavlov (apavlov)
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2011-12-12 06:26 PST by Alexander Pavlov (apavlov)
Modified: 2011-12-15 01:23 PST (History)
10 users (show)

See Also:


Attachments
Patch (15.34 KB, patch)
2011-12-14 05:26 PST, Alexander Pavlov (apavlov)
no flags Details | Formatted Diff | Diff
Patch (17.67 KB, patch)
2011-12-14 09:53 PST, Alexander Pavlov (apavlov)
pfeldman: review+
Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Alexander Pavlov (apavlov) 2011-12-12 06:26:47 PST
Whenever media query aspects (like orientation, max-width, etc.) change, it would be useful to dynamically update the matched rules for the current DOM element.
Comment 1 Alexander Pavlov (apavlov) 2011-12-14 05:26:22 PST
Created attachment 119208 [details]
Patch
Comment 2 Pavel Feldman 2011-12-14 08:45:03 PST
Comment on attachment 119208 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=119208&action=review

> Source/WebCore/inspector/CodeGeneratorInspector.py:207
> +    skip_js_bind_domains = set(["Runtime", "DOMDebugger"])

I think we should unskip everything. Why does it even exists?

> Source/WebCore/inspector/Inspector.json:1749
> +                "description": "Fires whenever a MediaQuery result changes (the current implementation considers only viewport-dependent media features.)"

This is not clear to me. Could you elaborate more on when the event is actually fired?

> Source/WebCore/inspector/InspectorCSSAgent.cpp:237
> +        m_frontend->mediaQueryResultChanged();

Now that CSS domain emits events, we should make sure that it only does so when the agent is enabled. You need to introduce enable/disable methods pair as in the other domains and only generate messages while enabled. Actually, you might want to set CSS agent to the instrumentingAgents set in the ::enable.

> Source/WebCore/inspector/front-end/CSSStyleModel.js:859
> +WebInspector.CSSDispatcher = function(cssModel)

Please jsdoc this new class.
Comment 3 Alexander Pavlov (apavlov) 2011-12-14 09:53:54 PST
Created attachment 119237 [details]
Patch
Comment 4 Alexander Pavlov (apavlov) 2011-12-14 09:57:27 PST
(In reply to comment #2)
> (From update of attachment 119208 [details])
> View in context: https://bugs.webkit.org/attachment.cgi?id=119208&action=review
> 
> > Source/WebCore/inspector/CodeGeneratorInspector.py:207
> > +    skip_js_bind_domains = set(["Runtime", "DOMDebugger"])
> 
> I think we should unskip everything. Why does it even exists?

I will file a bug for this.

> > Source/WebCore/inspector/Inspector.json:1749
> > +                "description": "Fires whenever a MediaQuery result changes (the current implementation considers only viewport-dependent media features.)"
> 
> This is not clear to me. Could you elaborate more on when the event is actually fired?

This event fires (in the suggested implementation) whenever a viewport-dependent media feature value changes. Some examples are: orientation, width, height, aspect ratio. You resize the browser or rotate your smartphone and receive the notification, because entirely different CSS rules may get applied to the inspected element, and we want to observe this live.

> > Source/WebCore/inspector/InspectorCSSAgent.cpp:237
> > +        m_frontend->mediaQueryResultChanged();
> 
> Now that CSS domain emits events, we should make sure that it only does so when the agent is enabled. You need to introduce enable/disable methods pair as in the other domains and only generate messages while enabled. Actually, you might want to set CSS agent to the instrumentingAgents set in the ::enable.

Done.

> > Source/WebCore/inspector/front-end/CSSStyleModel.js:859
> > +WebInspector.CSSDispatcher = function(cssModel)
> 
> Please jsdoc this new class.

Done.
Comment 5 Pavel Feldman 2011-12-14 15:34:27 PST
Comment on attachment 119237 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=119237&action=review

> Source/WebCore/inspector/InspectorCSSAgent.cpp:197
> +    , m_enabled(false)

you don't actually need to mimic the m_state->get(cssAgentEnabled) state.

> Source/WebCore/inspector/InspectorCSSAgent.cpp:216
> +    m_instrumentingAgents->setInspectorCSSAgent(this);

Can we do it even later? Like in enable?

> Source/WebCore/page/FrameView.cpp:1005
> +            InspectorInstrumentation::didMediaQueryResultChange(document);

We only use did* notation when there is a corresponding will* signal. ::mediaQueryResultChanged would be Ok in this case.
Comment 6 Alexander Pavlov (apavlov) 2011-12-15 01:20:05 PST
(In reply to comment #5)
> (From update of attachment 119237 [details])
> View in context: https://bugs.webkit.org/attachment.cgi?id=119237&action=review
> 
> > Source/WebCore/inspector/InspectorCSSAgent.cpp:197
> > +    , m_enabled(false)
> 
> you don't actually need to mimic the m_state->get(cssAgentEnabled) state.

Right, removed.

> > Source/WebCore/inspector/InspectorCSSAgent.cpp:216
> > +    m_instrumentingAgents->setInspectorCSSAgent(this);
> 
> Can we do it even later? Like in enable?

Done.

> > Source/WebCore/page/FrameView.cpp:1005
> > +            InspectorInstrumentation::didMediaQueryResultChange(document);
> 
> We only use did* notation when there is a corresponding will* signal. ::mediaQueryResultChanged would be Ok in this case.

Done.
Comment 7 Alexander Pavlov (apavlov) 2011-12-15 01:23:39 PST
Committed r102903: <http://trac.webkit.org/changeset/102903>