Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(423)

Unified Diff: LayoutTests/compositing/will-change/parse-will-change.html

Issue 167603002: Implement 'will-change' parsing (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 6 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: LayoutTests/compositing/will-change/parse-will-change.html
diff --git a/LayoutTests/compositing/will-change/parse-will-change.html b/LayoutTests/compositing/will-change/parse-will-change.html
new file mode 100644
index 0000000000000000000000000000000000000000..0824a9516e027a903f80f30998e5e503f243ac81
--- /dev/null
+++ b/LayoutTests/compositing/will-change/parse-will-change.html
@@ -0,0 +1,146 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+#willChangeOpacity {
+ will-change: opacity;
+}
+
+#willChangeScrollPosition {
+ will-change: scroll-position;
+}
+
+#willChangeContents {
+ will-change: contents;
+}
+
+#willChangeMultiple {
+ will-change: opacity, contents, left, -webkit-transform;
+}
+
+#willChangeWithArbitraryIdent {
+ will-change: opacity, i-am-not-a-property, top;
+}
+
+</style>
+<script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<div id="willChangeOpacity"></div>
+<div id="willChangeScrollPosition"></div>
+<div id="willChangeContents"></div>
+<div id="willChangeMultiple"></div>
+<div id="willChangeWithArbitraryIdent"></div>
+<script>
+description('Test that setting and getting will-change works as expected');
+
+debug("Test getting will-change set through CSS");
+var willChangeOpacity = document.getElementById("willChangeOpacity");
+shouldBe("getComputedStyle(willChangeOpacity, '').getPropertyValue('will-change')", "'opacity'");
+
+var willChangeScrollPosition = document.getElementById("willChangeScrollPosition");
+shouldBe("getComputedStyle(willChangeScrollPosition, '').getPropertyValue('will-change')", "'scroll-position'");
+
+var willChangeContents = document.getElementById("willChangeContents");
+shouldBe("getComputedStyle(willChangeContents, '').getPropertyValue('will-change')", "'contents'");
+
+var willChangeMultiple = document.getElementById("willChangeMultiple");
+shouldBe("getComputedStyle(willChangeMultiple, '').getPropertyValue('will-change')", "'contents, opacity, left, -webkit-transform'");
+
+var willChangeContents = document.getElementById("willChangeWithArbitraryIdent");
+shouldBe("getComputedStyle(willChangeWithArbitraryIdent, '').getPropertyValue('will-change')", "'opacity, top'");
+
+debug("");
+debug("Test initial value of will-change");
+var element = document.createElement("div");
+document.body.appendChild(element);
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+debug("");
+debug("Test getting and setting will-change through JS");
+element = document.createElement("div");
+document.body.appendChild(element);
+element.style.willChange = "opacity";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'opacity'");
+
+element.style.willChange = "scroll-position";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'scroll-position'");
+
+element.style.willChange = "contents";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'contents'");
+
+element.style.willChange = "contents, scroll-position, opacity, -webkit-transform";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'contents, scroll-position, opacity, -webkit-transform'");
+
+element.style.willChange = "i-am-not-a-property, opacity, top";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'opacity, top'");
+
+element.style.willChange = "opacity, i-am-not-a-property, top";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'opacity, top'");
+
+element.style.willChange = "opacity, top, i-am-not-a-property";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'opacity, top'");
+
+element.style.willChange = "i-am-not-a-property";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+debug("");
+debug("Test that illegal will-change values are disallowed");
+element.style.willChange = "auto";
+element.style.willChange = "opacity, will-change";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+element.style.willChange = "none";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+element.style.willChange = "none, opacity";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+element.style.willChange = "all";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+element.style.willChange = "all, opacity";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+element.style.willChange = "left, auto, top";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+element.style.willChange = "left, default";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+element.style.willChange = "initial, top";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+element.style.willChange = "top, inherit";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+debug("");
+debug("Test the value 'initial'");
+element.style.willChange = "opacity";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'opacity'");
+element.style.willChange = "initial";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+
+debug("");
+debug("Test the value 'inherit'");
+var parentElement = document.createElement("div");
+document.body.appendChild(parentElement);
+parentElement.style.willChange = "contents, opacity, top";
+shouldBe("getComputedStyle(parentElement, '').getPropertyValue('will-change')", "'contents, opacity, top'");
+element = document.createElement("div");
+parentElement.appendChild(element);
+element.style.willChange = "inherit";
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'contents, opacity, top'");
+
+debug("");
+debug("Test that will-change is not inherited by default");
+var parentElement = document.createElement("div");
+document.body.appendChild(parentElement);
+parentElement.style.willChange = "opacity";
+shouldBe("getComputedStyle(parentElement, '').getPropertyValue('will-change')", "'opacity'");
+element = document.createElement("div");
+parentElement.appendChild(element);
+shouldBe("getComputedStyle(element, '').getPropertyValue('will-change')", "'auto'");
+</script>
+</body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698