Adapt har-fixture to work for html.

Author: nedtwigg

browser-extension/tests/har-fixture-utils.ts

@@ -105,6 +105,27 @@ export function cleanupDOM(): void {
   }
 }
 
+export async function loadHtmlFromHtml(key: keyof typeof CORPUS): Promise<string> {
+  const entry = CORPUS[key]
+  if (!entry || entry.type !== 'html') {
+    throw new Error(`Invalid HTML corpus key: ${String(key)}`)
+  }
+  const htmlPath = path.join(__dirname, 'corpus', 'html', `${String(key)}.html`)
+  return await fs.readFile(htmlPath, 'utf-8')
+}
+
+export async function setupHtmlDOM(key: keyof typeof CORPUS): Promise<TestDOMGlobals> {
+  const html = await loadHtmlFromHtml(key)
+  const entry = CORPUS[key]
+  if (!entry || entry.type !== 'html') {
+    throw new Error(`Invalid HTML corpus key: ${String(key)}`)
+  }
+  const url = entry.url
+  const domGlobals = createDOMFromHar(html, url)
+  setupDOMFromHar(domGlobals)
+  return domGlobals
+}
+
 export async function setupHarDOM(key: keyof typeof CORPUS): Promise<TestDOMGlobals> {
   const html = await loadHtmlFromHar(key)
   const entry = CORPUS[key]
@@ -116,3 +137,18 @@ export async function setupHarDOM(key: keyof typeof CORPUS): Promise<TestDOMGlob
   setupDOMFromHar(domGlobals)
   return domGlobals
 }
+
+export async function setupDOM(key: keyof typeof CORPUS): Promise<TestDOMGlobals> {
+  const entry = CORPUS[key]
+  if (!entry) {
+    throw new Error(`Invalid corpus key: ${String(key)}`)
+  }
+
+  if (entry.type === 'har') {
+    return await setupHarDOM(key)
+  } else if (entry.type === 'html') {
+    return await setupHtmlDOM(key)
+  } else {
+    throw new Error(`Unsupported corpus type: ${entry.type}`)
+  }
+}

browser-extension/tests/har-fixture.ts

@@ -31,7 +31,7 @@ vi.mock('overtype', () => {
 
 import { describe as baseDescribe, test as baseTest, expect } from 'vitest'
 import type { CORPUS } from './corpus/_corpus-index'
-import { cleanupDOM, setupHarDOM } from './har-fixture-utils'
+import { cleanupDOM, setupDOM, setupHarDOM } from './har-fixture-utils'
 
 export const describe = baseDescribe
 
@@ -56,3 +56,22 @@ export function usingHar(harKey: keyof typeof CORPUS) {
     },
   }
 }
+
+// Fluent interface for any corpus type (HAR or HTML)
+export function using(corpusKey: keyof typeof CORPUS) {
+  return {
+    it: (name: string, fn: () => void | Promise<void>) => {
+      return baseTest(`${String(corpusKey)}:${name}`, async () => {
+        // Setup DOM for any corpus type
+        await setupDOM(corpusKey)
+
+        try {
+          return await fn()
+        } finally {
+          // Cleanup after test
+          cleanupDOM()
+        }
+      })
+    },
+  }
+}

browser-extension/tests/lib/enhancers/github.test.ts

@@ -1,4 +1,4 @@
-import { describe, expect, usingHar } from '../../har-fixture'
+import { describe, expect, using, usingHar } from '../../har-fixture'
 
 // must import fixture **first** for mocks, the `expect` keeps biome from changing sort-order
 expect
@@ -102,7 +102,7 @@ describe('github', () => {
       ]
     `)
   })
-  usingHar('gh_issue').it('should create the correct spot object', async () => {
+  usingHar('gh_issue').it('no enhancement on initial page load', async () => {
     expect(enhancements(document, window)).toMatchInlineSnapshot(`
       [
         {
@@ -112,6 +112,41 @@ describe('github', () => {
       ]
     `)
   })
+  using('gh_issue_populated_comment').it('should create the correct spot object', async () => {
+    expect(enhancements(document, window)).toMatchInlineSnapshot(`
+      [
+        {
+          "for": "id=:rn: name=null className=prc-Textarea-TextArea-13q4j overtype-input",
+          "spot": {
+            "domain": "github.com",
+            "number": 523,
+            "slug": "diffplug/selfie",
+            "title": "TODO_TITLE",
+            "type": "GH_ISSUE_ADD_COMMENT",
+            "unique_key": "github.com:diffplug/selfie:523",
+          },
+          "title": "TITLE_TODO",
+          "upperDecoration": <React.Fragment>
+            <span
+              className="flex h-4 w-4 flex-shrink-0 items-center justify-center"
+            >
+              <IssueOpenedIcon
+                size={16}
+              />
+            </span>
+            #
+            523
+            <a
+              className="truncate hover:underline"
+              href="https://github.com/diffplug/selfie"
+            >
+              diffplug/selfie
+            </a>
+          </React.Fragment>,
+        },
+      ]
+    `)
+  })
   usingHar('gh_new_issue').it('should create the correct spot object', async () => {
     expect(enhancements(document, window)).toMatchInlineSnapshot(`
       [