Update Test and Issue Testing (#86)

smashedr · web-flow · commit def42c4489f1 · 2024-07-05T02:27:22.000-07:00
* Update Test

* Initial Implementation

* Updates

* Update Logging

* Convert Tests to Module

* Update Test Paths
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -11,6 +11,7 @@
     "sourceType": "module"
   },
   "rules": {
-    "no-undef": "off"
+    "no-undef": "off",
+    "no-extra-semi": "off"
   }
 }
diff --git a/.github/workflows/issue.yaml b/.github/workflows/issue.yaml
@@ -0,0 +1,86 @@
+name: "Issue"
+
+on:
+  issues:
+    types:
+      - opened
+
+jobs:
+  issue:
+    name: "Issue"
+    runs-on: ubuntu-latest
+    timeout-minutes: 5
+
+    steps:
+      - name: "Checkout"
+        uses: actions/checkout@v4
+
+      - name: "Debug Issue"
+        run: |
+          echo Issue number: '${{ github.event.issue.number }}'
+          echo Issue title: '${{ github.event.issue.title }}'
+          echo Issue body: '${{ github.event.issue.body }}'
+
+      - name: "Setup Node"
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+      - name: "Parse Issue"
+        id: issue
+        uses: cssnr/parse-issue-form-action@master
+        with:
+          body: ${{ github.event.issue.body }}
+
+      - name: "Debug Parsed Issue"
+        run: |
+          echo Site Link: '${{ steps.issue.outputs.site_link }}'
+          echo Details: '${{ steps.issue.outputs.details }}'
+          echo Support Information: '${{ steps.issue.outputs.support_information }}'
+
+      - name: "Install"
+        run: |
+          npm install
+
+      - name: "Process Issue"
+        env:
+          URL: ${{ steps.issue.outputs.site_link }}
+        run: |
+          npm run issue
+
+      - name: "Debug Files"
+        run: |
+          ls -lah tests/screenshots
+
+      - name: "Upload Image"
+        id: image
+        uses: McCzarny/upload-image@v1.0.0
+        with:
+          path: tests/screenshots/links.png
+          uploadMethod: imgbb
+          apiKey: ${{ secrets.IMGBB_API_KEY }}
+
+      - name: "Read Logs"
+        id: logs
+        uses: juliangruber/read-file-action@v1
+        with:
+          path: tests/screenshots/logs.txt
+
+      - name: "Debug Logs"
+        run: echo "${{ steps.logs.outputs.content }}"
+
+      - name: "Add Comment"
+        run: gh issue comment "$NUMBER" --body "$BODY"
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          GH_REPO: ${{ github.repository }}
+          NUMBER: ${{ github.event.issue.number }}
+          BODY: |
+            Link Extractor Results for: [${{ steps.issue.outputs.site_link }}](${{ steps.issue.outputs.site_link }})  
+
+            ![0](${{steps.image.outputs.url}})
+
+            Logs:
+            ```json
+            ${{ steps.logs.outputs.content }}
+            ```
diff --git a/.github/workflows/test.yaml b/.github/workflows/test.yaml
@@ -5,10 +5,12 @@ on:
     branches: ["master"]
     paths:
       - "src/**"
+      - "tests/**"
   pull_request:
     branches: ["master"]
     paths:
       - "src/**"
+      - "tests/**"
   workflow_dispatch:
 
 jobs:
diff --git a/package.json b/package.json
@@ -2,14 +2,16 @@
   "name": "link-extractor",
   "scripts": {
     "postinstall": "npx gulp",
-    "lint:eslint": "npx eslint src/js",
+    "lint:eslint": "npx eslint src/js tests/*.mjs",
     "lint:web-ext": "npm run manifest:firefox && npx web-ext lint --source-dir ./src/ --ignore-files dist/**",
     "lint": "npm run lint:eslint && npm run lint:web-ext",
-    "test": "npx json-merger -p -am concat -o src/manifest.json manifest.json tests/manifest-test.json && node tests/test.js",
+    "test": "npm run manifest:test && node tests/test.mjs",
+    "issue": "npm run manifest:test && node tests/issue.mjs",
     "chrome": "npm run manifest:chrome && web-ext run --source-dir ./src/ --target=chromium",
     "firefox": "npm run manifest:firefox && web-ext run --source-dir ./src/",
     "manifest:chrome": "npx json-merger -p -am concat -o src/manifest.json manifest.json manifest-chrome.json",
     "manifest:firefox": "npx json-merger -p -am concat -o src/manifest.json manifest.json manifest-firefox.json",
+    "manifest:test": "npx json-merger -p -am concat -o src/manifest.json manifest.json tests/manifest-test.json",
     "build:chrome": "npm run manifest:chrome && npx web-ext build -n {name}-chrome-{version}.zip -o -s src",
     "build:firefox": "npm run manifest:firefox && npx web-ext build -n {name}-firefox-{version}.zip -o -s src",
     "build": "npm run build:chrome && npm run build:firefox"
diff --git a/tests/common.mjs b/tests/common.mjs
@@ -0,0 +1,86 @@
+import * as puppeteer from 'puppeteer'
+import * as path from 'path'
+
+const sourceDir = 'src'
+const timeout = 10000
+
+/**
+ * @function getBrowser
+ * @return {puppeteer.Browser}
+ */
+export async function getBrowser() {
+    const pathToExtension = path.join(process.cwd(), sourceDir)
+    console.log('pathToExtension:', pathToExtension)
+    return await puppeteer.launch({
+        args: [
+            `--disable-extensions-except=${pathToExtension}`,
+            `--load-extension=${pathToExtension}`,
+            // '--disable-blink-features=AutomationControlled',
+            // '--disable-features=ChromeUserPermPrompt',
+        ],
+        dumpio: true,
+        // headless: false,
+        // slowMo: 50,
+    })
+}
+
+/**
+ * @function getWorker
+ * @global browser
+ * @global timeout
+ * @return {puppeteer.Page}
+ */
+export async function getWorker(browser) {
+    const workerTarget = await browser.waitForTarget(
+        (target) =>
+            target.type() === 'service_worker' &&
+            target.url().endsWith('service-worker.js'),
+        { timeout }
+    )
+    return await workerTarget.worker()
+}
+
+/**
+ * @function getPage
+ * @global browser
+ * @global timeout
+ * @param {puppeteer.Browser} browser
+ * @param {String} name
+ * @param {Boolean=} log
+ * @param {String=} size
+ * @return {puppeteer.Page}
+ */
+export async function getPage(browser, name, log, size) {
+    console.debug(`getPage: ${name}`, log, size)
+    const target = await browser.waitForTarget(
+        (target) => target.type() === 'page' && target.url().includes(name),
+        { timeout }
+    )
+    const newPage = await target.asPage()
+    await newPage.emulateMediaFeatures([
+        { name: 'prefers-color-scheme', value: 'dark' },
+    ])
+    newPage.setDefaultTimeout(timeout)
+    if (size) {
+        const [width, height] = size.split('x').map((x) => parseInt(x))
+        await newPage.setViewport({ width, height })
+    }
+    if (log) {
+        console.debug(`Adding Logger: ${name}`)
+        newPage.on('console', (msg) =>
+            console.log(`console: ${name}:`, msg.text())
+        )
+    }
+    return newPage
+}
+
+export async function scrollPage(page) {
+    await page.evaluate(() => {
+        window.scrollBy({
+            top: window.innerHeight,
+            left: 0,
+            behavior: 'instant',
+        })
+    })
+    await new Promise((resolve) => setTimeout(resolve, 500))
+}
diff --git a/tests/issue.mjs b/tests/issue.mjs
@@ -0,0 +1,65 @@
+import * as fs from 'fs'
+import { getBrowser, getPage, getWorker } from './common.mjs'
+
+const screenshotsDir = 'tests/screenshots'
+let page
+
+async function addLogger(page, results, name) {
+    page.on('console', async (msg) => {
+        const text = msg.text()
+        if (text.startsWith('links:')) {
+            const value = await msg.args()[1].jsonValue()
+            results.unshift(`links count: ${value.length}`)
+        } else if (text.startsWith('domains:')) {
+            const value = await msg.args()[1].jsonValue()
+            results.unshift(`domains count: ${value.length}`)
+        } else {
+            results.push(`${name}: ${text}`)
+        }
+    })
+}
+
+;(async () => {
+    fs.rmSync(screenshotsDir, { recursive: true, force: true })
+    fs.mkdirSync(screenshotsDir)
+
+    console.log('process.env.URL:', process.env.URL)
+    const url = new URL(process.env.URL)
+    console.log('url.href:', url.href)
+
+    // Get Browser
+    const browser = await getBrowser()
+    console.log('browser:', browser)
+
+    // Get Service Worker
+    const worker = await getWorker(browser)
+    console.log('worker:', worker)
+
+    const logs = []
+
+    page = await browser.newPage()
+    // page.on('console', (msg) => logs.push(msg.text()))
+    await addLogger(page, logs, 'site')
+    await page.goto(url.href)
+    await page.bringToFront()
+    await page.waitForNetworkIdle()
+    await new Promise((resolve) => setTimeout(resolve, 1000))
+
+    await worker.evaluate('chrome.action.openPopup();')
+    page = await getPage(browser, 'popup.html')
+    // page.on('console', (msg) => logs.push(msg.text()))
+    await addLogger(page, logs, 'popup')
+    await page.locator('a[data-filter=""]').click()
+
+    page = await getPage(browser, 'links.html', false, '768x1024')
+    // page.on('console', (msg) => logs.push(msg.text()))
+    await addLogger(page, logs, 'links')
+    await page.waitForNetworkIdle()
+    await page.screenshot({ path: `${screenshotsDir}/links.png` })
+
+    await browser.close()
+
+    console.log('logs:', logs)
+    const content = JSON.stringify(logs)
+    fs.writeFileSync(`${screenshotsDir}/logs.txt`, content)
+})()
diff --git a/tests/test.js b/tests/test.js
diff --git a/tests/test.mjs b/tests/test.mjs

Original file line number	Diff line number	Diff line change
`@@ -11,6 +11,7 @@`
`11`	`11`	`"sourceType": "module"`
`12`	`12`	`},`
`13`	`13`	`"rules": {`
`14`		`- "no-undef": "off"`
	`14`	`+ "no-undef": "off",`
	`15`	`+ "no-extra-semi": "off"`
`15`	`16`	`}`
`16`	`17`	`}`