diff --git a/src/js/spatial-navigation.js b/src/js/spatial-navigation.js index aa37bbf5d1..4f0e38c90b 100644 --- a/src/js/spatial-navigation.js +++ b/src/js/spatial-navigation.js @@ -56,6 +56,9 @@ class SpatialNavigation extends EventTarget { this.player_.on('modalclose', () => { this.refocusComponent(); }); + this.player_.on('error', () => { + this.focus(this.updateFocusableComponents()[0]); + }); this.player_.on('focusin', this.handlePlayerFocus_.bind(this)); this.player_.on('focusout', this.handlePlayerBlur_.bind(this)); this.isListening_ = true; @@ -196,7 +199,7 @@ class SpatialNavigation extends EventTarget { } if (!(event.currentTarget.contains(event.relatedTarget)) && !isChildrenOfPlayer || !nextFocusedElement) { - if (currentComponent.name() === 'CloseButton') { + if (currentComponent && currentComponent.name() === 'CloseButton') { this.refocusComponent(); } else { this.pause(); @@ -307,7 +310,11 @@ class SpatialNavigation extends EventTarget { return null; } - return searchForSuitableChild(component.el()); + if (component.el()) { + return searchForSuitableChild(component.el()); + } + return null; + } /** @@ -464,7 +471,7 @@ class SpatialNavigation extends EventTarget { */ refocusComponent() { if (this.lastFocusedComponent_) { - // If use is not active, set it to active. + // If user is not active, set it to active. if (!this.player_.userActive()) { this.player_.userActive(true); } @@ -492,6 +499,10 @@ class SpatialNavigation extends EventTarget { * @param {Component} component - The component to be focused. */ focus(component) { + if (typeof component !== 'object') { + return; + } + if (component.getIsAvailableToBeFocused(component.el())) { component.focus(); } else if (this.findSuitableDOMChild(component)) { diff --git a/test/unit/spatial-navigation.test.js b/test/unit/spatial-navigation.test.js index 0a28a58bea..08ade281a8 100644 --- a/test/unit/spatial-navigation.test.js +++ b/test/unit/spatial-navigation.test.js @@ -44,6 +44,7 @@ QUnit.test('start method initializes event listeners', function(assert) { assert.ok(onSpy.calledWith('loadedmetadata'), 'loadedmetadata event listener added'); assert.ok(onSpy.calledWith('modalKeydown'), 'modalKeydown event listener added'); assert.ok(onSpy.calledWith('modalclose'), 'modalclose event listener added'); + assert.ok(onSpy.calledWith('error'), 'error event listener added'); // Additionally, check if isListening_ flag is set assert.ok(this.spatialNav.isListening_, 'isListening_ flag is set'); @@ -491,3 +492,13 @@ QUnit.test('should call `searchForTrackSelect()` if spatial navigation is enable assert.ok(trackSelectSpy.calledOnce); }); + +QUnit.test('error on player calls updateFocusableComponents', function(assert) { + const updateFocusableComponentsSpy = sinon.spy(this.spatialNav, 'updateFocusableComponents'); + + this.spatialNav.start(); + + this.player.error('Error 1'); + + assert.ok(updateFocusableComponentsSpy.calledOnce, 'on error event spatial navigation should call "updateFocusableComponents"'); +});