Detecting “Tablet/Touch Mode” in Edge using JavaScript on Windows 10?

Question

This question was asked before, but the answers are not exactly what I need.

I need to distinguish in Microsoft Edge if it's a tablet or not (Desktop).

1) The following thread: Can you detect "Tablet Mode" in Edge and IE11 using JavaScript on Windows 10?

worked indeed, but I'm afraid that in the next version Microsoft will change the behavior.

How can I be sure that they won't?

Answers with if condition of window.PointerEvent do not work at all, since it's defined in Desktop.

I can't use CSS Media Queries Interaction media features as suggested here: Is there any way to detect if user has launched microsoft edge tablet or desktop browser?

Answer 1

Here are the hardware specific differences in the Edge browser capabilities:

The only differences are due to certain device-specific qualities – for example, codec support may be different on phones due to missing hardware acceleration, and Flash is not supported on Windows 10 Mobile. Because Windows 10 Mobile has a different background model, RTC (Real-Time Communications) APIs are also currently not supported. Finally, Windows 10 Mobile does not support Flash in order to provide a modern, touch-focused, and power-efficient experience appropriate for a mobile device. Because of this, Flash is not supported in Microsoft Edge in Continuum.

To detect RTC capabilities, use the following code:

if (RTCRtpCapabilities)
  {
  initRTC();
  }
function initRTC()
  {
  var recvAudioCaps = RTCRtpReceiver.getCapabilities("audio"); 
  var recvVideoCaps = RTCRtpReceiver.getCapabilities("video"); 
  var sendAudioCaps = RTCRtpSender.getCapabilities("audio");
  var sendVideoCaps = RTCRtpSender.getCapabilities("video"); 
  }

Embedding a Flash movie which uses an ExternalInterface call would be the easiest way to detect Flash.

The properties of the navigator object should be able to distinguish tablet from phone. For example:

navigator.cpuClass

should return x86 for Surface devices, but other for phones.

Also, the user agent changes when casting a phone display to a TV. It goes from:

• Microsoft Edge UA (Mobile)

  Mozilla/5.0 (Windows Phone 10.0; Android 6.0.1; Microsoft; <Device>) AppleWebKit/<Rev (KHTML, like Gecko) Chrome/<Rev> Mobile Safari/<Rev> Edge/<Rev>
  

to:

• Microsoft Edge UA (Continuum)

  Mozilla/5.0 (Windows NT 10.0; ARM) AppleWebKit/<Rev> (KHTML, like Gecko) Chrome/<Rev> Safari/<Rev> Edge/<Rev>
  

compared to the desktop:

• Microsoft Edge UA (Desktop)

  Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/<Rev> (KHTML, like Gecko) Chrome/<Rev> Safari/<Rev> Edge/<Rev>
  

References

• Microsoft Edge and Continuum: Your desktop browser on Mobile

• Microsoft Edge Dev Guide: Object RTC API

• ORTC Specification: dictionary RTCRtpCapabilities

• Flash Player guidance for Internet Explorer 11 and Microsoft Edge

• Minimum Hardware Requirements: Windows 10

• Continuum for Phones FAQ

• clientInformation object

• Device Fingerprint Help

• Security Error when trying to call ActionScript function from JS

• The Windows 10 Browser Conundrum

• how to tell if android user came from home screen app

• Configuring Web Applications