How to release keys in webdriverIO

Question

The webdriverIO docs say that the browser.keys command works like the sendKeys command, but it doesn't implicitly release the keys.

http://webdriver.io/api/protocol/keys.html

How are the keys released?

I tried writing code to navigate backwards through a form using the keyboard:

browser.keys(['Shift', 'Tab']);

But in the next input box it types into, the text is capitalized. It's like the shift key is still held down.

Answer 1

Why do you not use .click for clicking on the form you want? It´s much easier to work with css selector than simulating key press.

Alternative you can also do stuff like this

.click('a[href*="contact"]')

Works also with placeholder and other stuff if you can´t find an unique id or class.

// .moveToObject(selector,xoffset,yoffset); 
.moveToObject('#button', 0, -103)
.buttonDown()
.moveToObject('#button', 0, -104)
.buttonUp()

However this is what I use to press down mouse button and then release it, if you have no chance to find the right css selector to click on. You can make rightclick of webdriver io to see at which position you at and then you can create this workaround click anywhere without css selector.

Answer 2

I think I figured it out. I just had to send the key twice like this

browser.keys(['Shift', 'Tab', 'Tab', 'Shift']);

I think webdriver must treat the first Shift like a keydown, and the second Shift like a key up.

So the sequence above would be the full keysDown/keysUp sequence to do a backwards form navigation using the keyboard.