<!DOCTYPE html>
<meta name=fuzzy content="maxDifference=0-3; totalPixels=0-100">
<html>
<head>
<script src="../resources/common.js"></script>
<script src="../resources/picker-common.js"></script>
</head>
<body>
<select id="menu">
<option>foo</option>
<option selected>bar</option>
<option style="font-size:8px;">qux</option>
<option style="font-size:40px;">baz</option>
<optgroup label="Group1">
<option>Item 5</option>
<option>Item 6</option>
</optgroup>
</select>
<style>
select {
appearance: none;
padding: 1px 16px 1px 4px;
}
select:focus-visible {
outline: none;
}
</style>
<script>
function touchOn(selector) {
return new Promise((resolve, reject) => {
let pos = elementCenterPosition(document.querySelector(selector));
chrome.gpuBenchmarking.pointerActionSequence([{source:'touch', actions: [
{name:'pointerDown', x:pos[0], y:pos[1]},
{name:'pointerUp'}]}], resolve);
});
}
function popup() {
return new Promise((resolve, reject) => {
internals.pagePopupWindow = internals.pagePopupWindow;
setPopupOpenCallback(resolve);
});
}
async function openPickerByTouch() {
testRunner.waitUntilDone();
await touchOn('#menu');
await popup();
testRunner.notifyDone();
}
openPickerByTouch();
</script>
</body>
</html>