Show custom properties in the computed style pane of the inspector.

third_party/WebKit/LayoutTests/inspector/elements/styles-3/styles-variables-expected.txt

Index: third_party/WebKit/LayoutTests/inspector/elements/styles-3/styles-variables-expected.txt
diff --git a/third_party/WebKit/LayoutTests/inspector/elements/styles-3/styles-variables-expected.txt b/third_party/WebKit/LayoutTests/inspector/elements/styles-3/styles-variables-expected.txt
new file mode 100644
index 0000000000000000000000000000000000000000..8b205cc7065bd527b18c7656cc34a8b1d8ea6dd2
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/inspector/elements/styles-3/styles-variables-expected.txt
@@ -0,0 +1,62 @@
+Tests that computed styles expand and allow tracing to style rules.
+
+==== Computed style for ID1 ====
+--b:  44px
+     44px - #id1 styles-variables.html:14 -> styles-variables.html:14:1

[pfeldman, 2015/12/16 00:44:16]

This test is going to be vulnerable to changes unrelated to css variables. Can
we trim everything that is not related?

+background-attachment: scroll
+    initial - #id1 styles-variables.html:25 -> styles-variables.html:25:1
+background-clip: border-box
+    initial - #id1 styles-variables.html:25 -> styles-variables.html:25:1
+background-color: rgb(128, 128, 128)
+    grey - #id1 styles-variables.html:25 -> styles-variables.html:25:1
+    OVERLOADED black - #id1 styles-variables.html:20 -> styles-variables.html:20:1
+    OVERLOADED green - #id1 styles-variables.html:14 -> styles-variables.html:14:1
+background-image: none
+    initial - #id1 styles-variables.html:25 -> styles-variables.html:25:1
+background-origin: padding-box
+    initial - #id1 styles-variables.html:25 -> styles-variables.html:25:1
+background-size: auto
+    initial - #id1 styles-variables.html:25 -> styles-variables.html:25:1
+display: block
+    block - div user agent stylesheet
+font-family: Courier
+    Courier - #id1 styles-variables.html:20 -> styles-variables.html:20:1
+    OVERLOADED Times - #id1 styles-variables.html:14 -> styles-variables.html:14:1
+    OVERLOADED Arial - body styles-variables.html:4 -> styles-variables.html:4:1
+text-decoration: underline solid rgb(0, 0, 0)
+    underline - div styles-variables.html:10 -> styles-variables.html:10:1
+text-decoration-color: rgb(0, 0, 0)
+    initial - div styles-variables.html:10 -> styles-variables.html:10:1
+text-decoration-line: underline
+    underline - div styles-variables.html:10 -> styles-variables.html:10:1
+text-decoration-style: solid
+    initial - div styles-variables.html:10 -> styles-variables.html:10:1
+[expanded] 
+element.style { ()
+
+value of --a:  red
+==== Computed style for ID2 ====
+--a:  green
+     green - #id2 styles-variables.html:29 -> styles-variables.html:29:1
+background-color: rgb(0, 0, 255)
+    blue - #id2 styles-variables.html:29 -> styles-variables.html:29:1
+display: block
+    block - div user agent stylesheet
+font-family: Courier
+    Courier - #id2 styles-variables.html:29 -> styles-variables.html:29:1
+    OVERLOADED Courier - #id1 styles-variables.html:20 -> styles-variables.html:20:1
+    OVERLOADED Times - #id1 styles-variables.html:14 -> styles-variables.html:14:1
+    OVERLOADED Arial - body styles-variables.html:4 -> styles-variables.html:4:1
+text-decoration: underline solid rgb(0, 0, 0)
+    underline - div styles-variables.html:10 -> styles-variables.html:10:1
+text-decoration-color: rgb(0, 0, 0)
+    initial - div styles-variables.html:10 -> styles-variables.html:10:1
+text-decoration-line: underline
+    underline - div styles-variables.html:10 -> styles-variables.html:10:1
+text-decoration-style: solid
+    initial - div styles-variables.html:10 -> styles-variables.html:10:1
+[expanded] 
+element.style { ()
+
+value of --b:  44px
+