| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../resources/ui-helper.js"></script> |
| </head> |
| |
| <div>To manually test, press and hold down 'a' and select one of the accented characters.</div> |
| <div>You should observe that the replacement accented character does not replace 'a'.</div> |
| <div>Then insert an emoji using the emoji picker. This should insert something into the editor.</div> |
| <div>Finally, select all the content and attempt to replace it with an emoji. This should do nothing.</div> |
| <div id="editable" onbeforeinput=handleInputEvent(event) oninput=handleInputEvent(event) contenteditable></div> |
| <div id="output"></div> |
| |
| <script type="text/javascript"> |
| let write = s => output.innerHTML += s + "<br>"; |
| editable.focus(); |
| |
| if (window.testRunner && window.eventSender && testRunner.runUIScript) { |
| testRunner.dumpAsText(); |
| testRunner.waitUntilDone(); |
| runTest(); |
| } |
| |
| async function runTest() { |
| write("(1) Typing 'a'..."); |
| eventSender.keyDown("a"); |
| write(`The editor now has text content: ${editable.textContent}`); |
| write("(2) Preventing default when replacing 'a' with 'b'..."); |
| await UIHelper.replaceTextAtRange("b", 0, 1) |
| write(`The editor now has text content: ${editable.textContent}`); |
| write("(3) Inserting 'c' after 'a'..."); |
| await UIHelper.replaceTextAtRange("c", 1, 0); |
| write(`The editor now has text content: ${editable.textContent}`); |
| write("(4) Selecting all and preventing replacement with 'd'..."); |
| document.execCommand("SelectAll") |
| await UIHelper.replaceTextAtRange("d", 0, 2); |
| write(`The editor now has text content: ${editable.textContent}`); |
| |
| testRunner.notifyDone(); |
| } |
| |
| function handleInputEvent(event) |
| { |
| let dataTransferString = event.dataTransfer ? `plain:"${event.dataTransfer.getData('text/plain')}", html:"${event.dataTransfer.getData('text/html')}"` : "(null)"; |
| write(`(${event.target.id}): type=${event.type}, inputType=${event.inputType}, data=${event.data}, dataTransfer=${dataTransferString}`); |
| |
| if (event.type === "beforeinput" && event.inputType === "insertReplacementText") |
| event.preventDefault(); |
| } |
| </script> |
| </body> |
| </html> |