TA: Mobile browser - It's all about the touch(start/end)

As we all know, non-touch devices like a desktops have slightly different input from touch devices like mobile. This also means developers do have the option to build a website that does expect touch input instead of a mouse click. If your test suite does do a `element.click` when touch is expected, the click does not fail (at least not currently), so no error is thrown/shown but your script will fail. In one of my previous blog posts I mentioned a solution with execute_script and touchend. I did find out (with the help of the watir community on Slack), this can be resolved easier with Selenium and touch action (only supported on Chrome at the moment of writing).

The specs

In general spec documents are a bit difficult to interpret because of the lack of a clear example, but it gets easier to understand the structure over time. If you look at the specs of selenium-webdriver you get an overview of all possibilities. There are a couple of points you could look if you think about tapping on the screen. On the Watir Slack channel I mentioned `HasTouchScreen` which just refers to `touch`, Lucas T. mentioned `touch` actions and `touch.single_tap` (thanks for helping me out Lucas). So in the specs I found related to touch are these two `TouchActionBuilder` (inherits Actionbuilder) & `TouchScreen` (inherits Object). And as we can see `single_tap` is mentioned on those pages. We just need a Selenium driver and object to execute it since this is not anywhere mentioned in the Watir specs.

Watir to Selenium conversion

I'm using the Lapis_lazuli + Watir combi, so I use `browser` instead of `driver` and also the elements I find are Watir objects instead of Selenium objects. And since Watir is like an extension of Selenium, it's really easy to find the element with LL/Watir and let Selenium take over for some touch action.
As for the `touch` action with Selenium driver you can do `driver = browser.driver` and than `driver.touch...` or just `browser.wd.touch...`.
As for the object you can do `s_elm = elm.wd` to convert a Watir object into a Selenium object.
Now you can perform a touch event on an element like `browser.wd.touch.single_tap(s_elm).perform`.

Tapping the wrong element

For some reason (I still need to figure out why exactly) in my case the element I needed to tap on did not happen, instead it tapped one element (most likely one pixel) to high. I assumed that just like with a `elm.click` (as Justin Ko mentioned on a StackOverflow post) the webdriver will tab in the middle of the element (as also mentioned in the new W3C specs), but that's not the case and it taps in the top left corner of the element and therefore (by overlap or bug) per accident tapped on one element to high. So I ended up with a slightly different solution `touch.down(x,y)` and `touch.up(x,y)`. The final solution looked like this `browser.wd.touch.down(item.centre).up(item.centre).perform`.