diff --git a/common/lib/xmodule/xmodule/js/fixtures/video_yt_multiple.html b/common/lib/xmodule/xmodule/js/fixtures/video_yt_multiple.html
new file mode 100644
index 0000000000000000000000000000000000000000..26325b45e11677f018b3bb4d2c0c24eb8e908f5e
--- /dev/null
+++ b/common/lib/xmodule/xmodule/js/fixtures/video_yt_multiple.html
@@ -0,0 +1,171 @@
+<div class="course-content">
+ <div id="video_example1">
+ <div id="example1">
+ <div
+ id="video_id1"
+ class="video"
+ data-streams="0.75:7tqY6eQzVhE,1.0:cogebirgzzM"
+ data-show-captions="true"
+ data-start=""
+ data-end=""
+ data-caption-asset-path="/static/subs/"
+ data-autoplay="False"
+ data-yt-test-timeout="1500"
+ data-yt-test-url="https://gdata.youtube.com/feeds/api/videos/"
+ >
+ <div class="tc-wrapper">
+ <article class="video-wrapper">
+ <div class="video-player-pre"></div>
+ <section class="video-player">
+ <div id="id1"></div>
+ </section>
+ <div class="video-player-post"></div>
+ <section class="video-controls">
+ <div class="slider"></div>
+ <div>
+ <ul class="vcr">
+ <li><a class="video_control" href="#" title="Play"></a></li>
+ <li><div class="vidtime">0:00 / 0:00</div></li>
+ </ul>
+ <div class="secondary-controls">
+ <div class="speeds">
+ <a href="#">
+ <h3>Speed</h3>
+ <p class="active"></p>
+ </a>
+ <ol class="video_speeds"></ol>
+ </div>
+ <div class="volume">
+ <a href="#"></a>
+ <div class="volume-slider-container">
+ <div class="volume-slider"></div>
+ </div>
+ </div>
+ <a href="#" class="add-fullscreen" title="Fill browser">Fill Browser</a>
+ <a href="#" class="quality_control" title="HD">HD</a>
+ <a href="#" class="hide-subtitles" title="Turn off captions">Captions</a>
+ </div>
+ </div>
+ </section>
+ </article>
+
+ <ol class="subtitles"><li></li></ol>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+<div class="course-content">
+ <div id="video_example2">
+ <div id="example2">
+ <div
+ id="video_id2"
+ class="video"
+ data-streams="0.75:7tqY6eQzVhE,1.0:cogebirgzzM"
+ data-show-captions="true"
+ data-start=""
+ data-end=""
+ data-caption-asset-path="/static/subs/"
+ data-autoplay="False"
+ data-yt-test-timeout="1500"
+ data-yt-test-url="https://gdata.youtube.com/feeds/api/videos/"
+ >
+ <div class="tc-wrapper">
+ <article class="video-wrapper">
+ <div class="video-player-pre"></div>
+ <section class="video-player">
+ <div id="id2"></div>
+ </section>
+ <div class="video-player-post"></div>
+ <section class="video-controls">
+ <div class="slider"></div>
+ <div>
+ <ul class="vcr">
+ <li><a class="video_control" href="#" title="Play"></a></li>
+ <li><div class="vidtime">0:00 / 0:00</div></li>
+ </ul>
+ <div class="secondary-controls">
+ <div class="speeds">
+ <a href="#">
+ <h3>Speed</h3>
+ <p class="active"></p>
+ </a>
+ <ol class="video_speeds"></ol>
+ </div>
+ <div class="volume">
+ <a href="#"></a>
+ <div class="volume-slider-container">
+ <div class="volume-slider"></div>
+ </div>
+ </div>
+ <a href="#" class="add-fullscreen" title="Fill browser">Fill Browser</a>
+ <a href="#" class="quality_control" title="HD">HD</a>
+ <a href="#" class="hide-subtitles" title="Turn off captions">Captions</a>
+ </div>
+ </div>
+ </section>
+ </article>
+
+ <ol class="subtitles"><li></li></ol>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+<div class="course-content">
+ <div id="video_example3">
+ <div id="example3">
+ <div
+ id="video_id3"
+ class="video"
+ data-streams="0.75:7tqY6eQzVhE,1.0:cogebirgzzM"
+ data-show-captions="true"
+ data-start=""
+ data-end=""
+ data-caption-asset-path="/static/subs/"
+ data-autoplay="False"
+ data-yt-test-timeout="1500"
+ data-yt-test-url="https://gdata.youtube.com/feeds/api/videos/"
+ >
+ <div class="tc-wrapper">
+ <article class="video-wrapper">
+ <div class="video-player-pre"></div>
+ <section class="video-player">
+ <div id="id3"></div>
+ </section>
+ <div class="video-player-post"></div>
+ <section class="video-controls">
+ <div class="slider"></div>
+ <div>
+ <ul class="vcr">
+ <li><a class="video_control" href="#" title="Play"></a></li>
+ <li><div class="vidtime">0:00 / 0:00</div></li>
+ </ul>
+ <div class="secondary-controls">
+ <div class="speeds">
+ <a href="#">
+ <h3>Speed</h3>
+ <p class="active"></p>
+ </a>
+ <ol class="video_speeds"></ol>
+ </div>
+ <div class="volume">
+ <a href="#"></a>
+ <div class="volume-slider-container">
+ <div class="volume-slider"></div>
+ </div>
+ </div>
+ <a href="#" class="add-fullscreen" title="Fill browser">Fill Browser</a>
+ <a href="#" class="quality_control" title="HD">HD</a>
+ <a href="#" class="hide-subtitles" title="Turn off captions">Captions</a>
+ </div>
+ </div>
+ </section>
+ </article>
+
+ <ol class="subtitles"><li></li></ol>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/common/lib/xmodule/xmodule/js/spec/video/general_spec.js b/common/lib/xmodule/xmodule/js/spec/video/general_spec.js
index 9f3ab5916a20c3d7b0a3a46b65f48af3c0685e1f..3444f5389f2cf7d29dafe8148d084cb22c7b0faa 100644
--- a/common/lib/xmodule/xmodule/js/spec/video/general_spec.js
+++ b/common/lib/xmodule/xmodule/js/spec/video/general_spec.js
@@ -186,6 +186,46 @@
});
});
+ describe('multiple YT on page', function () {
+ var state1, state2, state3;
+
+ beforeEach(function () {
+ loadFixtures('video_yt_multiple.html');
+
+ spyOn($, 'ajaxWithPrefix');
+
+ $.ajax.calls.length = 0;
+ $.ajaxWithPrefix.calls.length = 0;
+
+ // Because several other tests have run, the variable
+ // that stores the value of the first ajax request must be
+ // cleared so that we test a pristine state of the video
+ // module.
+ Video.clearYoutubeXhr();
+
+ state1 = new Video('#example1');
+ state2 = new Video('#example2');
+ state3 = new Video('#example3');
+ });
+
+ it('check for YT availability is performed only once', function () {
+ var numAjaxCalls = 0;
+
+ // Total ajax calls made.
+ numAjaxCalls = $.ajax.calls.length;
+
+ // Subtract ajax calls to get captions.
+ numAjaxCalls -= $.ajaxWithPrefix.calls.length;
+
+ // Subtract ajax calls to get metadata for each video.
+ numAjaxCalls -= 3;
+
+ // This should leave just one call. It was made to check
+ // for YT availability.
+ expect(numAjaxCalls).toBe(1);
+ });
+ });
+
describe('setSpeed', function () {
describe('YT', function () {
beforeEach(function () {