On my iPod touch test device (iPhone 5 size), focusing the document zooms the page in by about 5%, also zooming in on the toolbar and making the padding unbalanced.
Description
Details
Project | Branch | Lines +/- | Subject | |
---|---|---|---|---|
mediawiki/extensions/VisualEditor | master | +167 -0 | MobileArticleTarget: Prevent unwanted page zooming on focus on iOS |
Status | Subtype | Assigned | Task | ||
---|---|---|---|---|---|
Resolved | matmarex | T221328 [Epic] Mobile VE usability improvements (FY18-19 Q4) | |||
Resolved | Ryasmeen | T216446 Page zooms slightly when focusing document on iPhone Chrome |
Event Timeline
This does not happen for me using iPhone SE, which should be the same screen size. (In this recording, I zoom in with pinch-zoom.)
However, it does happen when putting the cursor in an image caption, which has a smaller font size. iOS Safari will zoom in when the font size is smaller than 16px.
The slight zoom actually only happens on Chrome+iOS, not Safari. However the caption issue is on both browsers.
The only way to fix the caption issue would be to make the font size larger, either on load or on focus. Both of these approaches have downsides:
- On load: Inconsistency with read mode
- On focus: potential loss of focus/scroll offset as text moves (also may not actually work?)
We have to decide if the zoom issue is bad enough that we want to sacrifice the font size consistency with read mode.
Actually, it seems there is a way: https://stackoverflow.com/questions/2989263/disable-auto-zoom-in-input-text-tag-safari-on-iphone/46254706#46254706
I tested this quickly and it seems to work.
According to other comments, this will however disable user zoom in Chrome on iOS (and on Android devices, but we can limit this to iOS). This might be okay?
Change 512748 had a related patch set uploaded (by Bartosz Dziewoński; owner: Bartosz Dziewoński):
[mediawiki/extensions/VisualEditor@master] MobileArticleTarget: Prevent page zooming on focus on iOS
this will however disable user zoom in Chrome on iOS
Disabling zoom is an accessibility issue, but it might be better than hiding the toolbar.
Given Peter's video of the issue on an iPhone XS + Safari (https://www.youtube.com/watch?v=t6CT0lTgOAI) I think this is a pretty serious issue on iOS+Safari, and so we should proceed with Bartosz's patch, despite the issue on iOS+Chrome.
The zoom controls can be changed dynamically, so if that's a problem, we could try doing something cheeky like re-enabling zoom after the cursor is placed, or maybe even keep it always enabled except when the user is placing the cursor to prevent this unintended zoom… We'd need to test that carefully to make sure nothing blows up, but depending on how the browser handles it, we may be able to do it.
@matmarex, does the table below accurately describe the behavior being proposed in both patches?
Configuration | T216446#5218826 [1] | /r/512748 |
iOS + Safari | unintended zoom [2] = non-issue; pinch-to-zoom = enabled | unintended zoom = non-issue; user zoom = enabled |
iOS + Chrome | unintended zoom = enabled; user zoom = disabled | ⚠️ unintended zoom = disabled; user zoom = disabled |
iOS + Firefox | unintended zoom = disabled; user zoom = enabled | unintended zoom = disabled; user zoom = enabled |
Android + all browsers | unintended zoom = disabled; user zoom = enabled | unintended zoom = non-issue; user zoom = enabled |
If it does, before moving forward with what's being proposed in T216446#5218826, I'm keen to hear what Volker thinks about the accessibility tradeoff here...
@Volker_E, what do you think about releasing a patch that would disable contributors using iOS + Chrome from zooming the editing surface?
This question comes in response to the following issue...
Issue: the page zooms slightly when focusing the document in edit mode, using iPhone + Chrome and Safari (see: video)
cc @Esanders
- T216446#5218826: assumes the patch (not yet written) works as expected
- "unintended zoom" = auto-zoom when contributors place the cursor in the document in edit mode
That seems right; although I can't test it exactly, as my iOS device is an iPhone SE, which for some reason doesn't seem to suffer from this problem.
From a quick glance, if maximum-scale=1 is the only way to circumvent the described unintended behaviour:
- how big is the percentage of iOS + Chrome?
- definitely limit it to iOS
@matmarex has laid it out very well and already limited to iOS. Disabling zoom is one of the worst possible limitations for users. Nonetheless I'd, when the numbers are clear (and small) for Chrome/iOS, still consider the outlined solution, file a bug against Chrome (which seems to try being smarter than the standard) and revisit the solution after a while.
This indeed seems to be possible, and I now updated the patch so that it prevents the undesired automatic zooming while still allowing pinch-zooming in iOS Chrome.
If anyone wants to test the hack outside of VE, here's a simplified version I was initially testing with.
Change 512748 merged by jenkins-bot:
[mediawiki/extensions/VisualEditor@master] MobileArticleTarget: Prevent unwanted page zooming on focus on iOS