Repository: ymrl/a11y-visualizer
Pull request #27 (2024-04-28 00:05:21)

:bug: fix infinite loop of getPositionBaseElement


Patch:
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index 49bd276..17f373f 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -25,14 +25,14 @@ jobs:
       - name: Install dependencies
         run: npm ci
 
+      - name: Release
+        run: npm run release -- ${{ github.event.inputs.release_type }}
+
       - name: Git config
         run: |
           git config --global user.name 'github-actions[bot]'
           git config --global user.email '41898282+github-actions[bot]@users.noreply.github.com'
 
-      - name: Release
-        run: npm run release -- ${{ github.event.inputs.release_type }}
-
       - name: Push changes
         uses: ad-m/github-push-action@v0.6.0
         with:
@@ -42,7 +42,7 @@ jobs:
 
       - name: Get version
         id: get_version
-        run: echo "::set-output name=VERSION::$(jq -r .version package.json)"
+        run: echo "::set-output name=VERSION::$(node -e \"console.log(require('./package.json').version)\")"
 
       - name: Create Release
         id: create_release
diff --git a/manifest.json b/manifest.json
index 70024e6..5bd4e31 100644
--- a/manifest.json
+++ b/manifest.json
@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "Accessibility Visualizer",
-  "version": "0.4.0",
+  "version": "0.3.0",
   "action": {
     "default_popup": "src/popup/index.html"
   },
diff --git a/package-lock.json b/package-lock.json
index 2ebfbe2..d000fc1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "a11y-visualizer",
-  "version": "0.4.0",
+  "version": "0.3.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "a11y-visualizer",
-      "version": "0.4.0",
+      "version": "0.3.0",
       "dependencies": {
         "dom-accessibility-api": "^0.6.3",
         "i18next": "^23.10.1",
diff --git a/package.json b/package.json
index f263465..49f1bd3 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "a11y-visualizer",
   "private": true,
-  "version": "0.4.0",
+  "version": "0.3.0",
   "type": "module",
   "scripts": {
     "dev": "vite",
diff --git a/src/content/dom/getPositionBaseElement.ts b/src/content/dom/getPositionBaseElement.ts
index 39beaa7..a9781b8 100644
--- a/src/content/dom/getPositionBaseElement.ts
+++ b/src/content/dom/getPositionBaseElement.ts
@@ -4,7 +4,8 @@ export const getPositionBaseElement = (
   w: Window,
 ): Element | null => {
   if (!el) return null;
-  if (w.getComputedStyle(el).position !== "static") return el;
+  const position = w.getComputedStyle(el).position;
+  if (position && position !== "static") return el;
   if (el === d.body) return null;
-  return getPositionBaseElement(el, d, w);
+  return getPositionBaseElement(el.parentElement, d, w);
 };


Test patch:
diff --git a/src/content/dom/getPositionBaseElement.test.ts b/src/content/dom/getPositionBaseElement.test.ts
new file mode 100644
index 0000000..881814e
--- /dev/null
+++ b/src/content/dom/getPositionBaseElement.test.ts
@@ -0,0 +1,95 @@
+import { describe, test, expect, afterEach } from "vitest";
+import { getPositionBaseElement } from "./getPositionBaseElement";
+
+describe("getPositionBaseElement", () => {
+  afterEach(() => {
+    document.body.innerHTML = "";
+  });
+
+  test("el is null", () => {
+    expect(getPositionBaseElement(null, document, window)).toBe(null);
+  });
+
+  test("el is not null", () => {
+    const element = document.createElement("div");
+    document.body.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(null);
+  });
+
+  test("el is position static", () => {
+    const element = document.createElement("div");
+    element.style.position = "static";
+    document.body.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(null);
+  });
+
+  test("el is position relative", () => {
+    const element = document.createElement("div");
+    element.style.position = "relative";
+    document.body.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(element);
+  });
+
+  test("el is position absolute", () => {
+    const element = document.createElement("div");
+    element.style.position = "absolute";
+    document.body.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(element);
+  });
+
+  test("el is position fixed", () => {
+    const element = document.createElement("div");
+    element.style.position = "fixed";
+    document.body.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(element);
+  });
+
+  test("el is body", () => {
+    const element = document.body;
+    expect(getPositionBaseElement(element, document, window)).toBe(null);
+  });
+
+  test("el has parent", () => {
+    const parent = document.createElement("div");
+    document.body.appendChild(parent);
+    const element = document.createElement("div");
+    parent.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(null);
+  });
+
+  test("parent of el is position static", () => {
+    const parent = document.createElement("div");
+    parent.style.position = "static";
+    document.body.appendChild(parent);
+    const element = document.createElement("div");
+    parent.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(null);
+  });
+
+  test("parent of el is position relative", () => {
+    const parent = document.createElement("div");
+    parent.style.position = "relative";
+    document.body.appendChild(parent);
+    const element = document.createElement("div");
+    parent.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(parent);
+  });
+
+  test("parent of el is position absolute", () => {
+    const parent = document.createElement("div");
+    parent.style.position = "absolute";
+    document.body.appendChild(parent);
+    const element = document.createElement("div");
+    parent.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(parent);
+  });
+
+  test("parent of el is position fixed", () => {
+    const parent = document.createElement("div");
+    parent.style.position = "fixed";
+    document.body.appendChild(parent);
+    const element = document.createElement("div");
+    parent.appendChild(element);
+    expect(getPositionBaseElement(element, document, window)).toBe(parent);
+  });
+});