add browser.IS_CHROMECAST_RECEIVER and class name for CSS targeting o…

…n a Chromecast receiver where Video.js is used (#8703)

src/js/player.js

@@ -795,7 +795,8 @@ class Player extends Component {
       'IS_WEBOS',
       'IS_ANDROID',
       'IS_IPAD',
-      'IS_IPHONE'
+      'IS_IPHONE',
+      'IS_CHROMECAST_RECEIVER'
     ].filter(key => browser[key]).map(key => {
       return 'vjs-device-' + key.substring(3).toLowerCase().replace(/\_/g, '-');
     });

src/js/utils/browser.js

@@ -96,6 +96,14 @@ export let CHROMIUM_VERSION = null;
  */
 export let CHROME_VERSION = null;
 
+/**
+ * Whether or not this is a Chromecast receiver application.
+ *
+ * @static
+ * @type {Boolean}
+ */
+export const IS_CHROMECAST_RECEIVER = Boolean(window.cast && window.cast.framework && window.cast.framework.CastReceiverContext);
+
 /**
  * The detected Internet Explorer version - or `null`.
  *

test/unit/player.test.js

@@ -1045,6 +1045,19 @@ QUnit.test('should add iphone classname when on iphone', function(assert) {
   player.dispose();
 });
 
+QUnit.test('should add chromecast-receiver classname when on chromecast receiver', function(assert) {
+  assert.expect(1);
+
+  browser.stub_IS_CHROMECAST_RECEIVER(true);
+
+  const player = TestHelpers.makePlayer({});
+
+  assert.ok(player.hasClass('vjs-device-chromecast-receiver'), 'chromecast-receiver classname added');
+
+  browser.reset_IS_CHROMECAST_RECEIVER();
+  player.dispose();
+});
+
 QUnit.test('should add a svg-icons-enabled classname when svg icons are supported', function(assert) {
   // Stub a successful parsing of the SVG sprite.
   sinon.stub(window.DOMParser.prototype, 'parseFromString').returns({