| <!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] --> |
| <html> |
| <head> |
| <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> |
| <script src="../../../resources/js-test.js"></script> |
| <script src="../../../resources/ui-helper.js"></script> |
| </head> |
| <body> |
| <input inputmode="none"> |
| <script> |
| |
| description(`This tests removing inputmode="none" from an input element after the element was focused.<br> |
| To manually test, detach a hardware keyboard and tap on the text field below. The software keyboard should come up.`); |
| |
| jsTestIsAsync = true; |
| |
| const input = document.querySelector('input'); |
| if (window.testRunner) |
| window.onload = runTest; |
| else |
| input.addEventListener('click', () => this.removeAttribute('inputmode')); |
| |
| let systemKeyboardRect; |
| async function runTest() { |
| await UIHelper.setHardwareKeyboardAttached(false); |
| |
| // We insert a dummy input element to detect when the keyboard hides for an input element with inputmode="none". |
| const dummyInput = document.createElement('input'); |
| document.body.appendChild(dummyInput); |
| await UIHelper.activateElementAndWaitForInputSession(dummyInput); |
| |
| debug("\nACTIVATE input with inputmode=none"); |
| input.focus(); |
| await UIHelper.activateElement(input); |
| await UIHelper.waitForKeyboardToHide(); |
| systemKeyboardRect = await UIHelper.inputViewBounds(); |
| shouldBe("systemKeyboardRect.height", "0"); |
| |
| await UIHelper.enterText("hello,"); |
| shouldBeEqualToString("input.value", "hello,"); |
| |
| debug("\nRemoving inputmode=none"); |
| input.removeAttribute('inputmode'); |
| |
| await new Promise((resolve) => { |
| window.visualViewport.addEventListener('resize', resolve); |
| setTimeout(resolve, 3000); // Failed. |
| }); |
| |
| systemKeyboardRect = await UIHelper.inputViewBounds(); |
| shouldBeTrue("systemKeyboardRect.height > 0"); |
| |
| await UIHelper.enterText(" world"); |
| shouldBeEqualToString("input.value", "hello, world"); |
| |
| finishJSTest(); |
| } |
| |
| </script> |
| </body> |
| </html> |
