Source code
Revision control
Copy as Markdown
Other Tools
Test Info: Warnings
- This test has a WPT meta file that expects 2 subtest issues.
- This WPT test may be referenced by the following Test IDs:
- /pointerevents/compat/pointerevent_touch-action-verification.html - WPT Dashboard Interop Dashboard
<!doctype html>
<html>
<head>
<!-- This file tests the additional touch-action values that are not in the main spec
but are mostly implemented by browsers. It should be integrated into main test
suite when they are accepted into the specification. -->
<title>touch-action: basic verification</title>
<meta name="assert" content="The touch-action CSS property determines whether touch input MAY trigger default behavior supplied by the user agent.
pinch-zoom: The user agent MAY consider touches that begin on the element only for the purposes of zooming in and out.
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../pointerevent_styles.css">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
</head>
<body onload="run()">
<h2>Pointer Events touch-action attribute support</h2>
<h4 id="desc">Test Description: Test will automatically check parsing behaviour of various touch-action combinations.</h4>
<script type='text/javascript'>
var detected_pointertypes = {};
setup({ explicit_done: true });
function run() {
var tests = document.querySelectorAll('.test');
//TA 15.20
for (var i = 0; i < tests.length; i++) {
test(function() {
var style = window.getComputedStyle(tests[i]);
assert_equals(tests[i].attributes.expected.value, style.touchAction);
}, tests[i].id);
}
done();
}
</script>
<h1>touch-action: basic verification</h1>
<div id="complete-notice">
<p>The following pointer types were detected: <span id="pointertype-log"></span>.</p>
</div>
<div id="log"></div>
<div class="test" id="explicit-pinch-zoom" style="touch-action: pinch-zoom;" expected="pinch-zoom"></div>
<div class="test" id="explicit-pinch-zoom-pan-x-pan-up" style="touch-action: pinch-zoom pan-x pan-up;" expected="pan-x pan-up pinch-zoom"></div>
<div class="test" id="explicit-pinch-zoom-pan-x-pan-y" style="touch-action: pinch-zoom pan-x pan-y;" expected="manipulation"></div>
<div class="test" id="explicit-invalid-14" style="touch-action: pinch-zoom none;" expected="auto"></div>
</body>
</html>