How to clear text input?
Question
I've been trying to fix this issue for a while now, none of the existing questions help. I'm using the node implementation of Selenium WebDriver , version ^4.0.0-alpha.1 and testing it on Chrome using the latest ChromeDriver.
I'm trying to clear the text of an <input/> , whose type="email" . WebDriver has a built in command for this, but when I execute it the input doesn't clear (and there's no error):
// This populates the text field, no problem
driver.findElement(By.id("model-auth-email")).sendKeys("test@gmail.com");
// This is executed without error, but nothing happens, text field isn't cleared
driver.findElement(By.id("model-auth-email")).clear();
I can't use the CTRL + a & BACKSPACE method since I'm using a Mac and it would be CMD + a . And ChromeDriver has had (still unresolved) issues supporting the native OSX CMD button input for like 6 years, according the various threads I could find.
I could also do something like loop BACKSPACE inputs until it's cleared, though that's pretty hacky.
Any ideas on why .clear() is silently not working?
3 answers
solution1
2 2020-12-01 20:38:48
我有同样的问题， .clear() 或 CTRL+'a' 对我不起作用，这个工作得很好：
driver.execute_script("arguments[0].value = '';", text_input)
solution2
1 2019-09-19 16:45:44
What seems to be working for us is to:
- Use JavaScript to execute the
select()method of the<input>element. - Then use Selenium WebDriver to send a BACKSPACE key.
Here's a clear function that will do just that:
async function clear(drv, web_elt) {
await drv.executeScript(elt => elt.select(), web_elt);
await web_elt.sendKeys(Key.BACK_SPACE);
}
Whereby:
-
drvis an instance ofWebDriver web_eltis an instance ofWebElement- The anonymous function in
executeScriptis stringified and receives the<input>element wrapped inweb_eltas a parameter
Find below a demo and the full code for it.
This is running on Node.js 11 with selenium-webdriver v4.
Make sure your chromedriver is in your PATH then run node index.js
// index.js
const path = require('path');
const wd = require('selenium-webdriver');
const {Key} = wd;
const driver =
(new wd.Builder)
.forBrowser(wd.Browser.CHROME)
.build();
async function clear(drv, web_elt) {
await drv.executeScript(elt => elt.select(), web_elt);
await web_elt.sendKeys(Key.BACK_SPACE);
}
async function run(drv) {
await drv.get('file://' + path.join(__dirname, 'index.html'));
await drv.sleep(1000);
await clear(drv, drv.findElement({css: 'input'}));
await drv.sleep(1000);
await clear(drv, drv.findElement({css: 'textarea'}));
await drv.sleep(1000);
await drv.quit();
}
run(driver);
<!-- index.html -->
<html>
<body>
<p>
<input type="text" value="Hello World!"/>
</p>
<p>
<textarea cols="30" rows="10">Hello World!</textarea>
</p>
</body>
</html>
solution3
0 2018-12-10 00:44:12
From Webdriver document, findElement will return a promise, so you can try:
driver.findElement(By.id("model-auth-email"))
.then((el) => {
el.clear()
})
.catch(e => {
throw e;
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.