Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / fast / scroll-behavior / parse-scroll-behavior.html
blob1d4df1af5d4e5fe3c1ed83e79c63ba05025d1f26
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <style>
5 #scrollBehaviorAuto {
6 scroll-behavior: auto;
9 #scrollBehaviorSmooth {
10 scroll-behavior: smooth;
12 </style>
13 <script src="../../resources/js-test.js"></script>
14 </head>
15 <body>
16 <div id="scrollBehaviorAuto"></div>
17 <div id="scrollBehaviorSmooth"></div>
18 <script>
19 description('Test that setting and getting scroll-behavior works as expected');
21 debug("Test getting scroll-behavior set through CSS");
22 var scrollBehaviorAuto = document.getElementById("scrollBehaviorAuto");
23 shouldBe("getComputedStyle(scrollBehaviorAuto, '').getPropertyValue('scroll-behavior')", "'auto'");
25 var scrollBehaviorSmooth = document.getElementById("scrollBehaviorSmooth");
26 shouldBe("getComputedStyle(scrollBehaviorSmooth, '').getPropertyValue('scroll-behavior')", "'smooth'");
28 debug("");
29 debug("Test initial value of scroll-behavior");
30 var element = document.createElement("div");
31 document.body.appendChild(element);
32 shouldBe("getComputedStyle(element, '').getPropertyValue('scroll-behavior')", "'auto'");
34 debug("");
35 debug("Test getting and setting scroll-behavior through JS");
36 element = document.createElement("div");
37 document.body.appendChild(element);
38 element.style.scrollBehavior = "smooth";
39 shouldBe("getComputedStyle(element, '').getPropertyValue('scroll-behavior')", "'smooth'");
41 element.style.scrollBehavior = "auto";
42 shouldBe("getComputedStyle(element, '').getPropertyValue('scroll-behavior')", "'auto'");
44 debug("");
45 debug("Test the value 'initial'");
46 element.style.scrollBehavior = "smooth";
47 shouldBe("getComputedStyle(element, '').getPropertyValue('scroll-behavior')", "'smooth'");
48 element.style.scrollBehavior = "initial";
49 shouldBe("getComputedStyle(element, '').getPropertyValue('scroll-behavior')", "'auto'");
51 debug("");
52 debug("Test the value 'inherit'");
53 var parentElement = document.createElement("div");
54 document.body.appendChild(parentElement);
55 parentElement.style.scrollBehavior = "smooth";
56 shouldBe("getComputedStyle(parentElement, '').getPropertyValue('scroll-behavior')", "'smooth'");
57 element = document.createElement("div");
58 parentElement.appendChild(element);
59 element.style.scrollBehavior = "inherit";
60 shouldBe("getComputedStyle(element, '').getPropertyValue('scroll-behavior')", "'smooth'");
62 debug("");
63 debug("Test that scroll-behavior is not inherited by default");
64 var parentElement = document.createElement("div");
65 document.body.appendChild(parentElement);
66 parentElement.style.scrollBehavior = "smooth";
67 shouldBe("getComputedStyle(parentElement, '').getPropertyValue('scroll-behavior')", "'smooth'");
68 element = document.createElement("div");
69 parentElement.appendChild(element);
70 shouldBe("getComputedStyle(element, '').getPropertyValue('scroll-behavior')", "'auto'");
71 </script>
72 </body>
73 </html>