DevTools: [MediaQueryInspector] Compute media query length on backend

This patch pulls computed media query lengths values from backend.
Note: it is ok to create multiple MediaValuesDynamic objects because
they don't have any internal state and serve as a helper wrappers.

BUG=382996

Review URL: https://codereview.chromium.org/339553004

git-svn-id: svn://svn.chromium.org/blink/trunk@176445 bbb929c8-8fbe-4397-9dbb-9b2b20218538

third_party/WebKit/LayoutTests/inspector-protocol/css/css-get-media-queries-expected.txt

@@ -6,10 +6,12 @@ mediaRule #0
         mediaExpression #0
             feature: max-width
             value: 100px
+            computed length: 100
     mediaQuery #1
         mediaExpression #0
             feature: max-width
             value: 72em
+            computed length: 1152
 mediaRule #1
     text: (max-width: 200px) and (min-width: 100px)
     source: mediaRule
@@ -18,9 +20,11 @@ mediaRule #1
         mediaExpression #0
             feature: max-width
             value: 200px
+            computed length: 200
         mediaExpression #1
             feature: min-width
             value: 100px
+            computed length: 100
 mediaRule #2
     text: (min-monochrome: 8)
     source: mediaRule
@@ -42,10 +46,12 @@ mediaRule #4
         mediaExpression #0
             feature: min-width
             value: 20em
+            computed length: 320
     mediaQuery #1
         mediaExpression #0
             feature: min-width
             value: 20em
+            computed length: 320
 mediaRule #5
     text: not all
     source: mediaRule
@@ -59,6 +65,7 @@ mediaRule #6
         mediaExpression #0
             feature: min-width
             value: 8.5in
+            computed length: 816
 mediaRule #7
     text: screen and (device-aspect-ratio: 16/9), screen and (device-aspect-ratio: 16/10)
     source: mediaRule

third_party/WebKit/LayoutTests/inspector-protocol/css/css-get-media-queries.html

@@ -40,6 +40,8 @@ function test()
                     InspectorTest.log("        mediaExpression #" + k);
                     InspectorTest.log("            feature: " + expression.feature);
                     InspectorTest.log("            value: " + expression.value + expression.unit);
+                    if (expression.computedLength)
+                        InspectorTest.log("            computed length: " + expression.computedLength);
                 }
             }
         }

third_party/WebKit/Source/core/inspector/InspectorCSSAgent.cpp

@@ -40,6 +40,7 @@
 #include "core/css/CSSStyleSheet.h"
 #include "core/css/MediaList.h"
 #include "core/css/MediaQuery.h"
+#include "core/css/MediaValues.h"
 #include "core/css/StylePropertySet.h"
 #include "core/css/StyleRule.h"
 #include "core/css/StyleSheet.h"
@@ -978,6 +979,11 @@ PassRefPtr<TypeBuilder::CSS::CSSMedia> InspectorCSSAgent::buildMediaObject(const
                 .setValue(expValue.value)
                 .setUnit(String(valueName))
                 .setFeature(mediaQueryExp->mediaFeature());
+            RefPtr<MediaValues> mediaValues = MediaValues::createDynamicIfFrameExists(parentStyleSheet->ownerDocument()->frame());
+            int computedLength;
+            if (mediaValues->computeLength(expValue.value, expValue.unit, computedLength))
+                mediaQueryExpression->setComputedLength(computedLength);
+
             expressionArray->addItem(mediaQueryExpression);
             hasExpressionItems = true;
         }

third_party/WebKit/Source/devtools/protocol.json

@@ -2612,7 +2612,8 @@
                 "properties": [
                     { "name": "value", "type": "number", "description": "Media query expression value."},
                     { "name": "unit", "type": "string", "description": "Media query expression units."},
-                    { "name": "feature", "type": "string", "description": "Media query expression feature."}
+                    { "name": "feature", "type": "string", "description": "Media query expression feature."},
+                    { "name": "computedLength", "type": "number", "optional": true, "description": "Computed length of media query expression (if applicable)."}
                 ],
                 "description": "Media query expression data.",
                 "hidden": true