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
|
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Event Timing: entries should be observable by its own frame.
</title>
<script src=./resources/event-timing-support.js></script>
</head>
<body>
<h2>Description:</h2>
<p>
<div>
The goal of this manual test is to verify that observers that have
registered "event" entry type can observe the long-latency input events,
and verify the same behavior within iframe and in cross-frame scenario.
</div>
</p>
<h2>Manual test steps:</h2>
<p>
<div>
Step 1: Click the "make busy" button to make main-thread busy for 2 seconds.</span>
</div>
<div>
Step 2: do several clicks on "click while busy" while busy to generate long-latency inputs.
</div>
<div>
Step 3: observe in the "timeline" section that the long-latency clicks are captured by the observer.
</div>
<div>
Step 4: do step 1 to step 3 for the iframe. Observe that the observers only observe input events within its frame.
</div>
</p>
<div>
<h2>Actions:</h2>
<button id='busy_button' onclick='onMakeBusy()'>make busy</button>
<button id='click_input_button' onclick='1'> click while busy </button>
</div>
<h2>iframe:</h2>
<div>
<iframe name='childframe' width="100%" height="30%" src=./resources/event-timing-observer-manual-childframe.html></iframe>
</div>
<h2>Timeline:</h2>
<p id='timeline'></p>
</body>
<script>
function log(message) {
const timestamp = performance.now();
const elem = document.createElement('div');
elem.innerHTML = `${timestamp.toFixed(1)}: ${message}`;
const timeline = document.getElementById('timeline');
timeline.appendChild(elem);
}
function onMakeBusy() {
log("busy start");
step_timeout(()=>{
mainThreadBusy(2000);
log("busy end");
}, 0);
}
document.body.onload = () => {
new PerformanceObserver((entryList) => {
entryList.getEntries().forEach(e => {
log(`entry observed: ${JSON.stringify(e)}`);
});
}).observe({ entryTypes: ['event'] });
log("observer registered");
};
window.onmessage = (msg) => {
log("received msg: " + msg.data);
if (msg.data === 'CHILD_FRAME_IS_READY') {
// TODO(crbug/831729): automate clicks on iframe when testdriver support
// clicking in iframe.
}
};
</script>
</html>
|
