Page MenuHomePhabricator

[Bug] iPadOS 13 shows the desktop version of Safari with a broken layout
Open, NormalPublicBug

Description

Steps to reproduce

  1. Install iPadOS 13 through the beta program or by installing Xcode 11 beta and running the iPadOS 13 simulator
  2. Open any Wikipedia article in Safari
  3. Resize the Safari window by opening another app in split screen

Expected results

TBD (show the mobile site?)

Actual results

The desktop version shows with a broken layout


Environments observed

  • OS version: iPadOS 13
  • Device model: iPad (6th generation)
  • Device language: en

Notes

iPadOS now sends Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Safari/605.1.15 as the User-Agent from Safari if the page is loaded while the window is wide enough. If the page is loaded with a narrow window, it sends Mozilla/5.0 (iPad; CPU OS 13_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Mobile/15E148 Safari/604.1. The problem occurs when Wikipedia is loaded fullscreen and resized to be narrow.

The width seems to be set by the widest item on the page:

Adding <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, shrink-to-fit=no"> prevents this scaling. More info: https://developer.apple.com/videos/play/wwdc2019/203/

Event Timeline

JoeWalsh created this task.Mon, Aug 5, 7:48 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMon, Aug 5, 7:48 PM
JoeWalsh updated the task description. (Show Details)Mon, Aug 5, 7:59 PM
JoeWalsh updated the task description. (Show Details)Mon, Aug 5, 8:47 PM
Jdlrobson claimed this task.Mon, Aug 5, 9:36 PM
Jdlrobson moved this task from Incoming to Needs Prioritization on the Readers-Web-Backlog board.
ovasileva triaged this task as Normal priority.Mon, Aug 5, 11:04 PM
Jdlrobson reassigned this task from Jdlrobson to phuedx.Tue, Aug 6, 2:15 PM
Jdlrobson added a project: Traffic.
Jdlrobson added a subscriber: Jdlrobson.

We shouldn't add <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, shrink-to-fit=no"> to Vector. When Monobook did that it annoyed a lot of people and I wouldn't advise it as it seems many users use Vector on their mobile devices exactly because they don't want a responsive layout.

Varnish determines when to show or not show the mobile website and that's purely based on user agent and this is out of the teams expertise and will require syncing with ops. However, the user agent iPadOS sends is not a mobile URL, so if iPadOS wants to be recognised as desktop that's going to be impossible to change.

I'm thus not sure what to do with this ticket. What would you recommend Sam?

Restricted Application added a project: Operations. · View Herald TranscriptTue, Aug 6, 2:15 PM
ovasileva reassigned this task from phuedx to Jdlrobson.Tue, Aug 6, 2:54 PM
ovasileva added a subscriber: phuedx.
Jdlrobson reassigned this task from Jdlrobson to ovasileva.Wed, Aug 7, 6:20 PM

Not sure if you or Sam would be best placed to work out what to do with this. Talking to Operations > Traffic and/or Apple would be useful.

We shouldn't add <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, shrink-to-fit=no"> to Vector. When Monobook did that it annoyed a lot of people and I wouldn't advise it as it seems many users use Vector on their mobile devices exactly because they don't want a responsive layout.

Do you have a link and/or do you remember where this annoyance was voiced?

We shouldn't add <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, shrink-to-fit=no"> to Vector. When Monobook did that it annoyed a lot of people and I wouldn't advise it as it seems many users use Vector on their mobile devices exactly because they don't want a responsive layout.

Do you have a link and/or do you remember where this annoyance was voiced?

https://de.wikipedia.org/w/index.php?title=Wikipedia:Fragen_zur_Wikipedia&oldid=178125403#Merkw%C3%BCrdige_Seitendarstellung

ema moved this task from Triage to Watching on the Traffic board.Wed, Aug 14, 12:52 PM

Varnish determines when to show or not show the mobile website and that's purely based on user agent and this is out of the teams expertise and will require syncing with ops.

Yes and no. The mobile_redirect subroutine is fairly simple (see https://github.com/wikimedia/puppet/blob/dd8b6a8339bdc6b389c794b0e7ad5f4338d30194/modules/varnish/templates/text-frontend.inc.vcl.erb#L27).

However, the user agent iPadOS sends is not a mobile [one], so if iPadOS wants to be recognised as desktop that's going to be impossible to change.

This. Ignoring minor version numbers, that UA is the same as mine (Safari 12.1.2 on macOS Mojave 10.14.6). Unless we want to redirect ALL such UAs to the mobile site, then UA sniffing won't work here.