Update: I’ve cross-posted this on the Capacitor GitHub Discussions.
We’re currently migrating from Cordova to Capacitor and have run into some issues regarding the iPad user agent.
As you might know, since iOS 13 Safari/WKWebView on iPad has defaulted to “desktop browsing” mode if Safari is full-screen. It does this by using a Macintosh user agent string to make web servers and web sites/apps think that a desktop browser is being used.
Allow me to share some user agent string examples from an iPad 5th generation on iOS 13.4.
Here is a user agent string for Safari when it’s in full-screen mode. It uses a Macintosh user agent string to signify “desktop browsing” mode:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.1 Safari/605.1.15
Here is a user agent string for Safari when it’s in Slide Over/multi-tasking/non-full-screen mode. This is what it would have been similar to pre-iOS 13. It contains iPad/iOS-specific values that would signify “mobile browsing” mode. One use is for requesting the mobile version of a website:
Mozilla/5.0 (iPad; CPU OS 13_4 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.1 Mobile/15E148 Safari/604.1
For some reason, with Cordova (using
cordova-plugin-ionic-webview 4.0.0) the user agent string on iOS 13 and 14 still uses the pre-iOS 13-style user agent string. Looking at source code I was not able to determine in the time that I spent doing so how the user agent string gets set to this value vs. the WKWebView default. It looks like this:
Mozilla/5.0 (iPad; CPU OS 13_4 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148
With Capacitor (using 2.4.5 but also tried the v3 beta) the user agent string now behaves more like Safari does in using a Macintosh user agent string (but it’s not exactly the same). It matches the default WKWebView user agent string if one wasn’t using Capacitor:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_4) AppleWebKit/605.1.15 (KHTML, like Gecko)
Other sniffing is done by analytics/error tracking libraries to know what types of devices our users are using (for example, iPhone vs. iPad, iOS version, etc.). I’m not sure what Web API alternatives there are to using the user agent string for this info and have yet to research what these libraries have done or plan to do to address it.
I know that Capacitor has the ability to override or append the user agent string. I don’t think we’d want to override it at code/build-time because we wouldn’t know for
ios if it should be
iPad. Given that, if we appended something I’m not sure what we would append.
It appears that WKWebView has an API that can be used to force “mobile browsing” mode:
However, Capacitor doesn’t provide an API for us to set that. Is there a way to configure the WebView outside of the Capacitor config file?
Do folks think this could be added as a feature to Capacitor? Should I open an issue on the Capacitor GitHub?
Has anyone else had to deal with this issue?