Commit 79a6ade9 authored by tkent's avatar tkent Committed by Commit bot

Convert radio-group-keyboard-change-event.html to a testharness.js test.

It was a dumpAsText() test without js-test.js.
This CL has no behavior changes.

Review URL: https://codereview.chromium.org/1813583002

Cr-Commit-Position: refs/heads/master@{#381663}
parent 61ec142f
Test for https://bugs.webkit.org/show_bug.cgi?id=32013.
For manual testing, focus a radio button in the first group and use the arrow keys. Changing the checked radio button should fire change events.
a b c
For manual testing, focus a radio button in the second group and use the arrow keys. Change events should still be dispatched but the checked radio should not change.
d e f
Test for https://code.google.com/p/chromium/issues/detail?id=556677.
For manual testing, focus a radio button in the first group and use the arrow keys. Changing the radio button should fire change events in the direction of left to right.
x y z
b dispatched change event
c dispatched change event
PASS: a is not checked
PASS: b is not checked
PASS: c is checked
PASS: d is checked
PASS: e is not checked
PASS: f is not checked
z dispatched change event
y dispatched change event
PASS: x is not checked
PASS: y is checked
PASS: z is not checked
PASS: x is not checked
PASS: y is checked
PASS: z is not checked
<!DOCTYPE html>
<html>
<body>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<div id="log"></div>
<p>Test for <a href="https://bugs.webkit.org/show_bug.cgi?id=32013">https://bugs.webkit.org/show_bug.cgi?id=32013</a>.
......@@ -8,17 +11,17 @@
radio button should fire change events.
<p>
<input type=radio name=aaa value=a checked onchange="handleChange(event)" onclick="handleClick(event)">a
<input type=radio name=aaa value=b onchange="handleChange(event)" onclick="handleClick(event)">b
<input type=radio name=aaa value=c onchange="handleChange(event)" onclick="handleClick(event)">c
<input type=radio name=aaa value=a checked onchange="handleChange(event)">a
<input type=radio name=aaa value=b onchange="handleChange(event)">b
<input type=radio name=aaa value=c onchange="handleChange(event)">c
<p>For manual testing, focus a radio button in the second group and use the arrow keys. Change events
should still be dispatched but the checked radio should not change.
<p>
<input type=radio name=bbb value=d checked onchange="handleChange(event)" onclick="handleClick(event)">d
<input type=radio name=bbb value=e onchange="handleChange(event)" onclick="handleClick(event)">e
<input type=radio name=bbb value=f onchange="handleChange(event)" onclick="handleClick(event)">f
<input type=radio name=bbb value=d checked onchange="handleChange(event)" onclick="preventClick(event)">d
<input type=radio name=bbb value=e onchange="handleChange(event)" onclick="preventClick(event)">e
<input type=radio name=bbb value=f onchange="handleChange(event)" onclick="preventClick(event)">f
<p>Test for <a href="https://code.google.com/p/chromium/issues/detail?id=556677">https://code.google.com/p/chromium/issues/detail?id=556677</a>.
......@@ -31,36 +34,18 @@ radio button should fire change events in the direction of left to right.
<input type=radio name=ccc value=y onchange="handleChange(event)"><span dir="rtl">y</span>
<input type=radio name=ccc value=z onchange="handleChange(event)"><span dir="rtl">z</span>
</div>
<pre id=out></pre>
<script>
var preventClickValues = 'def';
var lastChangeEventValue = null;
function handleChange(e)
{
var value = e.target.value;
print(value + ' dispatched change event');
}
function handleClick(e)
{
var value = e.target.value;
if (preventClickValues.indexOf(value) !== -1)
e.preventDefault();
lastChangeEventValue = e.target.value;
}
function print(s)
function preventClick(e)
{
document.getElementById('out').textContent += s + '\n';
}
function pass(s) {
print('PASS: ' + s);
}
function fail(s) {
print('FAIL: ' + s);
e.preventDefault();
}
function getRadio(value)
......@@ -68,60 +53,52 @@ function getRadio(value)
return document.querySelector('input[value="' + value + '"]');
}
function assertChecked(value)
{
if (getRadio(value).checked)
pass(value + ' is checked');
else
fail(value + ' should be checked');
}
function assertNotChecked(value)
{
if (!getRadio(value).checked)
pass(value + ' is not checked');
else
fail(value + ' should not be checked');
}
if (window.testRunner)
testRunner.dumpAsText();
if (window.eventSender) {
getRadio('a').focus();
eventSender.keyDown('downArrow');
eventSender.keyDown('downArrow');
getRadio('d').focus();
eventSender.keyDown('downArrow');
eventSender.keyDown('downArrow');
assertNotChecked('a');
assertNotChecked('b');
assertChecked('c');
assertChecked('d');
assertNotChecked('e');
assertNotChecked('f');
getRadio('x').focus();
eventSender.keyDown('rightArrow');
eventSender.keyDown('rightArrow');
assertNotChecked('x');
assertChecked('y');
assertNotChecked('z');
getRadio('x').focus();
eventSender.keyDown('downArrow');
assertNotChecked('x');
assertChecked('y');
assertNotChecked('z');
test(function() {
getRadio('a').focus();
eventSender.keyDown('downArrow');
assert_equals(lastChangeEventValue, 'b');
eventSender.keyDown('downArrow');
assert_equals(lastChangeEventValue, 'c');
assert_false(getRadio('a').checked);
assert_false(getRadio('b').checked);
assert_true(getRadio('c').checked);
}, 'Pressing an arrow key moves checked state in a radio button group.');
test(function() {
getRadio('d').focus();
eventSender.keyDown('downArrow');
eventSender.keyDown('downArrow');
assert_true(getRadio('d').checked);
assert_false(getRadio('e').checked);
assert_false(getRadio('f').checked);
}, 'Pressing an arrow key doesn\'t move checked state in a radio button group if click events are prevented.');
test(function() {
getRadio('x').focus();
eventSender.keyDown('rightArrow');
assert_equals(lastChangeEventValue, 'z');
assert_false(getRadio('x').checked);
assert_false(getRadio('y').checked);
assert_true(getRadio('z').checked);
eventSender.keyDown('rightArrow');
assert_equals(lastChangeEventValue, 'y');
assert_false(getRadio('x').checked);
assert_true(getRadio('y').checked);
assert_false(getRadio('z').checked);
}, 'Right arrow key should move checked state backward in RTL.');
test(function() {
getRadio('x').focus();
getRadio('x').checked = true;
eventSender.keyDown('downArrow');
assert_equals(lastChangeEventValue, 'y');
assert_false(getRadio('x').checked);
assert_true(getRadio('y').checked);
assert_false(getRadio('z').checked);
}, 'Down arrow key should move checked state forward regardless of RTL.');
}
</script>
</body>
</html>
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment