fix(text-tracks): set withCredentials on XHR if crossOrigin='use-cred…

…entials' (#6588)

Fixes #6587

src/js/tracks/text-track.js

@@ -80,6 +80,12 @@ const loadTrack = function(src, track) {
     opts.cors = crossOrigin;
   }
 
+  const withCredentials = track.tech_.crossOrigin() === 'use-credentials';
+
+  if (withCredentials) {
+    opts.withCredentials = withCredentials;
+  }
+
   XHR(opts, Fn.bind(this, function(err, response, responseBody) {
     if (err) {
       return log.error(err, response);

test/unit/tech/tech-faker.js

@@ -156,6 +156,9 @@ class TechFaker extends Tech {
   ended() {
     return false;
   }
+  crossOrigin() {
+    return null;
+  }
 
   // Support everything except for "video/unsupported-format"
   static isSupported() {

test/unit/tracks/text-track-list-converter.test.js

@@ -45,7 +45,11 @@ if (Html5.supportsNativeTextTracks()) {
       kind: 'captions',
       label: 'English',
       language: 'en',
-      tech: {}
+      tech: {
+        crossOrigin() {
+          return null;
+        }
+      }
     });
 
     const nativeTrack = document.createElement('track');
@@ -71,6 +75,9 @@ if (Html5.supportsNativeTextTracks()) {
           }
         };
       },
+      crossOrigin() {
+        return null;
+      },
       textTracks() {
         return tt;
       }
@@ -98,7 +105,11 @@ if (Html5.supportsNativeTextTracks()) {
       label: 'English',
       language: 'en',
       src: 'example.com/english.vtt',
-      tech: {}
+      tech: {
+        crossOrigin() {
+          return null;
+        }
+      }
     });
 
     const nativeTrack = document.createElement('track');
@@ -126,6 +137,9 @@ if (Html5.supportsNativeTextTracks()) {
           }
         };
       },
+      crossOrigin() {
+        return null;
+      },
       textTracks() {
         return tt;
       },
@@ -152,7 +166,11 @@ QUnit.test('trackToJson_ produces correct representation for emulated track obje
     label: 'English',
     language: 'en',
     src: 'example.com/english.vtt',
-    tech: {}
+    tech: {
+      crossOrigin() {
+        return null;
+      }
+    }
   });
 
   assert.deepEqual(cleanup(c.trackToJson_(track)), {
@@ -170,15 +188,23 @@ QUnit.test('textTracksToJson produces good json output for emulated only', funct
     label: 'English',
     language: 'en',
     src: 'example.com/english.vtt',
-    tech: {}
+    tech: {
+      crossOrigin() {
+        return null;
+      }
+    }
   });
 
   const anotherTrack = new TextTrack({
     src: 'example.com/spanish.vtt',
     kind: 'captions',
     srclang: 'es',
     label: 'Spanish',
-    tech: {}
+    tech: {
+      crossOrigin() {
+        return null;
+      }
+    }
   });
 
   const tt = new TextTrackList();
@@ -198,6 +224,9 @@ QUnit.test('textTracksToJson produces good json output for emulated only', funct
         }
       };
     },
+    crossOrigin() {
+      return null;
+    },
     textTracks() {
       return tt;
     }
@@ -227,15 +256,23 @@ QUnit.test('jsonToTextTracks calls addRemoteTextTrack on the tech with emulated
     label: 'English',
     language: 'en',
     src: 'example.com/english.vtt',
-    tech: {}
+    tech: {
+      crossOrigin() {
+        return null;
+      }
+    }
   });
 
   const anotherTrack = new TextTrack({
     src: 'example.com/spanish.vtt',
     kind: 'captions',
     srclang: 'es',
     label: 'Spanish',
-    tech: {}
+    tech: {
+      crossOrigin() {
+        return null;
+      }
+    }
   });
 
   const tt = new TextTrackList();
@@ -256,6 +293,9 @@ QUnit.test('jsonToTextTracks calls addRemoteTextTrack on the tech with emulated
         }
       };
     },
+    crossOrigin() {
+      return null;
+    },
     textTracks() {
       return tt;
     },

test/unit/tracks/text-track.test.js

@@ -447,12 +447,66 @@ QUnit.test('tracks are parsed if vttjs is loaded', function(assert) {
     src: 'http://example.com'
   });
 
-  reqs.pop().respond(200, null, 'WEBVTT\n');
+  const req = reqs.pop();
+
+  req.respond(200, null, 'WEBVTT\n');
 
   assert.ok(parserCreated, 'WebVTT is loaded, so we can just parse');
+  assert.notOk(req.withCredentials, 'the request defaults not to send credentials');
+
+  clock.restore();
+  tt.off();
+  window.WebVTT = oldVTT;
+});
+
+QUnit.test('tracks are loaded withCredentials is crossorigin is set to use-credentials', function(assert) {
+  const clock = sinon.useFakeTimers();
+  const oldVTT = window.WebVTT;
+  const reqs = [];
+
+  this.xhr.onCreate = function(req) {
+    reqs.push(req);
+  };
+
+  window.WebVTT = () => {};
+  window.WebVTT.StringDecoder = () => {};
+  window.WebVTT.Parser = () => {
+    return {
+      oncue() {},
+      onparsingerror() {},
+      onflush() {},
+      parse() {},
+      flush() {}
+    };
+  };
+
+  this.tech.crossOrigin = () => 'use-credentials';
+
+  const tt = new TextTrack({
+    tech: this.tech,
+    src: 'http://example.com'
+  });
+
+  const req = reqs.pop();
+
+  assert.ok(req.withCredentials, 'the request was made withCredentials');
+
+  this.tech.crossOrigin = () => 'anonymous';
+
+  const tt2 = new TextTrack({
+    tech: this.tech,
+    src: 'http://example.com'
+  });
+
+  const req2 = reqs.pop();
+
+  assert.notOk(req2.withCredentials, 'the request was not made withCredentials');
 
+  req.abort();
+  req2.abort();
   clock.restore();
   tt.off();
+  tt2.off();
   window.WebVTT = oldVTT;
 });
 
@@ -472,6 +526,7 @@ QUnit.test('tracks are parsed once vttjs is loaded', function(assert) {
 
   testTech.textTracks = () => {};
   testTech.currentTime = () => {};
+  testTech.crossOrigin = () => null;
 
   const tt = new TextTrack({
     tech: testTech,
@@ -526,6 +581,7 @@ QUnit.test('stops processing if vttjs loading errored out', function(assert) {
 
   testTech.textTracks = () => {};
   testTech.currentTime = () => {};
+  testTech.crossOrigin = () => null;
 
   sinon.stub(testTech, 'off');
   testTech.off.withArgs('vttjsloaded');