Project

Profile

Help

Bug #3268

closed

Saxon-JS documentation app problems in Safari on iPad (and other handheld devices)

Added by Debbie Lockett almost 7 years ago. Updated over 6 years ago.

Status:
Closed
Priority:
Low
Category:
-
Sprint/Milestone:
-
Start date:
2017-06-13
Due date:
% Done:

100%

Estimated time:
Applies to JS Branch:
Fix Committed on JS Branch:
Fixed in JS Release:
SEF Generated with:
Platforms:
Company:
-
Contact person:
-
Additional contact persons:
-

Description

We've realised that the Saxon-JS documentation app is not working properly in Safari on iOS devices. It loads and displays, but (internal) links do not work, so navigating the documentation doesn't work.

e.g. from http://www.saxonica.com/saxon-js/documentation/index.html#!samples the links to other pages in the documentation do not work, but those to external pages seem to work fine.

(Note: the problem does not occur with Safari on the MacBook. And the main Saxon documentation app http://saxonica.com/documentation/index.html which still uses Saxon-CE also works OK on iOS devices.)

Actions #1

Updated by Debbie Lockett over 6 years ago

  • Status changed from New to Resolved

This bug is specific to the documentation app, rather than a problem with Saxon-JS.

Note that the problem was not present for older versions of the documentation app (which can still be found under test areas of the website). I suspect something broke when I removed the use of the $usesClick JavaScript variable and ixsl:ontouchend event handling templates - to resolve the bug https://saxonica.plan.io/issues/3036

The problem is due to a Safari Mobile bug where click events are not fired on elements which aren't typically interactive (or "clickable") - see https://developer.mozilla.org/en/docs/Web/Events/click

I've used the workaround to set the CSS property cursor: pointer; on the relevant elements (I believe the only ones we use are span elements with class="link" or class="item"). So the fix is a simple one in jstree.css (and index.html to ensure the updated CSS file is loaded). Committed to svn and updated online, so marking resolved.

I needed to learn how to do various "web developer" tasks in order to debug the problem. These are likely to be useful again, so for the record here are some useful resources:

Use the Mac Simulator to simulate the use of Apple devices

https://stackoverflow.com/questions/40077053/how-do-we-emulate-touch-events-in-safari-responsive-design-mode

And then using Web Inspector to debug Mobile Safari

https://webdesign.tutsplus.com/articles/quick-tip-using-web-inspector-to-debug-mobile-safari--webdesign-8787

Note that simulating Apple devices in Safari using "Enter Responsive Design Mode" was insufficient, because this does not properly replicate touch events as opposed to click events.

https://support.apple.com/kb/PH26266?viewlocale=en_US&locale=en_US

Actions #2

Updated by Debbie Lockett over 6 years ago

Found some other elements (as well as span class="item" and span class="link") which required the fix: li class="trail", p class="search", p class="arrowNone", p class="arrowRight", etc. CSS updated and committed.

Actions #3

Updated by Debbie Lockett over 6 years ago

  • Status changed from Resolved to Closed
  • % Done changed from 0 to 100
  • Fixed in JS Release set to Saxon-JS 1.0.2

Bug fix applied in Saxon-JS 1.0.2 maintenance release.

Please register to edit this issue

Also available in: Atom PDF Tracking page