@cfpb/cfpb-design-system 3.3.1 → 3.4.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cfpb/cfpb-design-system",
-  "version": "3.3.1",
+  "version": "3.4.1",
   "description": "CFPB's UI framework",
   "main": "src/index.js",
   "author": {

package/src/utilities/atomic-helpers.spec.js

@@ -57,7 +57,7 @@ describe('atomic-helpers', () => {
         'Check that element is a DOM node with ' +
         `class ".${testClass}"`;
       /**
-       *
+       * Mock error function.
        */
       function errFunc() {
         checkDom(null, testClass);
@@ -68,7 +68,7 @@ describe('atomic-helpers', () => {
     it('should throw an error if element class not found', () => {
       const errMsg = 'mock-class not found on or in passed DOM node.';
       /**
-       *
+       * Mock error function.
        */
       function errFunc() {
         checkDom(componentDom, 'mock-class');

package/src/utilities/behavior/behavior.js

@@ -45,7 +45,7 @@ function _findElements(behaviorSelector, baseElement) {
     behaviorElements.length === 0 &&
     behaviorSelector.indexOf(BEHAVIOR_PREFIX) === -1
   ) {
-    behaviorElements = find(behaviorSelector, baseElement);
+    behaviorElements = behaviorFind(behaviorSelector, baseElement);
   }
 
   return behaviorElements;
@@ -60,7 +60,7 @@ function _findElements(behaviorSelector, baseElement) {
  *   for the behavior element.
  * @returns {Array|NodeList} if it exists in the dom, null otherwise.
  */
-function attach(behaviorElement, event, eventHandler, baseElement) {
+function behaviorAttach(behaviorElement, event, eventHandler, baseElement) {
   let behaviorElements = [];
 
   if (behaviorElement instanceof NodeList === true) {
@@ -118,21 +118,12 @@ function checkBehaviorDom(element, behaviorDataAttr) {
  *   for the behavior element.
  * @returns {NodeList} if it exists in the dom, null otherwise.
  */
-function find(behaviorSelector, baseElement) {
+function behaviorFind(behaviorSelector, baseElement) {
   behaviorSelector = JS_HOOK + '*=' + BEHAVIOR_PREFIX + behaviorSelector;
   behaviorSelector = '[' + behaviorSelector + ']';
 
   return _findElements(behaviorSelector, baseElement);
 }
 
-/**
- * @param {HTMLElement} behaviorElement - Element in which to remove the event.
- * @param {string} event - Event type to remove from the element.
- * @param {Function} eventHandler - Callback for event.
- */
-function remove(behaviorElement, event, eventHandler) {
-  behaviorElement.removeEventListener(event, eventHandler);
-}
-
 // Expose public methods.
-export { attach, checkBehaviorDom, find, remove };
+export { behaviorAttach, checkBehaviorDom, behaviorFind };

package/src/utilities/behavior/behavior.spec.js

@@ -0,0 +1,36 @@
+import { checkBehaviorDom, behaviorFind } from './behavior.js';
+
+let containerDom;
+
+const HTML_SNIPPET = `
+  <div id="container" data-js-hook="behavior_flyout-menu">
+    <button data-js-hook="behavior_flyout-menu_trigger">
+    <div data-js-hook="behavior_flyout-menu_content">…</div>
+  </div>
+`;
+
+describe('behaviors', () => {
+  beforeEach(() => {
+    document.body.innerHTML = HTML_SNIPPET;
+    containerDom = document.querySelector('#container');
+  });
+
+  describe('.checkBehaviorDom()', () => {
+    it('should return an HTML element', () => {
+      expect(
+        checkBehaviorDom(
+          containerDom,
+          'behavior_flyout-menu_content',
+        ).getAttribute('data-js-hook'),
+      ).toBe('behavior_flyout-menu_content');
+    });
+  });
+
+  describe('.behaviorFind()', () => {
+    it('should return an array with two items when selectors are found', () => {
+      const result = behaviorFind('flyout-menu', containerDom);
+      expect(result).toBeInstanceOf(NodeList);
+      expect(result.length).toBe(2);
+    });
+  });
+});

package/src/utilities/index.js

@@ -13,7 +13,11 @@ export { EventObserver } from './event-observer.js';
 
 export { checkDom, instantiateAll, setInitFlag } from './atomic-helpers.js';
 
-export { attach, checkBehaviorDom, find, remove } from './behavior/behavior.js';
+export {
+  behaviorAttach,
+  checkBehaviorDom,
+  behaviorFind,
+} from './behavior/behavior.js';
 
 export {
   isUndefined,