chore: added failing test

ing-bank · Jul 31, 2024 · 5eba753 · 5eba753
1 parent 5c03e40
commit 5eba753
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 5 deletions.
diff --git a/packages/ui/components/overlays/src/utils/deep-contains.js b/packages/ui/components/overlays/src/utils/deep-contains.js
@@ -57,7 +57,7 @@ export function deepContains(el, targetEl, cache = {}) {
   }
 
   /**
-   * @description A `Typescript` `type guard` for `HTMLSlotElement`
+   * A `Typescript` `type guard` for `HTMLSlotElement`
    * @param {HTMLElement|HTMLSlotElement} htmlElement
    * @returns {htmlElement is HTMLSlotElement}
    */
@@ -66,7 +66,7 @@ export function deepContains(el, targetEl, cache = {}) {
   }
 
   /**
-   * @description Returns a slot projection or it returns `null` if `htmlElement` is not an `HTMLSlotElement`
+   * Returns a slot projection or it returns `null` if `htmlElement` is not an `HTMLSlotElement`
    * @example
    * Let's say this is a custom element declared as follows:
    * ```

diff --git a/packages/ui/components/overlays/test/utils-tests/deep-contains.test.js b/packages/ui/components/overlays/test/utils-tests/deep-contains.test.js
@@ -129,7 +129,10 @@ describe('deepContains()', () => {
     const mainElement = /** @type {HTMLElement} */ (await fixture('<div id="main"></div>'));
     mainElement.innerHTML = `      
       <div slot="content" id="light-el-content">
-        <input type="text" id="light-el-input"></input>
+        <input type="text" id="light-el-input-1"></input>
+      </div>
+      <div slot="content" id="light-el-content">
+        <input type="text" id="light-el-input-2"></input>
       </div>
     `;
     const shadowRoot = mainElement.attachShadow({ mode: 'open' });
@@ -143,14 +146,16 @@ describe('deepContains()', () => {
         </div>  
       </div>      
     `;
-    const inputElement = /** @type {HTMLElement} */ (mainElement.querySelector('#light-el-input'));
+    const inputElement = /** @type {HTMLElement} */ (
+      mainElement.querySelector('#light-el-input-2')
+    );
     const dialogWrapperElement = /** @type {HTMLElement} */ (
       shadowRoot.querySelector('#dialog-wrapper')
     );
     expect(deepContains(dialogWrapperElement, inputElement)).to.be.true;
   });
 
-  it(`returns true if the element, which is located in ShadowsRoot, contains a target element, located in the ShadowRoot element of the LightDom element  `, async () => {
+  it(`returns true if the element, which is located in ShadowRoot, contains a target element, located in the ShadowRoot element of the LightDom element  `, async () => {
     /**
      * The DOM for the `main` element looks as follows:
      *
@@ -180,6 +185,9 @@ describe('deepContains()', () => {
       <div slot="content" id="light-el-content">
         <div id="content-wrapper"></div>
       </div>
+      <div slot="content" id="light-el-content">
+        <div id="content-wrapper"></div>
+      </div>
     `;
     const contentWrapper = /** @type {HTMLElement} */ (
       mainElement.querySelector('#content-wrapper')