How to detect Chrome on iOS by JavaScript when "Request Desktop Site" setting is enabled.

iOS Chrome

Problem

When the setting of "Request Desktop Site" of Chrome on iPhone is enabled, navigator value is changed that not include text CriOS. So you cannot detect browser is Chrome by JavaScript.

*This problem and solution is checked on Chrome 80.0.3987.95.

UserAgent value of Chrome on iPhone

The navigator value of Chrome on iPhone which enable "Request Desktop Site" setting. It has not text CriOS and other text that available for detect Chrome.

maxTouchPoints : "5"
appCodeName : "Mozilla"
appName : "Netscape"
appVersion : "5.0 (Macintosh; Intel Mac OS X 10_13_5) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.1.1 Safari/605.1.15"
platform : "iPhone"
product : "Gecko"
productSub : "20030107"
userAgent : "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_5) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.1.1 Safari/605.1.15"
vendor : "Apple Computer, Inc."

The navigator information value of Chrome on iPhone which enable "Request Mobile Site" setting. It has text CriOS.

maxTouchPoints : "5"
appCodeName : "Mozilla"
appName : "Netscape"
appVersion : "5.0 (iPhone; CPU iPhone OS 13_4 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/80.0.3987.95 Mobile/15E148 Safari/604.1"
platform : "iPhone"
product : "Gecko"
productSub : "20030107"
userAgent : "Mozilla/5.0 (iPhone; CPU iPhone OS 13_4 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/80.0.3987.95 Mobile/15E148 Safari/604.1"
vendor : "Apple Computer, Inc."

This specification is described below.
developer.chrome.com

UserAgent value of Chrome on iPad

Chrome on iPad not change navigator value regardless of "Request Desktop Site" setting. It has always text CriOS.

maxTouchPoints : "5"
appCodeName : "Mozilla"
appName : "Netscape"
appVersion : "5.0 (iPad; CPU OS 13_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/80.0.3987.95 Mobile/15E148 Safari/604.1"
platform : "MacIntel"
product : "Gecko"
productSub : "20030107"
userAgent : "Mozilla/5.0 (iPad; CPU OS 13_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/80.0.3987.95 Mobile/15E148 Safari/604.1"
vendor : "Apple Computer, Inc."

Solution

Chrome of iOS has window.__gCrWeb object. You can detect browser is Chrome by check this object is exist.

*Chromium source code that add window.__gCrWeb object. https://source.chromium.org/chromium/chromium/src/+/master:ios/web/web_state/js/resources/base.js?originalUrl=https:%2F%2Fcs.chromium.org%2F

Sample code

//  Detect iPhone or iPad
if(navigator.platform.indexOf("iPhone") != -1 || navigator.appVersion.indexOf("iPad") != -1) {
  if(window.__gCrWeb != undefined) {
    //  Browser is Chrome
  }
  else {
    //  Other browsers
  }
}