1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
|
<!DOCTYPE html>
<meta charset="utf-8" />
<meta viewport="width=device-width, initial-scale=1" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<script type="module">
import {
attachIframe,
makeCleanup,
getOppositeOrientation,
} from "./resources/orientation-utils.js";
promise_test(async (t) => {
t.add_cleanup(makeCleanup());
await test_driver.bless("request fullscreen");
await document.documentElement.requestFullscreen();
let orientations = ["portrait", "landscape"];
if (screen.orientation.type.includes("portrait")) {
orientations = orientations.reverse();
}
const messageWatcher = new EventWatcher(t, window, "message");
const changeWatcher = new EventWatcher(t, screen.orientation, "change");
const iframe = await attachIframe({
src: "resources/iframe-listen-orientation-change.html",
sandbox: "allow-scripts allow-same-origin",
});
for (const orientation of orientations) {
const messagePromise = messageWatcher.wait_for("message");
const eventPromise = changeWatcher.wait_for("change");
await screen.orientation.lock(orientation);
const winner = await Promise.race([eventPromise, messagePromise]);
assert_true(winner instanceof Event, "change event must be fired first");
const message = await messagePromise;
assert_true(
message.data.startsWith(orientation),
"subframe receives orientation change event"
);
}
iframe.remove();
}, "Test subframes receive orientation change events");
promise_test(async (t) => {
t.add_cleanup(makeCleanup());
const iframe = await attachIframe();
let opposite = getOppositeOrientation();
// Fail fast in case the API is not supported
await test_driver.bless("request fullscreen", null, iframe.contentWindow);
await iframe.contentDocument.documentElement.requestFullscreen();
await iframe.contentWindow.screen.orientation.lock(opposite);
iframe.contentWindow.screen.orientation.unlock();
opposite = getOppositeOrientation();
const topEventPromise = new EventWatcher(
t,
screen.orientation,
"change"
).wait_for("change");
const iframeEventPromise = new EventWatcher(
t,
iframe.contentWindow.screen.orientation,
"change"
).wait_for("change");
// Lock from the iframe
await test_driver.bless("request fullscreen", null, iframe.contentWindow);
await iframe.contentDocument.documentElement.requestFullscreen();
const lockPromise = iframe.contentWindow.screen.orientation.lock(opposite);
const winningEvent = await Promise.race([
topEventPromise,
iframeEventPromise,
]);
assert_true(
winningEvent instanceof window.Event,
"top-level change event must be fired first"
);
const iframeEvent = await iframeEventPromise;
assert_true(
iframeEvent instanceof iframe.contentWindow.Event,
"iframe event eventually fires"
);
await lockPromise;
iframe.remove();
}, "Check directly that events are fired in right order (from top to bottom)");
</script>
|