Index: LayoutTests/fast/media/media-query-list-listener-ordering.html |
diff --git a/LayoutTests/fast/media/media-query-list-listener-ordering.html b/LayoutTests/fast/media/media-query-list-listener-ordering.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..5eaa8351c9802244b9a76e4912467219f7c394f0 |
--- /dev/null |
+++ b/LayoutTests/fast/media/media-query-list-listener-ordering.html |
@@ -0,0 +1,40 @@ |
+<!DOCTYPE html> |
+<script src="../../resources/js-test.js"></script> |
+ |
+<div id="sandbox"></div> |
+ |
+<script> |
+ description("Media query listeners should fire grouped by the MediaQueryList."); |
+ |
+ var sandbox = document.getElementById("sandbox"); |
+ var iframe = document.createElement("iframe"); |
+ sandbox.appendChild(iframe); |
+ |
+ var matchMedia = iframe.contentWindow.matchMedia; |
+ var mediaList1 = matchMedia("(max-width: 100px)"); |
+ var mediaList2 = matchMedia("(max-width: 100px)"); |
+ var mediaList3 = matchMedia("(max-width: 100px)"); |
+ |
+ var listenersCalled = []; |
+ |
+ function makeListener(label) { |
+ return function() { listenersCalled.push(label); }; |
+ } |
+ |
+ mediaList3.addListener(makeListener("mediaList3_1")); |
+ mediaList2.addListener(makeListener("mediaList2_1")); |
+ mediaList1.addListener(makeListener("mediaList1_1")); |
+ mediaList2.addListener(makeListener("mediaList2_2")); |
+ |
+ shouldBe("mediaList1.matches", "true"); |
+ shouldBe("mediaList2.matches", "true"); |
+ shouldBe("mediaList3.matches", "true"); |
+ |
+ // FIXME: You shouldn't need to touch offsetTop to force these updates. |
+ |
+ iframe.style.width = "200px"; |
+ iframe.offsetTop; |
+ |
+ var expectedResult = ["mediaList1_1", "mediaList2_1", "mediaList2_2", "mediaList3_1"]; |
+ shouldBe("listenersCalled", "expectedResult"); |
+</script> |