prettier

__tests__/deep-query-selectors.test.tsx

@@ -15,13 +15,13 @@ describe("deepQuerySelector()", () => {
       ?.shadowRoot?.querySelectorAll("button")[1];
 
     expect(deepQuerySelector(container, "button")).toBeInstanceOf(
-      HTMLButtonElement
+      HTMLButtonElement,
     );
     expect(deepQuerySelector(container, "button")).toBe(btn);
     expect(deepQuerySelector(container, "button")).not.toBe(secondButton);
 
     expect(deepQuerySelector(baseElement, "button")).toBeInstanceOf(
-      HTMLButtonElement
+      HTMLButtonElement,
     );
     expect(deepQuerySelector(baseElement, "button")).toBe(btn);
     expect(deepQuerySelector(baseElement, "button")).not.toBe(secondButton);
@@ -58,7 +58,7 @@ describe("deepQuerySelectorAll()", () => {
 
     btns = deepQuerySelectorAll(
       document.querySelector("duplicate-buttons") as HTMLElement,
-      "button"
+      "button",
     );
     expect(btns).toHaveLength(2);
     btns.forEach((btn) => expect(btn).toBeInstanceOf(HTMLButtonElement));

__tests__/duplicateNodes.test.tsx

@@ -19,20 +19,20 @@ test("Should error if two similiar nodes actually exist", async () => {
     <>
       <h2>Hello</h2>
       <h2>Hello</h2>
-    </>
+    </>,
   );
 
   expect(() => screen.getByShadowText("Hello")).toThrow(/multiple elements/i);
   await expect(() => screen.findByShadowText("Hello")).rejects.toThrow(
-    /multiple elements/i
+    /multiple elements/i,
   );
 });
 
 test("Should error if two similar nodes are in shadow root", async () => {
   render(<Duplicates />);
   expect(() => screen.getByShadowRole("button")).toThrow(/multiple elements/i);
   await expect(() => screen.findByShadowRole("button")).rejects.toThrow(
-    /multiple elements/i
+    /multiple elements/i,
   );
 });
 
@@ -41,7 +41,7 @@ test("Should find duplicate nodes in a double nested shadow root", async () => {
 
   expect(() => screen.getByShadowRole("button")).toThrow(/multiple elements/i);
   await expect(() => screen.findByShadowRole("button")).rejects.toThrow(
-    /multiple elements/i
+    /multiple elements/i,
   );
 });
 
@@ -50,6 +50,6 @@ test("Should find duplicate nodes in a triple nested shadow root", async () => {
 
   expect(() => screen.getByShadowRole("button")).toThrow(/multiple elements/i);
   await expect(() => screen.findByShadowRole("button")).rejects.toThrow(
-    /multiple elements/i
+    /multiple elements/i,
   );
 });

__tests__/role-not-found.test.tsx

@@ -11,7 +11,7 @@ test.skip("Should serialize custom elements properly", () => {
   render(
     <TripleShadowRoots>
       <NestedShadowRoots role="not-button" />
-    </TripleShadowRoots>
+    </TripleShadowRoots>,
   );
   // const btn = screen.getByShadowRole("button", { name: "Not found" })
   const btn = screen.getByRole("button");

__tests__/screenDebug.test.tsx

@@ -30,7 +30,7 @@ test("Single shadow root", async () => {
       <div slot="start">Start Slot</div>
       <div>Default Slot</div>
       <div slot="end">End Slot</div>
-    </Duplicates>
+    </Duplicates>,
   );
 
   screen.debug();

__tests__/shadowAltText.test.tsx

@@ -12,31 +12,31 @@ describe("ShadowAltText()", () => {
     });
     expect(findContainerAlt).toBeInTheDocument();
     const findContainerAlts = await screen.findAllByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(findContainerAlts.length).toBeGreaterThan(0);
 
     const queryContainerAlt = screen.queryByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(queryContainerAlt).toBeInTheDocument();
     const queryContainerAlts = screen.queryAllByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(queryContainerAlts.length).toBeGreaterThan(0);
 
     const getContainerAlt = screen.getByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(getContainerAlt).toBeInTheDocument();
     const getContainerAlts = screen.getAllByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(getContainerAlts.length).toBeGreaterThan(0);
 
     // // Use await findByX to let things render then use other calls.
     const findAlt = await screen.findByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(findAlt).toBeInTheDocument();
     const findAlts = await screen.findAllByShadowAltText(/shoes/, {
@@ -45,20 +45,20 @@ describe("ShadowAltText()", () => {
     expect(findAlts.length).toBeGreaterThan(0);
 
     const queryAlt = screen.queryByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(queryAlt).toBeInTheDocument();
     const queryAlts = screen.queryAllByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(queryAlts.length).toBeGreaterThan(0);
 
     const getAlt = screen.getByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(getAlt).toBeInTheDocument();
     const getAlts = screen.getAllByShadowAltText(
-      "Animation of untied shoes walking on pavement"
+      "Animation of untied shoes walking on pavement",
     );
     expect(getAlts.length).toBeGreaterThan(0);
   });

__tests__/shadowLabelText.test.tsx

@@ -11,12 +11,11 @@ describe("ByShadowLabelText()", () => {
     const findContainerLabel = await findByShadowLabelText(
       container,
       /omments/,
-      { exact: false }
+      { exact: false },
     );
     expect(findContainerLabel).toBeInTheDocument();
-    const findContainerLabels = await screen.findAllByShadowLabelText(
-      "Comments"
-    );
+    const findContainerLabels =
+      await screen.findAllByShadowLabelText("Comments");
     expect(findContainerLabels.length).toBeGreaterThan(0);
 
     const queryContainerLabel = screen.queryByShadowLabelText("Comments");

__tests__/shadowText.test.tsx

@@ -30,7 +30,7 @@ describe("ShadowText()", () => {
     });
 
     const el = (await fixture(
-      html`<shadow-text></shadow-text>`
+      html`<shadow-text></shadow-text>`,
     )) as HTMLElement;
     await nextFrame();
 
@@ -50,7 +50,7 @@ describe("ShadowText()", () => {
 
   it("should not suggest light dom queries", async () => {
     const el = (await fixture(
-      html`<shadow-text></shadow-text>`
+      html`<shadow-text></shadow-text>`,
     )) as HTMLElement;
     await nextFrame();
 

__tests__/slot-aggregation.test.tsx

@@ -10,11 +10,11 @@ test("Should aggregate content from slots", async () => {
         <img src="" /> <span>Start button</span>
       </button>
       <a href="#">Middle Link</a>
-    </Duplicates>
+    </Duplicates>,
   );
 
   const startSlot = el.container.firstElementChild?.shadowRoot?.querySelector(
-    "slot[name='start']"
+    "slot[name='start']",
   ) as HTMLSlotElement;
   const btn = await within(startSlot).findAllByShadowRole("button");
   expect(btn.length).toEqual(1);
@@ -25,14 +25,14 @@ test("Should aggregate content from slots", async () => {
   expect(within(startSlot).queryByShadowRole("link")).toBeNull;
 
   const defaultSlot = el.container.firstElementChild?.shadowRoot?.querySelector(
-    "slot:not([name])"
+    "slot:not([name])",
   ) as HTMLSlotElement;
   const anchor = await within(defaultSlot).findByShadowRole("link");
   expect(anchor).toBeInTheDocument();
 
   // Make sure default slot doesnt pick up start / end slot
   expect(
-    within(defaultSlot).queryByShadowRole("button")
+    within(defaultSlot).queryByShadowRole("button"),
   ).not.toBeInTheDocument();
   expect(within(defaultSlot).queryByShadowRole("img")).not.toBeInTheDocument();
 
@@ -44,11 +44,11 @@ test("slot aggregation should use slotted content instead of default content", (
   const el = render(
     <Select label="My Other Label">
       <span slot="label">My Label</span>
-    </Select>
+    </Select>,
   );
 
   const labelSlot = el.container.firstElementChild?.shadowRoot?.querySelector(
-    "slot[name='label']"
+    "slot[name='label']",
   ) as HTMLSlotElement;
 
   expect(within(labelSlot).queryByText("My Label")).toBeTruthy;
@@ -58,7 +58,7 @@ test("slot aggregation should use default items when not given slotted content",
   const el = render(<Select label="My Label"></Select>);
 
   const labelSlot = el.container.firstElementChild?.shadowRoot?.querySelector(
-    "slot[name='label']"
+    "slot[name='label']",
   ) as HTMLSlotElement;
 
   expect(within(labelSlot).queryByText("My Label")).toBeTruthy;

__tests__/within.test.tsx

@@ -12,7 +12,7 @@ describe("within", () => {
       <Select label={selectLabel}>
         <option>{optionLabel}</option>
         <option>Option two</option>
-      </Select>
+      </Select>,
     );
 
     const shadowSelect = await screen.findByShadowRole("combobox");
@@ -30,7 +30,7 @@ describe("within", () => {
   it("Should find the nested button", async () => {
     render(<Duplicates />);
     const btns = await within(
-      document.querySelector("duplicate-buttons") as HTMLElement
+      document.querySelector("duplicate-buttons") as HTMLElement,
     ).findAllByShadowRole("button");
     expect(btns).toHaveLength(2);
     btns.forEach((btn) => expect(btn).toBeInstanceOf(HTMLButtonElement));

package.json

@@ -64,6 +64,7 @@
     "jest-environment-jsdom": "^28.1.2",
     "jest-preview": "^0.2.6",
     "jsdom": "^20.0.2",
+    "prettier": "^3.0.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "standard-version": "^9.5.0",

src/deep-query-selectors.ts

@@ -5,7 +5,7 @@ import { Container, ShadowOptions } from "./types";
 export function deepQuerySelector<T extends HTMLElement>(
   container: Container,
   selector: string,
-  options: ShadowOptions = { shallow: false, maxDepth: Infinity }
+  options: ShadowOptions = { shallow: false, maxDepth: Infinity },
 ): T | null {
   const els = deepQuerySelectorAll(container, selector, options);
 
@@ -31,7 +31,7 @@ export function deepQuerySelector<T extends HTMLElement>(
 export function deepQuerySelectorAll<T extends HTMLElement>(
   container: Container,
   selector: string,
-  options: ShadowOptions = { shallow: false, maxDepth: Infinity }
+  options: ShadowOptions = { shallow: false, maxDepth: Infinity },
 ): T[] {
   return patchWrap(() => {
     const elements = getAllElementsAndShadowRoots(container, options);
@@ -47,12 +47,14 @@ export function deepQuerySelectorAll<T extends HTMLElement>(
 // maybe an infinite generator in the future?
 export function getAllElementsAndShadowRoots(
   container: Container,
-  options: ShadowOptions = { shallow: false, maxDepth: Infinity }
+  options: ShadowOptions = { shallow: false, maxDepth: Infinity },
 ) {
   if (options.shallow === true) {
-    console.warn("The 'shallow' option will go away in v2.0.0 of SDTL. The replacement will be 'maxDepth: 1'")
-    options.maxDepth = 1
+    console.warn(
+      "The 'shallow' option will go away in v2.0.0 of SDTL. The replacement will be 'maxDepth: 1'",
+    );
+    options.maxDepth = 1;
   }
 
-  return findAllElements(container, options.maxDepth)
+  return findAllElements(container, options.maxDepth);
 }

src/index.ts

@@ -18,7 +18,7 @@ configure({
         }\n${prettifiedDOM}`,
       ]
         .filter(Boolean)
-        .join("\n\n")
+        .join("\n\n"),
     );
     error.name = "ShadowDOMTestingLibraryElementError";
     return error;

src/log-shadow-dom.ts

@@ -12,7 +12,7 @@ export function logShadowDOM(
   let [dom, maxLength, options] = args;
 
   const plugin: NewPlugin = createDOMElementFilter(
-    options?.filterNode || filterCommentsAndDefaultIgnoreTagsTags
+    options?.filterNode || filterCommentsAndDefaultIgnoreTagsTags,
   );
 
   if (options == null) options = {};