clearValue method doesn't work at all

Environment (please complete the following information):

**WebdriverIO version: 5.12.5
**Mode: chromedriver
If WDIO Testrunner, running sync/async: sync
**Node.js version: v10
**NPM version: 6.4.1
Browser name and version: Chrome 76
**Platform name and version: Windows
**Additional wdio packages used (if applicable): “@types/chai”: “^4.2.2”, “@types/mocha”: “^5.2.7”, “@types/node”: “^10.14.17”, “@wdio/cli”: “^5.12.5”, “@wdio/local-runner”: “^5.12.5”, “@wdio/mocha-framework”: “^5.12.1”, “@wdio/spec-reporter”: “^5.12.1”, “@wdio/sync”: “^5.12.3”, “wdio-chromedriver-service”: “^5.0.2”, “chromedriver”: “^76.0.1”, “chai”: “^4.2.0”, “mocha”: “^5.2.0”, “ts-node”: “^7.0.1”, “tsconfig-paths”: “^3.8.0”, “tslint”: “^5.19.0”, “typescript”: “^3.6.2”, “webdriverio”: “^5.12.5”

Config of WebdriverIO Example config from the official tutorial

Describe the bug After using setValue method to input text into ‘input’ element. It’s impossible to clear the value.

To Reproduce $('//input[@placeholder="Search…"]').setValue(term); $('//input[@placeholder="Search…"]').clearValue();

$('//input[@placeholder="Search…"]').setValue(term); $('//input[@placeholder="Search…"]').click(); $('//input[@placeholder="Search…"]').clearValue();

Expected behavior As documentation says:

Clear a <textarea> or text element’s value. Make sure you can interact with the element before using this command. You can’t clear an input element that is disabled or in readonly mode.

Issue Analytics

State:
Created 4 years ago
Reactions:5
Comments:20 (7 by maintainers)

Top GitHub Comments

21reactions

LilyGistcommented, Jul 2, 2021

I was having this issue on a React frontend but I was able to get it to work by first clicking the field and then using browser.execute(), like this:

selector.click();
browser.execute(s => {
    s.value = null;
},selector);
selector.setValue('value');

I also had the backspace approach working like this, but the other way seemed a little simpler:

const selectorValue = selector.getValue();
const backSpaces = new Array(selectorValue.length).fill('Backspace');
selector.setValue(backSpaces);
selector.setValue('value');

11reactions

buobcommented, Oct 17, 2019

Not sure if the OP was running into the same thing we were, but I want to post this in case anyone else finds this. clearValue is implemented with input.value = "", which if it’s a controlled input will be wiped on the next render with whatever is in the state. #gotcha