diff --git a/common/lib/xmodule/xmodule/js/fixtures/video.html b/common/lib/xmodule/xmodule/js/fixtures/video.html index 6e4df9ec9c..410b5869f0 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/video.html +++ b/common/lib/xmodule/xmodule/js/fixtures/video.html @@ -13,6 +13,8 @@ data-yt-test-timeout="1500" data-yt-test-url="https://gdata.youtube.com/feeds/api/videos/" > +
+
@@ -51,6 +53,8 @@
+ +
diff --git a/common/lib/xmodule/xmodule/js/fixtures/video_all.html b/common/lib/xmodule/xmodule/js/fixtures/video_all.html index 49fb72b16f..f155905282 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/video_all.html +++ b/common/lib/xmodule/xmodule/js/fixtures/video_all.html @@ -16,6 +16,8 @@ data-yt-test-timeout="1500" data-yt-test-url="https://gdata.youtube.com/feeds/api/videos/" > +
+
@@ -54,6 +56,8 @@
+ +
diff --git a/common/lib/xmodule/xmodule/js/fixtures/video_html5.html b/common/lib/xmodule/xmodule/js/fixtures/video_html5.html index 7a221a10f7..32789b6ba9 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/video_html5.html +++ b/common/lib/xmodule/xmodule/js/fixtures/video_html5.html @@ -16,6 +16,8 @@ data-yt-test-timeout="1500" data-yt-test-url="https://gdata.youtube.com/feeds/api/videos/" > +
+
@@ -26,6 +28,8 @@
+ +
diff --git a/common/lib/xmodule/xmodule/js/fixtures/video_no_captions.html b/common/lib/xmodule/xmodule/js/fixtures/video_no_captions.html index 69207230fa..61975784c1 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/video_no_captions.html +++ b/common/lib/xmodule/xmodule/js/fixtures/video_no_captions.html @@ -13,6 +13,8 @@ data-yt-test-timeout="1500" data-yt-test-url="https://gdata.youtube.com/feeds/api/videos/" > +
+
@@ -21,7 +23,9 @@
+ +
- \ No newline at end of file + diff --git a/common/lib/xmodule/xmodule/js/fixtures/video_yt_multiple.html b/common/lib/xmodule/xmodule/js/fixtures/video_yt_multiple.html index 26325b45e1..834de10406 100644 --- a/common/lib/xmodule/xmodule/js/fixtures/video_yt_multiple.html +++ b/common/lib/xmodule/xmodule/js/fixtures/video_yt_multiple.html @@ -13,6 +13,8 @@ data-yt-test-timeout="1500" data-yt-test-url="https://gdata.youtube.com/feeds/api/videos/" > +
+
@@ -51,6 +53,8 @@
+ +
diff --git a/common/lib/xmodule/xmodule/js/spec/video/video_focus_grabber_spec.js b/common/lib/xmodule/xmodule/js/spec/video/video_focus_grabber_spec.js new file mode 100644 index 0000000000..7a719bc62d --- /dev/null +++ b/common/lib/xmodule/xmodule/js/spec/video/video_focus_grabber_spec.js @@ -0,0 +1,62 @@ +(function () { + describe('Video FocusGrabber', function () { + var state; + + beforeEach(function () { + loadFixtures('video_html5.html'); + state = new Video('#example'); + + spyOnEvent(state.el, 'mousemove'); + spyOn(state.focusGrabber, 'disableFocusGrabber').andCallThrough(); + spyOn(state.focusGrabber, 'enableFocusGrabber').andCallThrough(); + }); + + it('check existence of focus grabber elements and their position', function () { + var firstFGEl = state.el.find('.focus_grabber.first'), + lastFGEl = state.el.find('.focus_grabber.last'), + tcWrapperEl = state.el.find('.tc-wrapper'); + + // Existence check. + expect(firstFGEl.length).toBe(1); + expect(lastFGEl.length).toBe(1); + + // Position check. + expect(firstFGEl.index() + 1).toBe(tcWrapperEl.index()); + expect(lastFGEl.index() - 1).toBe(tcWrapperEl.index()); + }); + + it('from the start, focus grabbers are disabled', function () { + expect(state.focusGrabber.elFirst.attr('tabindex')).toBe(-1); + expect(state.focusGrabber.elLast.attr('tabindex')).toBe(-1); + }); + + it('when first focus grabber is focused "mousemove" event is triggered, grabbers are disabled', function () { + state.focusGrabber.elFirst.focus(); + + expect('mousemove').toHaveBeenTriggeredOn(state.el); + expect(state.focusGrabber.disableFocusGrabber).toHaveBeenCalled(); + }); + + it('when last focus grabber is focused "mousemove" event is triggered, grabbers are disabled', function () { + state.focusGrabber.elLast.focus(); + + expect('mousemove').toHaveBeenTriggeredOn(state.el); + expect(state.focusGrabber.disableFocusGrabber).toHaveBeenCalled(); + }); + + it('after controls autohide focus grabbers are enabled', function () { + runs(function () { + console.log('focus 1: a'); + state.videoCaption.hideCaptions(true); + state.el.trigger('mousemove'); + console.log('focus 1: b'); + }); + + waits(2 * (state.videoControl.fadeOutTimeout + 100)); + + runs(function () { + expect(state.focusGrabber.enableFocusGrabber).toHaveBeenCalled(); + }); + }); + }); +}).call(this); diff --git a/common/lib/xmodule/xmodule/js/src/video/025_focus_grabber.js b/common/lib/xmodule/xmodule/js/src/video/025_focus_grabber.js index 5fea7cce53..7d95871b50 100644 --- a/common/lib/xmodule/xmodule/js/src/video/025_focus_grabber.js +++ b/common/lib/xmodule/xmodule/js/src/video/025_focus_grabber.js @@ -44,8 +44,10 @@ function () { // Private functions. function _makeFunctionsPublic(state) { - state.focusGrabber.enableFocusGrabber = _.bind(enableFocusGrabber, state); + state.focusGrabber.enableFocusGrabber = _.bind(enableFocusGrabber, state); state.focusGrabber.disableFocusGrabber = _.bind(disableFocusGrabber, state); + + state.focusGrabber.onFocus = _.bind(onFocus, state); } function _renderElements(state) {