You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

BrowserCapabilities.js 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345
  1. import { BrowserDetection } from '@jitsi/js-utils';
  2. import { getLogger } from 'jitsi-meet-logger';
  3. const logger = getLogger(__filename);
  4. /* Minimum required Chrome / Chromium version. This applies also to derivatives. */
  5. const MIN_REQUIRED_CHROME_VERSION = 72;
  6. // TODO: Move this code to js-utils.
  7. // NOTE: Now we are extending BrowserDetection in order to preserve
  8. // RTCBrowserType interface but maybe it worth exporting BrowserCapabilities
  9. // and BrowserDetection as separate objects in future.
  10. /**
  11. * Implements browser capabilities for lib-jitsi-meet.
  12. */
  13. export default class BrowserCapabilities extends BrowserDetection {
  14. /**
  15. * Creates new BrowserCapabilities instance.
  16. */
  17. constructor() {
  18. super();
  19. logger.info(
  20. `This appears to be ${this.getName()}, ver: ${this.getVersion()}`);
  21. }
  22. /**
  23. * Tells whether or not the <tt>MediaStream/tt> is removed from
  24. * the <tt>PeerConnection</tt> and disposed on video mute (in order to turn
  25. * off the camera device).
  26. * @return {boolean} <tt>true</tt> if the current browser supports this
  27. * strategy or <tt>false</tt> otherwise.
  28. */
  29. doesVideoMuteByStreamRemove() {
  30. return this.isChromiumBased() || this.isWebKitBased();
  31. }
  32. /**
  33. * Checks if the current browser is Chromium based, that is, it's either
  34. * Chrome / Chromium or uses it as its engine, but doesn't identify as
  35. * Chrome.
  36. *
  37. * This includes the following browsers:
  38. * - Chrome and Chromium
  39. * - Other browsers which use the Chrome engine, but are detected as Chrome,
  40. * such as Brave and Vivaldi
  41. * - Browsers which are NOT Chrome but use it as their engine, and have
  42. * custom detection code: Opera, Electron and NW.JS
  43. */
  44. isChromiumBased() {
  45. return this.isChrome()
  46. || this.isElectron()
  47. || this.isNWJS()
  48. || this.isOpera();
  49. }
  50. /**
  51. * Checks if the current browser is WebKit based. It's either
  52. * Safari or uses WebKit as its engine.
  53. *
  54. * This includes Chrome and Firefox on iOS
  55. *
  56. * @returns {boolean}
  57. */
  58. isWebKitBased() {
  59. // https://trac.webkit.org/changeset/236144/webkit/trunk/LayoutTests/webrtc/video-addLegacyTransceiver.html
  60. return this._bowser.isEngine('webkit')
  61. && typeof navigator.mediaDevices !== 'undefined'
  62. && typeof navigator.mediaDevices.getUserMedia !== 'undefined'
  63. && typeof window.RTCRtpTransceiver !== 'undefined'
  64. // eslint-disable-next-line no-undef
  65. && Object.keys(RTCRtpTransceiver.prototype).indexOf('currentDirection') > -1;
  66. }
  67. /**
  68. * Checks whether current running context is a Trusted Web Application.
  69. *
  70. * @returns {boolean} Whether the current context is a TWA.
  71. */
  72. isTwa() {
  73. return 'matchMedia' in window && window.matchMedia('(display-mode:standalone)').matches;
  74. }
  75. /**
  76. * Checks if the current browser is supported.
  77. *
  78. * @returns {boolean} true if the browser is supported, false otherwise.
  79. */
  80. isSupported() {
  81. return (this.isChromiumBased() && this._getChromiumBasedVersion() >= MIN_REQUIRED_CHROME_VERSION)
  82. || this.isFirefox()
  83. || this.isReactNative()
  84. || this.isWebKitBased();
  85. }
  86. /**
  87. * Returns whether or not the current environment needs a user interaction
  88. * with the page before any unmute can occur.
  89. *
  90. * @returns {boolean}
  91. */
  92. isUserInteractionRequiredForUnmute() {
  93. return this.isFirefox() && this.isVersionLessThan('68');
  94. }
  95. /**
  96. * Checks if the current browser triggers 'onmute'/'onunmute' events when
  97. * user's connection is interrupted and the video stops playback.
  98. * @returns {*|boolean} 'true' if the event is supported or 'false'
  99. * otherwise.
  100. */
  101. supportsVideoMuteOnConnInterrupted() {
  102. return this.isChromiumBased() || this.isReactNative() || this.isWebKitBased();
  103. }
  104. /**
  105. * Checks if the current browser reports upload and download bandwidth
  106. * statistics.
  107. * @return {boolean}
  108. */
  109. supportsBandwidthStatistics() {
  110. // FIXME bandwidth stats are currently not implemented for FF on our
  111. // side, but not sure if not possible ?
  112. return !this.isFirefox() && !this.isWebKitBased();
  113. }
  114. /**
  115. * Checks if the current browser supports setting codec preferences on the transceiver.
  116. * @returns {boolean}
  117. */
  118. supportsCodecPreferences() {
  119. return this.usesUnifiedPlan()
  120. && Boolean(window.RTCRtpTransceiver
  121. && window.RTCRtpTransceiver.setCodecPreferences
  122. && window.RTCRtpReceiver
  123. && window.RTCRtpReceiver.getCapabilities)
  124. // this is not working on Safari because of the following bug
  125. // https://bugs.webkit.org/show_bug.cgi?id=215567
  126. && !this.isWebKitBased();
  127. }
  128. /**
  129. * Checks if the current browser support the device change event.
  130. * @return {boolean}
  131. */
  132. supportsDeviceChangeEvent() {
  133. return navigator.mediaDevices
  134. && typeof navigator.mediaDevices.ondevicechange !== 'undefined'
  135. && typeof navigator.mediaDevices.addEventListener !== 'undefined';
  136. }
  137. /**
  138. * Checks if the current browser supports RTT statistics for srflx local
  139. * candidates through the legacy getStats() API.
  140. */
  141. supportsLocalCandidateRttStatistics() {
  142. return this.isChromiumBased() || this.isReactNative() || this.isWebKitBased();
  143. }
  144. /**
  145. * Checks if the current browser supports the Long Tasks API that lets us observe
  146. * performance measurement events and be notified of tasks that take longer than
  147. * 50ms to execute on the main thread.
  148. */
  149. supportsPerformanceObserver() {
  150. return typeof window.PerformanceObserver !== 'undefined'
  151. && PerformanceObserver.supportedEntryTypes.indexOf('longtask') > -1;
  152. }
  153. /**
  154. * Checks if the current browser supports audio level stats on the receivers.
  155. */
  156. supportsReceiverStats() {
  157. return typeof window.RTCRtpReceiver !== 'undefined'
  158. && Object.keys(RTCRtpReceiver.prototype).indexOf('getSynchronizationSources') > -1
  159. // Disable this on Safari because it is reporting 0.000001 as the audio levels for all
  160. // remote audio tracks.
  161. && !this.isWebKitBased();
  162. }
  163. /**
  164. * Checks if the current browser reports round trip time statistics for
  165. * the ICE candidate pair.
  166. * @return {boolean}
  167. */
  168. supportsRTTStatistics() {
  169. // Firefox does not seem to report RTT for ICE candidate pair:
  170. // eslint-disable-next-line max-len
  171. // https://www.w3.org/TR/webrtc-stats/#dom-rtcicecandidatepairstats-currentroundtriptime
  172. // It does report mozRTT for RTP streams, but at the time of this
  173. // writing it's value does not make sense most of the time
  174. // (is reported as 1):
  175. // https://bugzilla.mozilla.org/show_bug.cgi?id=1241066
  176. // For Chrome and others we rely on 'googRtt'.
  177. return !this.isFirefox();
  178. }
  179. /**
  180. * Checks if the browser uses plan B.
  181. *
  182. * @returns {boolean}
  183. */
  184. usesPlanB() {
  185. return !this.usesUnifiedPlan();
  186. }
  187. /**
  188. * Checks if the browser uses SDP munging for turning on simulcast.
  189. *
  190. * @returns {boolean}
  191. */
  192. usesSdpMungingForSimulcast() {
  193. return this.isChromiumBased() || this.isReactNative() || this.isWebKitBased();
  194. }
  195. /**
  196. * Checks if the browser uses unified plan.
  197. *
  198. * @returns {boolean}
  199. */
  200. usesUnifiedPlan() {
  201. if (this.isFirefox() || this.isWebKitBased()) {
  202. return true;
  203. }
  204. return false;
  205. }
  206. /**
  207. * Checks if the browser uses webrtc-adapter. All browsers except React Native do.
  208. *
  209. * @returns {boolean}
  210. */
  211. usesAdapter() {
  212. return !this.isReactNative();
  213. }
  214. /**
  215. * Checks if the browser uses RIDs/MIDs for siganling the simulcast streams
  216. * to the bridge instead of the ssrcs.
  217. */
  218. usesRidsForSimulcast() {
  219. return false;
  220. }
  221. /**
  222. * Checks if the browser supports getDisplayMedia.
  223. * @returns {boolean} {@code true} if the browser supports getDisplayMedia.
  224. */
  225. supportsGetDisplayMedia() {
  226. return typeof navigator.getDisplayMedia !== 'undefined'
  227. || (typeof navigator.mediaDevices !== 'undefined'
  228. && typeof navigator.mediaDevices.getDisplayMedia
  229. !== 'undefined');
  230. }
  231. /**
  232. * Checks if the browser supports insertable streams, needed for E2EE.
  233. * @returns {boolean} {@code true} if the browser supports insertable streams.
  234. */
  235. supportsInsertableStreams() {
  236. if (!(typeof window.RTCRtpSender !== 'undefined'
  237. && (window.RTCRtpSender.prototype.createEncodedStreams
  238. || window.RTCRtpSender.prototype.createEncodedVideoStreams))) {
  239. return false;
  240. }
  241. // Feature-detect transferable streams which we need to operate in a worker.
  242. // See https://groups.google.com/a/chromium.org/g/blink-dev/c/1LStSgBt6AM/m/hj0odB8pCAAJ
  243. const stream = new ReadableStream();
  244. try {
  245. window.postMessage(stream, '*', [ stream ]);
  246. return true;
  247. } catch {
  248. return false;
  249. }
  250. }
  251. /**
  252. * Whether the browser supports the RED format for audio.
  253. */
  254. supportsAudioRed() {
  255. return Boolean(window.RTCRtpSender
  256. && window.RTCRtpSender.getCapabilities
  257. && window.RTCRtpSender.getCapabilities('audio').codecs.some(codec => codec.mimeType === 'audio/red')
  258. && window.RTCRtpReceiver
  259. && window.RTCRtpReceiver.getCapabilities
  260. && window.RTCRtpReceiver.getCapabilities('audio').codecs.some(codec => codec.mimeType === 'audio/red'));
  261. }
  262. /**
  263. * Checks if the browser supports the "sdpSemantics" configuration option.
  264. * https://webrtc.org/web-apis/chrome/unified-plan/
  265. *
  266. * @returns {boolean}
  267. */
  268. supportsSdpSemantics() {
  269. return this.isChromiumBased();
  270. }
  271. /**
  272. * Checks if the browser supports voice activity detection via the @type {VADAudioAnalyser} service.
  273. *
  274. * @returns {boolean}
  275. */
  276. supportsVADDetection() {
  277. return this.isChromiumBased();
  278. }
  279. /**
  280. * Returns the version of a Chromium based browser.
  281. *
  282. * @returns {Number}
  283. */
  284. _getChromiumBasedVersion() {
  285. if (this.isChromiumBased()) {
  286. // NW.JS doesn't expose the Chrome version in the UA string.
  287. if (this.isNWJS()) {
  288. // eslint-disable-next-line no-undef
  289. return Number.parseInt(process.versions.chromium, 10);
  290. }
  291. // Here we process all browsers which use the Chrome engine but
  292. // don't necessarily identify as Chrome. We cannot use the version
  293. // comparing functions because the Electron, Opera and NW.JS
  294. // versions are inconsequential here, as we need to know the actual
  295. // Chrome engine version.
  296. const ua = navigator.userAgent;
  297. if (ua.match(/Chrome/)) {
  298. const version
  299. = Number.parseInt(ua.match(/Chrome\/([\d.]+)/)[1], 10);
  300. return version;
  301. }
  302. }
  303. return -1;
  304. }
  305. }