fix: deepQuerySelector types and processing shadow roots (#41)

__tests__/deep-query-selectors.test.tsx

@@ -47,13 +47,17 @@ describe("deepQuerySelector()", () => {
 describe("deepQuerySelectorAll()", () => {
   test("Should find and return both buttons", () => {
     const { container, baseElement } = render(<Duplicates />);
-    let btns = deepQuerySelectorAll(container, "button");
 
+    let btns = deepQuerySelectorAll(container, "button");
     expect(btns).toHaveLength(2);
     btns.forEach((btn) => expect(btn).toBeInstanceOf(HTMLButtonElement));
 
     btns = deepQuerySelectorAll(baseElement, "button");
     expect(btns).toHaveLength(2);
     btns.forEach((btn) => expect(btn).toBeInstanceOf(HTMLButtonElement));
+
+    btns = deepQuerySelectorAll(document.querySelector("duplicate-buttons") as HTMLElement, "button");
+    expect(btns).toHaveLength(2);
+    btns.forEach((btn) => expect(btn).toBeInstanceOf(HTMLButtonElement));
   });
 });

__tests__/within.test.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { MySelect, Select } from "../components";
+import { Duplicates, MySelect, Select, TripleShadowRoots } from "../components";
 import { render } from "@testing-library/react";
 import { screen, within } from "../src/index";
 
@@ -26,4 +26,11 @@ describe("within", () => {
 
     expect(option).toBeInTheDocument();
   });
+
+  it("Should find the nested button", async () => {
+	  render(<Duplicates />);
+		const btns = await within(document.querySelector("duplicate-buttons") as HTMLElement).findAllByShadowRole("button")
+		expect(btns).toHaveLength(2)
+		btns.forEach((btn) => expect(btn).toBeInstanceOf(HTMLButtonElement))
+  })
 });

src/deep-query-selectors.ts

@@ -1,14 +1,14 @@
 import { Container, ShadowOptions } from "./types";
 
-export function deepQuerySelector(
+export function deepQuerySelector<T extends HTMLElement>(
   container: Container,
   selector: string,
   options: ShadowOptions = { shallow: false }
-): Element | null {
+): T | null {
   const els = deepQuerySelectorAll(container, selector, options);
 
   if (Array.isArray(els) && els.length > 0) {
-    return els[0] as Element | null;
+    return els[0] as T | null;
   }
 
   return null;
@@ -74,6 +74,7 @@ function recurse(
     container.shadowRoot.mode !== "closed"
   ) {
     elements.push(container.shadowRoot);
+    elementsToProcess.push(container.shadowRoot)
   }
 
   elementsToProcess.forEach((containerElement) => {