@enact/spotlight - npm Package Compare versions

Comparing version 4.8.0 to 4.9.0-alpha.1

CHANGELOG.md

@@ -5,2 +5,14 @@ # Change Log
 
+## [4.9.0-alpha.1] - 2024-04-09
+
+### Fixed
+
+- `spotlight` navigation from the focused element clipped by an overflow container
+
+## [4.7.10] - 2024-03-05
+
+### Fixed
+
+- `spotlight` navigation from the focused element clipped by an overflow container
+
 ## [4.8.0] - 2024-02-08
@@ -7,0 +19,0 @@

package.json

 {
   "name": "@enact/spotlight",
-  "version": "4.8.0",
+  "version": "4.9.0-alpha.1",
   "description": "A focus management library",
@@ -28,3 +28,3 @@ "repository": {
   "dependencies": {
-    "@enact/core": "^4.8.0",
+    "@enact/core": "^4.9.0-alpha.1",
     "classnames": "^2.5.1",
@@ -31,0 +31,0 @@ "prop-types": "^15.8.1",

SpotlightContainerDecorator/SpotlightContainerDecorator.js

@@ -39,3 +39,3 @@ "use strict";
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
@@ -42,0 +42,0 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }

SpotlightRootDecorator/SpotlightRootDecorator.js

@@ -49,3 +49,3 @@ "use strict";
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } /**
@@ -52,0 +52,0 @@ * Exports the {@link spotlight/SpotlightRootDecorator.SpotlightRootDecorator}

SpotlightRootDecorator/tests/SpotlightRootDecorator-specs.js

@@ -6,2 +6,3 @@ "use strict";
 var _SpotlightRootDecorator = require("../SpotlightRootDecorator");
+var _container = require("../../src/container");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -41,2 +42,10 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
   });
+  test('should set spotlightRootDecorator container enterTo config to `null` by default', function () {
+    var App = (0, _SpotlightRootDecorator.SpotlightRootDecorator)(AppBase);
+    (0, _react.render)( /*#__PURE__*/(0, _jsxRuntime.jsx)(App, {}));
+    var containerConfig = (0, _container.getContainerConfig)('spotlightRootDecorator');
+    var expected = null;
+    var actual = containerConfig.enterTo;
+    expect(actual).toBe(expected);
+  });
 });

Spottable/Spottable.js

@@ -48,3 +48,3 @@ "use strict";
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
@@ -51,0 +51,0 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }

Spottable/tests/useSpot-specs.js

@@ -25,3 +25,3 @@ "use strict";
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
@@ -28,0 +28,0 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }

src/container.js

@@ -19,2 +19,3 @@ "use strict";
 exports.getNavigableContainersForNode = getNavigableContainersForNode;
+exports.getPositionTargetOnFocus = getPositionTargetOnFocus;
 exports.isNavigable = exports.isContainer5WayHoldable = exports.isContainer = exports.getSpottableDescendants = void 0;
@@ -88,4 +89,4 @@ exports.isWithinOverflowContainer = isWithinOverflowContainer;
   // <extSelector> except "@" syntax.
-  enterTo: '',
-  // '', 'last-focused', 'default-element'
+  enterTo: null,
+  // null, 'last-focused', 'default-element'
   isStandardFocusableMode: false,
@@ -121,2 +122,4 @@ // @private - set to true to focus standard focusable element
   // use the container bounds for partitioning when leaving
+  positionTargetOnFocus: false,
+  // @private - use the container for the position target when its descendants is focused
   rememberSource: false,
@@ -1088,2 +1091,20 @@ restrict: 'self-first',
   });
+}
+
+/**
+ * Returns the closest container that wrap the element and has positionTargetOnFocus configured
+ *
+ * @param {Node} spotItem Focused element
+ * @param {String[]} containerIds Ids for containers that wrap the spotItem element
+ * @private
+ */
+function getPositionTargetOnFocus(spotItem) {
+  var containerIds = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getContainersForNode(spotItem);
+  return containerIds.reduce(function (result, containerId) {
+    var _getContainerConfig;
+    if ((_getContainerConfig = getContainerConfig(containerId)) !== null && _getContainerConfig !== void 0 && _getContainerConfig.positionTargetOnFocus) {
+      result = getContainerNode(containerId);
+    }
+    return result;
+  }, spotItem);
 }

src/spotlight.js

@@ -445,6 +445,6 @@ "use strict";
         window.addEventListener('mousemove', onMouseMove);
-        if (_platform["default"].touch) {
+        if (_platform["default"].touchEvent) {
           window.addEventListener('touchend', onTouchEnd);
         }
-        if (_platform["default"].webos) {
+        if (_platform["default"].type === 'webos') {
           window.top.document.addEventListener('webOSMouse', handleWebOSMouseEvent);
@@ -479,6 +479,6 @@ window.top.document.addEventListener('keyboardStateChange', handleKeyboardStateChangeEvent);
       window.removeEventListener('mousemove', onMouseMove);
-      if (_platform["default"].touch) {
+      if (_platform["default"].touchEvent) {
         window.removeEventListener('touchend', onTouchEnd);
       }
-      if (_platform["default"].webos) {
+      if (_platform["default"].type === 'webos') {
         window.top.document.removeEventListener('webOSMouse', handleWebOSMouseEvent);
@@ -485,0 +485,0 @@ window.top.document.removeEventListener('keyboardStateChange', handleKeyboardStateChangeEvent);

src/target.js

@@ -299,2 +299,4 @@ "use strict";
 function getTargetByDirectionFromElement(direction, element) {
+  var _getContainerConfig;
+  var getIntersectRectOfElem = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
   var extSelector = element.getAttribute('data-spot-' + direction);
@@ -304,5 +306,5 @@ if (typeof extSelector === 'string') {
   }
-  var elementRect = (0, _utils.getRect)(element);
+  var elementContainerId = (0, _container.getContainersForNode)(element).pop();
   var next = (0, _container.getNavigableContainersForNode)(element).reduceRight(function (result, containerId, index, elementContainerIds) {
-    result = result || getTargetInContainerByDirectionFromElement(direction, containerId, element, elementRect, elementContainerIds);
+    result = result || getTargetInContainerByDirectionFromElement(direction, containerId, element, getIntersectRectOfElem ? (0, _utils.getIntersectionRect)((0, _container.getContainerNode)(elementContainerId), element) : (0, _utils.getRect)(element), elementContainerIds);
     if (!result) {
@@ -321,5 +323,13 @@ result = getLeaveForTarget(containerId, direction);
 
-  // if the reduce above returns the original element, it means it hit a `leaveFor` config that
+  // If the reduce above returns the original element,
+  // check if the element is clipped by an overflow container. If true, find the target by direction with the intersection rect of the element.
+  // If the reduce above returns the original element again, it means it hit a `leaveFor` config that
   // prevents navigation so we enforce that here by returning null.
-  return next !== element ? next : null;
+  if (next !== element) {
+    return next;
+  } else if (elementContainerId !== _container.rootContainerId && (_getContainerConfig = (0, _container.getContainerConfig)(elementContainerId)) !== null && _getContainerConfig !== void 0 && _getContainerConfig.overflow && !getIntersectRectOfElem) {
+    return getTargetByDirectionFromElement(direction, element, true);
+  } else {
+    return null;
+  }
 }
@@ -326,0 +336,0 @@ function getTargetByDirectionFromPosition(direction, position, containerId) {

src/tests/container-specs.js

 "use strict";
 
-var _container17 = require("../container");
+var _container19 = require("../container");
 var _utils = require("./utils");
@@ -19,20 +19,20 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
   nestedContainers: (0, _utils.container)((0, _utils.container)((0, _utils.container)())),
-  disabledContainers: (0, _utils.join)((0, _utils.someSpottables)(5), (0, _utils.someContainers)(5), (0, _utils.node)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'disabled-container'), 'data-spotlight-container-disabled', true))),
+  disabledContainers: (0, _utils.join)((0, _utils.someSpottables)(5), (0, _utils.someContainers)(5), (0, _utils.node)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'disabled-container'), 'data-spotlight-container-disabled', true))),
   nestedContainersWithSpottables: (0, _utils.join)((0, _utils.someSpottables)(5), (0, _utils.container)({
     children: (0, _utils.someSpottables)(5)
   })),
-  siblingContainers: (0, _utils.join)((0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'first'), "children", (0, _utils.someSpottables)(5))), (0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'second'), "children", (0, _utils.someSpottables)(5)))),
-  mixedOrder: (0, _utils.join)((0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'first'), "name", 'c1')), (0, _utils.spottable)({
+  siblingContainers: (0, _utils.join)((0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'first'), "children", (0, _utils.someSpottables)(5))), (0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'second'), "children", (0, _utils.someSpottables)(5)))),
+  mixedOrder: (0, _utils.join)((0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'first'), "name", 'c1')), (0, _utils.spottable)({
     name: 's1'
-  }), (0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'second'), "name", 'c2')), (0, _utils.spottable)({
+  }), (0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'second'), "name", 'c2')), (0, _utils.spottable)({
     name: 's2'
   })),
-  complexTree: (0, _utils.join)((0, _utils.spottable)(nonSpottable()), (0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'first-container'), "children", (0, _utils.join)((0, _utils.someSpottables)(2), (0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'second-container'), "children", (0, _utils.join)((0, _utils.spottable)({
+  complexTree: (0, _utils.join)((0, _utils.spottable)(nonSpottable()), (0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'first-container'), "children", (0, _utils.join)((0, _utils.someSpottables)(2), (0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'second-container'), "children", (0, _utils.join)((0, _utils.spottable)({
     id: 'secondContainerFirstSpottable'
-  }), (0, _utils.someSpottables)(2), (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'third-container'), 'data-spotlight-container-disabled', true), "children", (0, _utils.join)((0, _utils.someSpottables)(4), (0, _utils.node)({
+  }), (0, _utils.someSpottables)(2), (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'third-container'), 'data-spotlight-container-disabled', true), "children", (0, _utils.join)((0, _utils.someSpottables)(4), (0, _utils.node)({
     id: 'child-of-third'
   }))))))))))),
-  spottablesInDisabledContainer: (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'container'), 'data-spotlight-container-disabled', true), "children", (0, _utils.someSpottables)(5))),
-  spottablesInNestedDisabledContainer: (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'container'), 'data-spotlight-container-disabled', true), "children", (0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'child'), "children", (0, _utils.someSpottables)(5))))),
-  containerWithDefaultAndLastFocused: (0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'container'), "children", (0, _utils.join)((0, _utils.spottable)({
+  spottablesInDisabledContainer: (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'container'), 'data-spotlight-container-disabled', true), "children", (0, _utils.someSpottables)(5))),
+  spottablesInNestedDisabledContainer: (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'container'), 'data-spotlight-container-disabled', true), "children", (0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'child'), "children", (0, _utils.someSpottables)(5))))),
+  containerWithDefaultAndLastFocused: (0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'container'), "children", (0, _utils.join)((0, _utils.spottable)({
     id: 'firstSpottable'
@@ -45,5 +45,5 @@ }), (0, _utils.someSpottables)(5), (0, _utils.node)({
   })))),
-  nestedContainersWithDefaultAndLastFocused: (0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'container'), "children", (0, _utils.join)((0, _utils.spottable)({
+  nestedContainersWithDefaultAndLastFocused: (0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'container'), "children", (0, _utils.join)((0, _utils.spottable)({
     id: 'firstSpottable'
-  }), (0, _utils.someSpottables)(5), (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'child'), "id", 'spottableDefault'), "className", 'spottable-default'), "children", (0, _utils.join)((0, _utils.spottable)({
+  }), (0, _utils.someSpottables)(5), (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'child'), "id", 'spottableDefault'), "className", 'spottable-default'), "children", (0, _utils.join)((0, _utils.spottable)({
     id: 'firstChildSpottable'
@@ -55,3 +55,3 @@ }), (0, _utils.someSpottables)(5), (0, _utils.spottable)({
   })))),
-  emptySubcontainer: (0, _utils.container)(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'container'), "children", (0, _utils.join)((0, _utils.container)(_defineProperty({}, _container17.containerAttribute, 'subcontainer')), (0, _utils.spottable)({
+  emptySubcontainer: (0, _utils.container)(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'container'), "children", (0, _utils.join)((0, _utils.container)(_defineProperty({}, _container19.containerAttribute, 'subcontainer')), (0, _utils.spottable)({
     id: 'afterSubcontainer'
@@ -63,16 +63,21 @@ })))),
     id: 'n1'
-  }), (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty({}, _container17.containerAttribute, 'container'), 'aria-owns', 's1 n1'), "children", (0, _utils.spottable)({
+  }), (0, _utils.container)(_defineProperty(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'container'), 'aria-owns', 's1 n1'), "children", (0, _utils.spottable)({
     id: 's2'
-  }))))
+  })))),
+  positionTargetOnFocusContainer: (0, _utils.container)(_defineProperty(_defineProperty({
+    id: 'positionTargetContainer'
+  }, _container19.containerAttribute, 'positionTargetContainer'), "children", (0, _utils.join)((0, _utils.container)(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, _container19.containerAttribute, 'child'), "id", 'spottableDefault'), "className", 'spottable-default'), "children", (0, _utils.join)((0, _utils.spottable)({
+    id: 'firstChildSpottable'
+  })))))))
 };
 var setupContainers = function setupContainers() {
-  (0, _container17.configureDefaults)({
+  (0, _container19.configureDefaults)({
     selector: '.spottable'
   });
-  (0, _container17.configureContainer)(_container17.rootContainerId);
-  (0, _container17.setLastContainer)(_container17.rootContainerId);
+  (0, _container19.configureContainer)(_container19.rootContainerId);
+  (0, _container19.setLastContainer)(_container19.rootContainerId);
 };
 var teardownContainers = function teardownContainers() {
   // clean up any containers we create for safe tests
-  (0, _container17.removeAllContainers)();
+  (0, _container19.removeAllContainers)();
 };
@@ -85,3 +90,3 @@ describe('container', function () {
       var expected = 5;
-      var actual = (0, _container17.getSpottableDescendants)(_container17.rootContainerId).length;
+      var actual = (0, _container19.getSpottableDescendants)(_container19.rootContainerId).length;
       expect(actual).toBe(expected);
@@ -91,3 +96,3 @@ }));
       var expected = 5;
-      var actual = (0, _container17.getSpottableDescendants)(_container17.rootContainerId).length;
+      var actual = (0, _container19.getSpottableDescendants)(_container19.rootContainerId).length;
       expect(actual).toBe(expected);
@@ -97,3 +102,3 @@ }));
       var expected = 10;
-      var actual = (0, _container17.getSpottableDescendants)(_container17.rootContainerId).length;
+      var actual = (0, _container19.getSpottableDescendants)(_container19.rootContainerId).length;
       expect(actual).toBe(expected);
@@ -103,3 +108,3 @@ }));
       var expected = 5;
-      var actual = (0, _container17.getSpottableDescendants)(_container17.rootContainerId).length;
+      var actual = (0, _container19.getSpottableDescendants)(_container19.rootContainerId).length;
       expect(actual).toBe(expected);
@@ -109,3 +114,3 @@ }));
       var expected = 1;
-      var actual = (0, _container17.getSpottableDescendants)(_container17.rootContainerId).length;
+      var actual = (0, _container19.getSpottableDescendants)(_container19.rootContainerId).length;
       expect(actual).toBe(expected);
@@ -115,35 +120,35 @@ }));
       var expected = 6;
-      var actual = (0, _container17.getSpottableDescendants)(_container17.rootContainerId).length;
+      var actual = (0, _container19.getSpottableDescendants)(_container19.rootContainerId).length;
       expect(actual).toBe(expected);
     }));
     test('should not find spottables in sibling containers', (0, _utils.testScenario)(scenarios.siblingContainers, function () {
-      (0, _container17.configureContainer)('first');
+      (0, _container19.configureContainer)('first');
       var expected = 5;
-      var actual = (0, _container17.getSpottableDescendants)('first').length;
+      var actual = (0, _container19.getSpottableDescendants)('first').length;
       expect(actual).toBe(expected);
     }));
     test('should not find spottables in descendant containers', (0, _utils.testScenario)(scenarios.complexTree, function () {
-      (0, _container17.configureContainer)('first-container');
+      (0, _container19.configureContainer)('first-container');
       var expected = 3;
-      var actual = (0, _container17.getSpottableDescendants)('first-container').length;
+      var actual = (0, _container19.getSpottableDescendants)('first-container').length;
       expect(actual).toBe(expected);
     }));
     test('should not find containers that are disabled', (0, _utils.testScenario)(scenarios.complexTree, function () {
-      (0, _container17.configureContainer)('first-container');
-      (0, _container17.configureContainer)('second-container');
+      (0, _container19.configureContainer)('first-container');
+      (0, _container19.configureContainer)('second-container');
       var expected = 3;
-      var actual = (0, _container17.getSpottableDescendants)('second-container').length;
+      var actual = (0, _container19.getSpottableDescendants)('second-container').length;
       expect(actual).toBe(expected);
     }));
     test('should not any spottables within a disabled container', (0, _utils.testScenario)(scenarios.spottablesInDisabledContainer, function () {
-      (0, _container17.configureContainer)('container');
+      (0, _container19.configureContainer)('container');
       var expected = 0;
-      var actual = (0, _container17.getSpottableDescendants)('container').length;
+      var actual = (0, _container19.getSpottableDescendants)('container').length;
       expect(actual).toBe(expected);
     }));
     test('should not any spottables within a disabled ancestor container', (0, _utils.testScenario)(scenarios.spottablesInNestedDisabledContainer, function () {
-      (0, _container17.configureContainer)('container');
-      (0, _container17.configureContainer)('child');
+      (0, _container19.configureContainer)('container');
+      (0, _container19.configureContainer)('child');
       var expected = 0;
-      var actual = (0, _container17.getSpottableDescendants)('child').length;
+      var actual = (0, _container19.getSpottableDescendants)('child').length;
       expect(actual).toBe(expected);
@@ -153,3 +158,3 @@ }));
       var expected = ['c1', 's1', 'c2', 's2'];
-      var actual = (0, _container17.getSpottableDescendants)(_container17.rootContainerId).map(function (n) {
+      var actual = (0, _container19.getSpottableDescendants)(_container19.rootContainerId).map(function (n) {
         return n.getAttribute('name');
@@ -160,7 +165,7 @@ });
     test('should include owned nodes', (0, _utils.testScenario)(scenarios.owned, function () {
-      (0, _container17.configureContainer)('container');
+      (0, _container19.configureContainer)('container');
 
       // owned nodes follow internal nodes
       var expected = ['s2', 's1'];
-      var actual = (0, _container17.getSpottableDescendants)('container').map(function (n) {
+      var actual = (0, _container19.getSpottableDescendants)('container').map(function (n) {
         return n.getAttribute('id');
@@ -173,4 +178,4 @@ });
     test('should return the rootContainerId when no other containers exist', (0, _utils.testScenario)(scenarios.onlySpottables, function (root) {
-      var expected = [_container17.rootContainerId];
-      var actual = (0, _container17.getContainersForNode)(root.lastChild);
+      var expected = [_container19.rootContainerId];
+      var actual = (0, _container19.getContainersForNode)(root.lastChild);
       expect(actual).toEqual(expected);
@@ -180,4 +185,4 @@ }));
       var childOfThird = root.querySelector('#child-of-third');
-      var expected = [_container17.rootContainerId, 'first-container', 'second-container', 'third-container'];
-      var actual = (0, _container17.getContainersForNode)(childOfThird);
+      var expected = [_container19.rootContainerId, 'first-container', 'second-container', 'third-container'];
+      var actual = (0, _container19.getContainersForNode)(childOfThird);
       expect(actual).toEqual(expected);
@@ -188,3 +193,3 @@ }));
       var expected = 'third-container';
-      var actual = (0, _container17.getContainersForNode)(childOfThird).pop();
+      var actual = (0, _container19.getContainersForNode)(childOfThird).pop();
       expect(actual).toEqual(expected);
@@ -195,6 +200,6 @@ }));
     beforeEach(function () {
-      (0, _container17.configureContainer)('test-container');
+      (0, _container19.configureContainer)('test-container');
     });
     afterEach(function () {
-      (0, _container17.removeContainer)('test-container');
+      (0, _container19.removeContainer)('test-container');
     });
@@ -205,3 +210,3 @@ test('should return true for nodes that have the container attribute', function () {
       var expected = true;
-      var actual = (0, _container17.isContainer)(div);
+      var actual = (0, _container19.isContainer)(div);
       expect(actual).toBe(expected);
@@ -212,3 +217,3 @@ });
       var expected = false;
-      var actual = (0, _container17.isContainer)(div);
+      var actual = (0, _container19.isContainer)(div);
       expect(actual).toBe(expected);
@@ -218,3 +223,3 @@ });
       var expected = true;
-      var actual = (0, _container17.isContainer)('test-container');
+      var actual = (0, _container19.isContainer)('test-container');
       expect(actual).toBe(expected);
@@ -224,3 +229,3 @@ });
       var expected = false;
-      var actual = (0, _container17.isContainer)('unconfigured-container');
+      var actual = (0, _container19.isContainer)('unconfigured-container');
       expect(actual).toBe(expected);
@@ -233,13 +238,13 @@ });
     test('should return the last focused element when enterTo is "last-focused"', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function (root) {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'last-focused',
         defaultElement: '.spottable-default'
       });
-      (0, _container17.setContainerLastFocusedElement)(root.querySelector('#lastFocused'), ['container']);
+      (0, _container19.setContainerLastFocusedElement)(root.querySelector('#lastFocused'), ['container']);
       var expected = 'lastFocused';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the default spottable element when enterTo is "last-focused" but no element has been focused', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'last-focused',
@@ -249,15 +254,15 @@ defaultElement: '.spottable-default'
       var expected = 'spottableDefault';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the first spottable element when enterTo is "last-focused" and defaultElement is not configured', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'last-focused'
       });
       var expected = 'firstSpottable';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the first spottable element when enterTo is "last-focused" and defaultElement is not found', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'last-focused',
@@ -268,7 +273,7 @@ // configured, but not found
       var expected = 'firstSpottable';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the default spottable element when enterTo is "default-element"', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'default-element',
@@ -278,7 +283,7 @@ defaultElement: '.spottable-default'
       var expected = 'spottableDefault';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the default spottable element when enterTo is "default-element" and defaultElement contains an array of selectors', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'default-element',
@@ -288,3 +293,3 @@ defaultElement: ['.does-not-exist', '.spottable-default']
       var expected = 'spottableDefault';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
@@ -296,3 +301,3 @@ }));
     test('should return the default spottable element when enterTo is "default-element" and defaultElement contains an array of selectors wiht a node reference', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function (root) {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'default-element',
@@ -302,15 +307,15 @@ defaultElement: [root.querySelector('#lastFocused'), '.spottable-default']
       var expected = 'lastFocused';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the first spottable element when enterTo is "default-element" but defaultElement is not configured', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'default-element'
       });
       var expected = 'firstSpottable';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the first spottable element when enterTo is "default-element" but defaultElement is not found', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'default-element',
@@ -320,71 +325,71 @@ defaultElement: '[data-default-spottable]'
       var expected = 'firstSpottable';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the default element when enterTo is "default-element" and defaultElement is within a subcontainer', (0, _utils.testScenario)(scenarios.complexTree, function () {
-      (0, _container17.configureContainer)('first-container', {
+      (0, _container19.configureContainer)('first-container', {
         enterTo: 'default-element',
-        defaultElement: "[".concat(_container17.containerAttribute, "='second-container'] > .spottable")
+        defaultElement: "[".concat(_container19.containerAttribute, "='second-container'] > .spottable")
       });
-      (0, _container17.configureContainer)('second-container');
+      (0, _container19.configureContainer)('second-container');
       var expected = 'second-container';
-      var actual = (0, _container17.getContainerFocusTarget)('first-container').parentNode.dataset.spotlightId;
+      var actual = (0, _container19.getContainerFocusTarget)('first-container').parentNode.dataset.spotlightId;
       expect(actual).toBe(expected);
     }));
     test('should return the first spottable element when enterTo is "default-element" and defaultElement is within a disabled subcontainer', (0, _utils.testScenario)(scenarios.complexTree, function () {
-      (0, _container17.configureContainer)('second-container', {
+      (0, _container19.configureContainer)('second-container', {
         enterTo: 'default-element',
-        defaultElement: "[".concat(_container17.containerAttribute, "='third-container'] > .spottable")
+        defaultElement: "[".concat(_container19.containerAttribute, "='third-container'] > .spottable")
       });
-      (0, _container17.configureContainer)('third-container');
+      (0, _container19.configureContainer)('third-container');
       var expected = 'secondContainerFirstSpottable';
-      var actual = (0, _container17.getContainerFocusTarget)('second-container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('second-container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the first spottable element when enterTo is not configured', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container');
+      (0, _container19.configureContainer)('container');
       var expected = 'firstSpottable';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should return the default element when enterTo is not configured and defaultElement is configured', (0, _utils.testScenario)(scenarios.containerWithDefaultAndLastFocused, function () {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         defaultElement: '.spottable-default'
       });
       var expected = 'spottableDefault';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should cascade search into child containers with', (0, _utils.testScenario)(scenarios.nestedContainersWithDefaultAndLastFocused, function (root) {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         defaultElement: '.spottable-default'
       });
-      (0, _container17.configureContainer)('child', {
+      (0, _container19.configureContainer)('child', {
         enterTo: 'last-focused',
         defaultElement: '.spottable-default'
       });
-      (0, _container17.setContainerLastFocusedElement)(root.querySelector('#lastChildFocused'), [_container17.rootContainerId, 'container', 'child']);
+      (0, _container19.setContainerLastFocusedElement)(root.querySelector('#lastChildFocused'), [_container19.rootContainerId, 'container', 'child']);
       var expected = 'lastChildFocused';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should cascade search into child containers when multiple containers have enterTo configured', (0, _utils.testScenario)(scenarios.nestedContainersWithDefaultAndLastFocused, function (root) {
-      (0, _container17.configureContainer)('container', {
+      (0, _container19.configureContainer)('container', {
         enterTo: 'last-focused',
         defaultElement: '.spottable-default'
       });
-      (0, _container17.configureContainer)('child', {
+      (0, _container19.configureContainer)('child', {
         enterTo: 'last-focused',
         defaultElement: '.spottable-default'
       });
-      (0, _container17.setContainerLastFocusedElement)(root.querySelector('#lastChildFocused'), [_container17.rootContainerId, 'container', 'child']);
+      (0, _container19.setContainerLastFocusedElement)(root.querySelector('#lastChildFocused'), [_container19.rootContainerId, 'container', 'child']);
       var expected = 'lastChildFocused';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
     }));
     test('should skip empty subcontainers', (0, _utils.testScenario)(scenarios.emptySubcontainer, function () {
-      (0, _container17.configureContainer)('container');
-      (0, _container17.configureContainer)('subcontainer');
+      (0, _container19.configureContainer)('container');
+      (0, _container19.configureContainer)('subcontainer');
       var expected = 'afterSubcontainer';
-      var actual = (0, _container17.getContainerFocusTarget)('container').id;
+      var actual = (0, _container19.getContainerFocusTarget)('container').id;
       expect(actual).toBe(expected);
@@ -394,3 +399,3 @@ }));
       var expected = null;
-      var actual = (0, _container17.getContainerFocusTarget)('first-container');
+      var actual = (0, _container19.getContainerFocusTarget)('first-container');
       expect(actual).toBe(expected);
@@ -404,3 +409,3 @@ }));
       var expected = false;
-      var actual = (0, _container17.isNavigable)(null, _container17.rootContainerId);
+      var actual = (0, _container19.isNavigable)(null, _container19.rootContainerId);
       expect(actual).toBe(expected);
@@ -410,3 +415,3 @@ });
       var expected = true;
-      var actual = (0, _container17.isNavigable)(root.querySelector('.other'), _container17.rootContainerId);
+      var actual = (0, _container19.isNavigable)(root.querySelector('.other'), _container19.rootContainerId);
       expect(actual).toBe(expected);
@@ -416,3 +421,3 @@ }));
       var expected = true;
-      var actual = (0, _container17.isNavigable)(root.querySelector('.spottable'), _container17.rootContainerId, true);
+      var actual = (0, _container19.isNavigable)(root.querySelector('.spottable'), _container19.rootContainerId, true);
       expect(actual).toBe(expected);
@@ -422,14 +427,14 @@ }));
       var expected = true;
-      var actual = (0, _container17.isNavigable)(root.querySelector("[".concat(_container17.containerAttribute, "]")), _container17.rootContainerId, true);
+      var actual = (0, _container19.isNavigable)(root.querySelector("[".concat(_container19.containerAttribute, "]")), _container19.rootContainerId, true);
       expect(actual).toBe(expected);
     }));
     test('should filter the node with navigableFilter', (0, _utils.testScenario)(scenarios.spottableAndContainers, function (root) {
-      (0, _container17.configureContainer)(_container17.rootContainerId, {
+      (0, _container19.configureContainer)(_container19.rootContainerId, {
         // test filter which makes containers non-navigable
         navigableFilter: function navigableFilter(n) {
-          return !(0, _container17.isContainer)(n);
+          return !(0, _container19.isContainer)(n);
         }
       });
       var expected = false;
-      var actual = (0, _container17.isNavigable)(root.querySelector("[".concat(_container17.containerAttribute, "]")), _container17.rootContainerId, true);
+      var actual = (0, _container19.isNavigable)(root.querySelector("[".concat(_container19.containerAttribute, "]")), _container19.rootContainerId, true);
       expect(actual).toBe(expected);
@@ -443,32 +448,32 @@ }));
       var item = root.querySelectorAll('.spottable').item(3);
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
       var expected = item;
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedElement;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedElement;
       expect(actual).toBe(expected);
     }));
     test('should update lastFocusedElement to the node\'s container id when element is within a container with enterTo configured', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      var item = root.querySelectorAll("[".concat(_container17.containerAttribute, "='first-container'] .spottable")).item(0);
-      (0, _container17.configureContainer)('first-container', {
+      var item = root.querySelectorAll("[".concat(_container19.containerAttribute, "='first-container'] .spottable")).item(0);
+      (0, _container19.configureContainer)('first-container', {
         enterTo: 'last-focused'
       });
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
       var expected = 'first-container';
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedElement;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedElement;
       expect(actual).toBe(expected);
     }));
     test('should ignore sub-containers that does not have enterTo configured', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      var item = root.querySelectorAll("[".concat(_container17.containerAttribute, "='second-container'] .spottable")).item(0);
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
+      var item = root.querySelectorAll("[".concat(_container19.containerAttribute, "='second-container'] .spottable")).item(0);
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
       var expected = item;
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedElement;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedElement;
       expect(actual).toBe(expected);
     }));
     test('should update lastFocusedElement to the first sub-container that has enterTo configured', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      var item = root.querySelectorAll("[".concat(_container17.containerAttribute, "='second-container'] .spottable")).item(0);
-      (0, _container17.configureContainer)('second-container', {
+      var item = root.querySelectorAll("[".concat(_container19.containerAttribute, "='second-container'] .spottable")).item(0);
+      (0, _container19.configureContainer)('second-container', {
         enterTo: 'last-focused'
       });
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
       var expected = 'second-container';
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedElement;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedElement;
       expect(actual).toBe(expected);
@@ -483,17 +488,17 @@ }));
       var item = root.querySelectorAll('.spottable').item(index);
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
-      (0, _container17.unmountContainer)(_container17.rootContainerId);
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
+      (0, _container19.unmountContainer)(_container19.rootContainerId);
       var expected = true;
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedKey.element;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedKey.element;
       expect(actual).toBe(expected);
     }));
     test('should return container when last focused is within a subcontainer with enterTo', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      var item = root.querySelectorAll("[".concat(_container17.containerAttribute, "=\"first-container\"] .spottable")).item(1);
-      (0, _container17.configureContainer)('first-container', {
+      var item = root.querySelectorAll("[".concat(_container19.containerAttribute, "=\"first-container\"] .spottable")).item(1);
+      (0, _container19.configureContainer)('first-container', {
         enterTo: 'last-focused'
       });
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
-      (0, _container17.unmountContainer)(_container17.rootContainerId);
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
+      (0, _container19.unmountContainer)(_container19.rootContainerId);
       var expected = true;
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedKey.container;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedKey.container;
       expect(actual).toBe(expected);
@@ -504,6 +509,6 @@ }));
       var item = root.querySelectorAll('.spottable').item(index);
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
-      (0, _container17.unmountContainer)(_container17.rootContainerId);
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
+      (0, _container19.unmountContainer)(_container19.rootContainerId);
       var expected = index;
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedKey.key;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedKey.key;
       expect(actual).toBe(expected);
@@ -514,3 +519,3 @@ }));
       var item = root.querySelectorAll('.spottable').item(3);
-      (0, _container17.configureContainer)(_container17.rootContainerId, {
+      (0, _container19.configureContainer)(_container19.rootContainerId, {
         lastFocusedPersist: function lastFocusedPersist(n, all) {
@@ -523,32 +528,32 @@ return {
       });
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
-      (0, _container17.unmountContainer)(_container17.rootContainerId);
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
+      (0, _container19.unmountContainer)(_container19.rootContainerId);
       var expected = "item-".concat(index);
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedKey.key;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedKey.key;
       expect(actual).toBe(expected);
     }));
     test('should save the container id as the key when a container with enterTo configured had the last focused item', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      var item = root.querySelectorAll("[".concat(_container17.containerAttribute, "=\"first-container\"] .spottable")).item(1);
-      (0, _container17.configureContainer)('first-container', {
+      var item = root.querySelectorAll("[".concat(_container19.containerAttribute, "=\"first-container\"] .spottable")).item(1);
+      (0, _container19.configureContainer)('first-container', {
         enterTo: 'last-focused'
       });
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
-      (0, _container17.unmountContainer)(_container17.rootContainerId);
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
+      (0, _container19.unmountContainer)(_container19.rootContainerId);
       var expected = 'first-container';
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedKey.key;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedKey.key;
       expect(actual).toBe(expected);
     }));
     test('should save the index as the key when last focused item is only within containers without enterTo configured', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      var item = root.querySelectorAll("[".concat(_container17.containerAttribute, "=\"second-container\"] .spottable")).item(1);
-      (0, _container17.setContainerLastFocusedElement)(item, (0, _container17.getContainersForNode)(item));
-      (0, _container17.unmountContainer)(_container17.rootContainerId);
+      var item = root.querySelectorAll("[".concat(_container19.containerAttribute, "=\"second-container\"] .spottable")).item(1);
+      (0, _container19.setContainerLastFocusedElement)(item, (0, _container19.getContainersForNode)(item));
+      (0, _container19.unmountContainer)(_container19.rootContainerId);
       var expected = 4;
-      var actual = (0, _container17.getContainerConfig)(_container17.rootContainerId).lastFocusedKey.key;
+      var actual = (0, _container19.getContainerConfig)(_container19.rootContainerId).lastFocusedKey.key;
       expect(actual).toBe(expected);
     }));
     test('should mark the container inactive', (0, _utils.testScenario)(scenarios.complexTree, function () {
-      (0, _container17.addContainer)('first-container');
-      (0, _container17.unmountContainer)('first-container');
+      (0, _container19.addContainer)('first-container');
+      (0, _container19.unmountContainer)('first-container');
       var expected = false;
-      var actual = (0, _container17.getContainerConfig)('first-container').active;
+      var actual = (0, _container19.getContainerConfig)('first-container').active;
       expect(actual).toBe(expected);
@@ -561,3 +566,3 @@ }));
     test('should be nearest restrict="self-only" container to current if target is not within it', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      (0, _container17.configureContainer)('first-container', {
+      (0, _container19.configureContainer)('first-container', {
         restrict: 'self-only'
@@ -567,12 +572,12 @@ });
       var target = root.querySelector('.spottable');
-      (0, _container17.setLastContainerFromTarget)(current, target);
+      (0, _container19.setLastContainerFromTarget)(current, target);
       var expected = 'first-container';
-      var actual = (0, _container17.getLastContainer)();
+      var actual = (0, _container19.getLastContainer)();
       expect(actual).toBe(expected);
     }));
     test('should be use nearest container to target if within current container', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      (0, _container17.configureContainer)('first-container', {
+      (0, _container19.configureContainer)('first-container', {
         restrict: 'none'
       });
-      (0, _container17.configureContainer)('second-container', {
+      (0, _container19.configureContainer)('second-container', {
         restrict: 'none'
@@ -582,12 +587,12 @@ });
       var target = root.querySelector('[data-spotlight-id="second-container"] .spottable');
-      (0, _container17.setLastContainerFromTarget)(current, target);
+      (0, _container19.setLastContainerFromTarget)(current, target);
       var expected = 'second-container';
-      var actual = (0, _container17.getLastContainer)();
+      var actual = (0, _container19.getLastContainer)();
       expect(actual).toBe(expected);
     }));
     test('should target container if it is restrict="self-only" and contains current container', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      (0, _container17.configureContainer)('first-container', {
+      (0, _container19.configureContainer)('first-container', {
         restrict: 'self-only'
       });
-      (0, _container17.configureContainer)('second-container', {
+      (0, _container19.configureContainer)('second-container', {
         restrict: 'none'
@@ -597,5 +602,5 @@ });
       var target = root.querySelector('[data-spotlight-id="first-container"]');
-      (0, _container17.setLastContainerFromTarget)(current, target);
+      (0, _container19.setLastContainerFromTarget)(current, target);
       var expected = 'first-container';
-      var actual = (0, _container17.getLastContainer)();
+      var actual = (0, _container19.getLastContainer)();
       expect(actual).toBe(expected);
@@ -608,5 +613,5 @@ }));
     test('should return an empty string when container is inactive', (0, _utils.testScenario)(scenarios.complexTree, function () {
-      (0, _container17.unmountContainer)(_container17.rootContainerId);
+      (0, _container19.unmountContainer)(_container19.rootContainerId);
       var expected = '';
-      var actual = (0, _container17.getDefaultContainer)();
+      var actual = (0, _container19.getDefaultContainer)();
       expect(actual).toBe(expected);
@@ -619,7 +624,7 @@ }));
     test('should return an empty string when container is inactive', (0, _utils.testScenario)(scenarios.complexTree, function () {
-      (0, _container17.addContainer)('first-container');
-      (0, _container17.setLastContainer)('first-container');
-      (0, _container17.unmountContainer)('first-container');
+      (0, _container19.addContainer)('first-container');
+      (0, _container19.setLastContainer)('first-container');
+      (0, _container19.unmountContainer)('first-container');
       var expected = '';
-      var actual = (0, _container17.getLastContainer)();
+      var actual = (0, _container19.getLastContainer)();
       expect(actual).toBe(expected);
@@ -633,6 +638,6 @@ }));
       var containerId = root.querySelector('[data-spotlight-id]').dataset.containerId;
-      (0, _container17.addContainer)(containerId);
-      (0, _container17.unmountContainer)(containerId);
+      (0, _container19.addContainer)(containerId);
+      (0, _container19.unmountContainer)(containerId);
       var expected = -1;
-      var actual = (0, _container17.getAllContainerIds)().indexOf(containerId);
+      var actual = (0, _container19.getAllContainerIds)().indexOf(containerId);
       expect(actual).toBe(expected);
@@ -646,3 +651,3 @@ }));
       var expected = null;
-      var actual = (0, _container17.getContainerLastFocusedElement)('does-not-exist');
+      var actual = (0, _container19.getContainerLastFocusedElement)('does-not-exist');
       expect(actual).toBe(expected);
@@ -656,3 +661,3 @@ }));
       var expected = null;
-      var actual = (0, _container17.getContainerDefaultElement)('does-not-exist');
+      var actual = (0, _container19.getContainerDefaultElement)('does-not-exist');
       expect(actual).toBe(expected);
@@ -665,12 +670,12 @@ }));
     test('should include all containers when none are restrict="self-only"', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      var expected = [_container17.rootContainerId, 'first-container', 'second-container'];
-      var actual = (0, _container17.getNavigableContainersForNode)(root.querySelector('#secondContainerFirstSpottable'));
+      var expected = [_container19.rootContainerId, 'first-container', 'second-container'];
+      var actual = (0, _container19.getNavigableContainersForNode)(root.querySelector('#secondContainerFirstSpottable'));
       expect(actual).toEqual(expected);
     }));
     test('should include all containers within the first restrict="self-only" container (inclusive)', (0, _utils.testScenario)(scenarios.complexTree, function (root) {
-      (0, _container17.configureContainer)('first-container', {
+      (0, _container19.configureContainer)('first-container', {
         restrict: 'self-only'
       });
       var expected = ['first-container', 'second-container'];
-      var actual = (0, _container17.getNavigableContainersForNode)(root.querySelector('#secondContainerFirstSpottable'));
+      var actual = (0, _container19.getNavigableContainersForNode)(root.querySelector('#secondContainerFirstSpottable'));
       expect(actual).toEqual(expected);
@@ -684,14 +689,29 @@ }));
       var expected = [];
-      var actual = (0, _container17.getContainerNavigableElements)('first-container');
+      var actual = (0, _container19.getContainerNavigableElements)('first-container');
       expect(actual).toEqual(expected);
     }));
     test('should return an empty array for an unmounted, configured container', (0, _utils.testScenario)(scenarios.onlySpottables, function () {
-      (0, _container17.configureContainer)('first-container', {
+      (0, _container19.configureContainer)('first-container', {
         overflow: true
       });
       var expected = [];
-      var actual = (0, _container17.getContainerNavigableElements)('first-container');
+      var actual = (0, _container19.getContainerNavigableElements)('first-container');
       expect(actual).toEqual(expected);
     }));
   });
+  describe('#getPositionTargetOnFocus', function () {
+    beforeEach(setupContainers);
+    afterEach(teardownContainers);
+    test('should return a container that has positionTargetOnFocus configured', (0, _utils.testScenario)(scenarios.positionTargetOnFocusContainer, function (root) {
+      (0, _container19.configureContainer)('positionTargetContainer', {
+        positionTargetOnFocus: true
+      });
+      (0, _container19.configureContainer)('child', {
+        enterTo: 'last-focused'
+      });
+      var expected = root.querySelector('#positionTargetContainer');
+      var actual = (0, _container19.getPositionTargetOnFocus)(root.querySelector('#firstChildSpottable'));
+      expect(actual).toEqual(expected);
+    }));
+  });
 });

src/tests/inputType-specs.js

@@ -5,2 +5,13 @@ "use strict";
 describe('inputType', function () {
+  test('should have a default input type as \'key\'', function () {
+    var expected = 'key';
+    var actual = (0, _inputType.getInputType)();
+    expect(actual).toBe(expected);
+  });
+  test('should ignore input type in internal variable when invalid type is set', function () {
+    (0, _inputType.setInputType)('none');
+    var expected = 'key';
+    var actual = (0, _inputType.getInputType)();
+    expect(actual).toBe(expected);
+  });
   test('should set input type properly in internal variable', function () {
@@ -7,0 +18,0 @@ (0, _inputType.setInputType)('touch');

src/tests/utils-specs.js

@@ -40,2 +40,78 @@ "use strict";
 describe('utils', function () {
+  describe('#getIntersectionRect', function () {
+    test('should return the intersection rect between two given rects', function () {
+      var rect1 = {
+        getBoundingClientRect: function getBoundingClientRect() {
+          return {
+            left: 0,
+            top: 0,
+            width: 100,
+            height: 100
+          };
+        }
+      };
+      var rect2 = {
+        getBoundingClientRect: function getBoundingClientRect() {
+          return {
+            left: 50,
+            top: 50,
+            width: 100,
+            height: 100
+          };
+        }
+      };
+      var expected = {
+        left: 50,
+        top: 50,
+        width: 50,
+        height: 50,
+        right: 100,
+        bottom: 100,
+        center: {
+          x: 75,
+          y: 75,
+          left: 75,
+          right: 75,
+          top: 75,
+          bottom: 75
+        },
+        element: rect2
+      };
+      var actual = (0, _utils.getIntersectionRect)(rect1, rect2);
+      expect(actual).toEqual(expected);
+    });
+  });
+  describe('#getRect', function () {
+    test('should return the rect value calculated based on the given element', function () {
+      var element = {
+        getBoundingClientRect: function getBoundingClientRect() {
+          return {
+            left: 10,
+            top: 20,
+            width: 100,
+            height: 200
+          };
+        }
+      };
+      var expected = {
+        left: 10,
+        top: 20,
+        width: 100,
+        height: 200,
+        right: 110,
+        bottom: 220,
+        center: {
+          x: 60,
+          y: 120,
+          left: 60,
+          right: 60,
+          top: 120,
+          bottom: 120
+        },
+        element: element
+      };
+      var actual = (0, _utils.getRect)(element);
+      expect(actual).toEqual(expected);
+    });
+  });
   describe('#getPointRect', function () {
@@ -42,0 +118,0 @@ test('should return an rect value calculated based on given position', function () {

src/utils.js

@@ -8,2 +8,3 @@ "use strict";
 exports.getContainerRect = getContainerRect;
+exports.getIntersectionRect = getIntersectionRect;
 exports.getPointRect = getPointRect;
@@ -85,2 +86,30 @@ exports.getRect = getRect;
 });
+function getIntersectionRect(container, element) {
+  var _container$getBoundin = container.getBoundingClientRect(),
+    L = _container$getBoundin.left,
+    T = _container$getBoundin.top,
+    W = _container$getBoundin.width,
+    H = _container$getBoundin.height;
+  var _element$getBoundingC = element.getBoundingClientRect(),
+    l = _element$getBoundingC.left,
+    t = _element$getBoundingC.top,
+    w = _element$getBoundingC.width,
+    h = _element$getBoundingC.height;
+  var intersectionRect = {
+    element: element,
+    left: Math.max(l, L),
+    right: Math.min(l + w, L + W),
+    top: Math.max(t, T),
+    bottom: Math.min(t + h, T + H)
+  };
+  intersectionRect.width = intersectionRect.right - intersectionRect.left;
+  intersectionRect.height = intersectionRect.bottom - intersectionRect.top;
+  intersectionRect.center = {
+    x: intersectionRect.left + Math.floor(intersectionRect.width / 2),
+    y: intersectionRect.top + Math.floor(intersectionRect.height / 2)
+  };
+  intersectionRect.center.left = intersectionRect.center.right = intersectionRect.center.x;
+  intersectionRect.center.top = intersectionRect.center.bottom = intersectionRect.center.y;
+  return intersectionRect;
+}
 function getRect(elem) {
@@ -87,0 +116,0 @@ var cr = elem.getBoundingClientRect();

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

400094

increased by1.77%

Lines of code

8055

increased by2.18%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

Dependency changes

• Updated@enact/core@^4.9.0-alpha.1