Chromium Code Reviews Chromium Code Reviews
Issue 1633553002:
Change in focus with movement of Arrow keys for RTL radio buttons (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master| OLD | NEW |
|---|---|
| (Empty) | |
| 1 <!DOCTYPE html> | |
|
tkent
2016/02/03 23:45:37
Probably you copied radio-group-keyboard-change-ev
chakshu
2016/02/08 09:46:39
Done.
| |
| 2 <html> | |
| 3 <body> | |
| 4 | |
| 5 <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>. | |
| 6 | |
| 7 <p>For manual testing, focus a radio button in the first group and use the arrow keys. Changing the | |
| 8 radio button should fire change events in the direction of left to right. | |
| 9 | |
| 10 <p> | |
| 11 <div dir="auto"> | |
| 12 <label><input type="radio" value="אחד" onchange="handleChange(event)" name=" r">אחד</label> | |
|
tkent
2016/02/03 23:45:37
I guess the text direction of these INPUT elements
chakshu
2016/02/08 09:46:39
Done.
| |
| 13 <label><input type="radio" value="שני" onchange="handleChange(event)" name=" r">שני</label> | |
| 14 <label><input type="radio" value="שלוש" onchange="handleChange(event)" name= "r">שלוש</label> | |
| 15 </div> | |
| 16 | |
| 17 <p>For manual testing, focus a radio button in the second group and use the arro w keys. Changing the | |
| 18 radio button should fire change events in the direction of left to right. | |
| 19 | |
| 20 <p> | |
| 21 <div dir="auto"> | |
| 22 <label><input type="radio" value="one" onchange="handleChange(event)" name=" l">one</label> | |
| 23 <label><input type="radio" value="two" onchange="handleChange(event)" name=" l">two</label> | |
| 24 <label><input type="radio" value="three" onchange="handleChange(event)" name ="l">three</label> | |
| 25 </div> | |
| 26 | |
| 27 <pre id=out></pre> | |
| 28 <script> | |
| 29 | |
| 30 function handleChange(e) | |
| 31 { | |
| 32 var value = e.target.value; | |
| 33 print(value + ' dispatched change event'); | |
| 34 } | |
| 35 | |
| 36 function print(s) | |
| 37 { | |
| 38 document.getElementById('out').textContent += s + '\n'; | |
| 39 } | |
| 40 | |
| 41 function pass(s) { | |
| 42 print('PASS: ' + s); | |
| 43 } | |
| 44 | |
| 45 function fail(s) { | |
| 46 print('FAIL: ' + s); | |
| 47 } | |
| 48 | |
| 49 function getRadio(value) | |
| 50 { | |
| 51 return document.querySelector('input[value="' + value + '"]'); | |
| 52 } | |
| 53 | |
| 54 function assertChecked(value) | |
| 55 { | |
| 56 if (getRadio(value).checked) | |
| 57 pass(value + ' is checked'); | |
| 58 else | |
| 59 fail(value + ' should be checked'); | |
| 60 } | |
| 61 | |
| 62 function assertNotChecked(value) | |
| 63 { | |
| 64 if (!getRadio(value).checked) | |
| 65 pass(value + ' is not checked'); | |
| 66 else | |
| 67 fail(value + ' should not be checked'); | |
| 68 } | |
| 69 | |
| 70 if (window.testRunner) | |
| 71 testRunner.dumpAsText(); | |
| 72 | |
| 73 if (window.eventSender) { | |
| 74 getRadio('אחד').focus(); | |
| 75 eventSender.keyDown('downArrow'); | |
| 76 | |
| 77 assertNotChecked('אחד'); | |
| 78 assertChecked('שני'); | |
| 79 assertNotChecked('שלוש'); | |
| 80 | |
| 81 eventSender.keyDown('downArrow'); | |
| 82 | |
| 83 assertNotChecked('אחד'); | |
| 84 assertNotChecked('שני'); | |
| 85 assertChecked('שלוש'); | |
| 86 | |
| 87 getRadio('one').focus(); | |
| 88 eventSender.keyDown('downArrow'); | |
| 89 | |
| 90 assertNotChecked('one'); | |
| 91 assertChecked('two'); | |
| 92 assertNotChecked('three'); | |
| 93 | |
| 94 eventSender.keyDown('downArrow'); | |
| 95 | |
| 96 assertNotChecked('one'); | |
| 97 assertNotChecked('two'); | |
| 98 assertChecked('three'); | |
| 99 } | |
| 100 | |
| 101 </script> | |
| 102 </body> | |
| 103 </html> | |
| OLD | NEW |
