| <!doctype html> |
| <title>MediaQueryList.changed is correct for all lists in the document even during a change event handler</title> |
| <link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez"> |
| <link rel="author" href="https://mozilla.org" title="Mozilla"> |
| <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1648839"> |
| <link rel="help" href="https://drafts.csswg.org/cssom-view/#evaluate-media-queries-and-report-changes"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="resources/matchMedia.js"></script> |
| <body> |
| <script> |
| promise_test(async t => { |
| // Create two identical media queries. |
| let mql = await createMQL(t); |
| let mql2 = getWindow(mql).matchMedia(mql.media); |
| |
| let changeEvents = 0; |
| |
| let check = t.step_func(function() { |
| changeEvents++; |
| assert_equals(mql.matches, mql2.matches, "Value of .matches should match"); // No pun intended |
| }); |
| |
| mql.addListener(check); |
| mql2.addListener(check); |
| |
| triggerMQLEvent(mql); |
| await waitForChangesReported(); |
| |
| assert_equals(changeEvents, 2, "Should've fired the change event in both MediaQueryLists"); |
| }); |
| </script> |
