Picture this – your IT Department announces it’s time for a new round of machine refreshes and everyone is excited to get a new, shiny laptop. You get your new machine in hand and dive in to Windows 8; after all, a recent CNNMoney article noted “Microsoft claimed that its users would enjoy the experience of learning a new operating system” (full article here).
Everything is copasetic until you decide to install a second (or third) browser; sure IE10 is a great step forward, and my preferred browser for SP2013, though it can have some struggles in SP2010 (reference here). A large portion of the Windows user base though still prefers Firefox or Chrome.
And it’s there – at the convergence of those browsers, Windows 8′s penchant for encouraging touch-based interaction and website designers trying to optimize for touch – that an issue can arise. When using one of those “other” browsers, you find some of your favorite sites seem crippled; basic events, normally related to clicking on items or opening a menu just don’t happen. There’s no JS error in the browser, no indication as to what happened; the site just doesn’t seem to be registering your mouse clicks.
In our case, our new laptops do not have touch screens; but they do have one of the newer touchpads, the ones that support multi-touch & gestures. As I started digging – and getting frustrated that some of my most commonly used sites like my bank (USAA), Google Maps, the Amazon AWS console & others weren’t working – I was able to figure out that the problem was those sites were ignoring mouse-clicks in search of “touch” events on key elements within the site.
No worries though; once I had a diagnosis in hand, it was just a matter of finding & testing the appropriate fix. I knew I had to focus at the browser layer, because the issues were not seen when using IE10.
I started with Firefox – here are the steps I followed to get all those sites working again:
- Type “about:config” into the address bar
- Accept the warning (if you dare!)
- Search for “touch”
- If “dom.w3c_touch_events.expose” says ‘true’ under its value, double-click to change it to ‘false’
- If “dom.w3c_touch_events.enabled” says anything but ‘0’, double-click to pop an input box and set it to ‘0’
- Restart Firefox and enjoy you’re once-again functional sites
Then I went over to Chrome and applied a similar set of changes:
- Type “chrome://flags/” into the address bar
- Ctrl+F and search for “touch”
- Find “Enable touch events” and set it to ‘disabled’
- Find “Touch Optimized UI” and set it to ‘disabled’
- Restart Chrome and enjoy you’re once-again functional sites
That’s it! Sure, I’ve essentially disabled touch support in both browsers; but I don’t have a touch-screen anyway!? And that seemed to be the root of the issue; the browsers thought I did, by virtue of the super-fancy touchpad the laptop has. Not knowing whether the issue was Windows mis-reporting touch support (which, technically, I guess I do have but not in the way app developers would expect), the browsers mis-applying touch vs mouse events, or the web designers of the afflicted sites misusing touch handlers, I just wanted my sites to work again – and that did it.