How to simulate ctrl-click or shift-click using webdriver.io?

Question

With webdriver.io, I would like to model clicks using a modifier like shift or ctrl . The keys() method seems to do something like this, but it is not clear to me how to free the modifier key again, and it throws an error when I use 16 (key code for shift ) as a parameter for the method - a link .

Background: on my webpage I'm testing, I have a list of items comparable to files and folders in a file browser, and you can select several of them with shift and ctrl . This works well, and now I would like to test it using webdriver.io. For this webdriver.io, for example. should click an element, then press shift , then click on another element and finally release the shift button. Is there any way to do this?

Answer 1

Change If you want to select various elements using the ctrl key:

 client.elements(<css selector for your list of elements>, function(err, res) { client .moveTo(res.value[<index of element you want to select>].ELEMENT, 0, 0) .keys('Ctrl') #every action after this within the scope of `client.elements` will have the `ctrl` key depressed .buttonPress('left') .moveTo(res.value[<index of element you want to select>].ELEMENT, 0, 0) .buttonPress('left') .moveTo(res.value[<index of element you want to select>].ELEMENT, 0, 0) .buttonPress('left') #repeat `.moveTo` and `.buttonPress` for every element you want to `ctrl` select .keys('NULL'); #This command or `.keys('Shift') will release the `shift` key. }); 

To select using the shift key, you use the code below (provided that you want to select each element in your list of elements - obviously, you can change the indexes to get a specific subsection of your list of elements). It will move to the upper left of the first element in your list of elements, then left-click, then press the switch key, then it will move to the upper left upper element of the last element, left-click again, and then release the shift key

 client.elements(<css selector for your list of elements>, function(err, res) { client .moveTo(res.value[0].ELEMENT, 0, 0) .buttonPress('left') .keys('Shift') .moveTo(res.value[(res.value.length-1)].ELEMENT, 0, 0) .buttonPress('left') .keys('NULL'); #This command or `.keys('Shift') will release the `shift` key. });