| const els = document.querySelectorAll('.test-el'); |
| const key = "{{GET[key]}}"; |
| const keyRaw = keyMapping[key] || key; |
| const expectedData = key === "Enter" ? "\n" : key; |
| const selectionStart = {{GET[selectionStart]}}; |
| const selectionEnd = {{GET[selectionEnd]}}; |
| const expectedValue = "{{GET[expectedValue]}}"; |
| |
| for (const el of els) { |
| promise_test(t => { |
| return new Promise((resolve, reject) => { |
| let beforeinputEvents = 0; |
| let textInputEvents = 0; |
| el.addEventListener('beforeinput', t.step_func(e => { |
| beforeinputEvents++; |
| })); |
| el.addEventListener('textInput', t.step_func(e => { |
| textInputEvents++; |
| assert_equals(beforeinputEvents, 1); |
| assert_equals(e.data, expectedData); |
| assert_true(e.bubbles); |
| assert_true(e.cancelable); |
| assert_equals(e.view, window); |
| assert_equals(e.detail, 0); |
| assert_true(e instanceof window.TextEvent); |
| })); |
| el.addEventListener('input', t.step_func(e => { |
| assert_equals(textInputEvents, 1); |
| if (expectedValue === "\n" && !(el instanceof HTMLInputElement) && !(el instanceof HTMLTextAreaElement)) { |
| // New paragraph in contenteditable during editing is weird. |
| // innerHTML is <div><br></div><div><br></div> |
| // ...but later changes to <br> |
| // So, check that there's at least one <br>. |
| assert_true(getValue(el).indexOf('<br>') > -1); |
| } else { |
| assert_equals(getValue(el), expectedValue); |
| } |
| resolve(); |
| })); |
| el.onfocus = t.step_func(e => { |
| if (window.test_driver) { |
| test_driver.send_keys(el, keyRaw); |
| } |
| }); |
| el.focus(); |
| setSelection(el, selectionStart, selectionEnd); |
| }); |
| }, `${document.title}, ${elDesc(el)}`); |
| } |