How to delete the value from a field when wdio clearValue fills the value again?

Question

I need to create automated negative tests on a React.js app using jasmine and wdio but I cannot clear a field because the value keeps filling back. I have tried other methods and workarounds like

browser.execute("document.getElementById('City').value = ''")

or

locator.setValue(['1', 'Backspace']);

but nothing works. The value gets deleted but appears again.

Answer 1

Hook the onchange event and put a breakpoint in the source code view. Then you can see what is setting it if you either look at the calling stack, or step out of the hook it will return you to the calling code.

document.getElementById('blah').onchange = (() => {
 console.log('On change event fired'); //Put your breakpoint on this line
});