Fix bug: Use "screenfull" for cross-browser support for fullscreen

package.json

@@ -54,6 +54,7 @@
     "redux-logger": "^3.0.6",
     "redux-promise-middleware": "^4.2.0",
     "redux-thunk": "^2.2.0",
+    "screenfull": "^3.3.3",
     "seamless-immutable": "^7.1.2",
     "simple-peer": "^8.1.0",
     "socket.io": "^2.1.1",

src/client/components/Toolbar.js

@@ -1,5 +1,6 @@
 import PropTypes from 'prop-types'
 import React from 'react'
+import screenfull from 'screenfull'
 import { MessagePropTypes } from './Chat.js'
 import { StreamPropType } from './Video.js'
 
@@ -39,35 +40,10 @@ export default class Toolbar extends React.PureComponent {
     e.currentTarget.classList.toggle('on')
   }
   handleFullscreenClick = e => {
-    const document = window.document
-    const fs = document.getElementById('container')
-    if (
-      !document.fullscreenElement &&
-      !document.mozFullScreenElement &&
-      !document.webkitFullscreenElement &&
-      !document.msFullscreenElement
-    ) {
-      if (fs.requestFullscreen) {
-        fs.requestFullscreen()
-      } else if (fs.msRequestFullscreen) {
-        fs.msRequestFullscreen()
-      } else if (fs.mozRequestFullScreen) {
-        fs.mozRequestFullScreen()
-      } else if (fs.webkitRequestFullscreen) {
-        fs.webkitRequestFullscreen()
-      }
-    } else {
-      if (document.exitFullscreen) {
-        document.exitFullscreen()
-      } else if (document.msExitFullscreen) {
-        document.msExitFullscreen()
-      } else if (document.mozCancelFullScreen) {
-        document.mozCancelFullScreen()
-      } else if (document.webkitExitFullscreen) {
-        document.webkitExitFullscreen()
-      }
+    if (screenfull.enabled) {
+      screenfull.toggle(e.target)
+      e.currentTarget.classList.toggle('on')
     }
-    e.currentTarget.classList.toggle('on')
   }
   handleHangoutClick = e => {
     window.location.href = '/'

yarn.lock

@@ -6164,6 +6164,11 @@ sax@^1.2.4:
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
   integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==
 
+screenfull@^3.3.3:
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/screenfull/-/screenfull-3.3.3.tgz#8cf7e706aceac2e75131aadcb81b622acfe11d39"
+  integrity sha512-DzYUuXr+OV2BDvYXaYzlYgJd4WXZZ2CW5NFC7Kw6TUCpzXJAx4MwlVD6CH+Mu6fi8rfAQIQfqdFZ4jtDsEkWig==
+
 scss-tokenizer@^0.2.3:
   version "0.2.3"
   resolved "https://registry.yarnpkg.com/scss-tokenizer/-/scss-tokenizer-0.2.3.tgz#8eb06db9a9723333824d3f5530641149847ce5d1"