test: enable testing of inbrowser.dev and inbrowser.link (#162)

* test: enable testing of inbrowser.dev and inbrowser.link

* chore: comment removal

* test: use protocol from baseURL

package.json

@@ -25,6 +25,8 @@
     "test:browsers": "playwright test -c playwright.config.js",
     "test:chrome": "playwright test -c playwright.config.js --project chromium",
     "test:firefox": "playwright test -c playwright.config.js --project firefox",
+    "test:inbrowser-dev": "playwright test -c playwright.config.js --project continuous-delivery-dev",
+    "test:inbrowser-prod": "playwright test -c playwright.config.js --project continuous-delivery-prod",
     "test:node": "aegir test -t node -f dist-tsc/test/node.js --cov",
     "postinstall": "patch-package"
   },

playwright.config.js

@@ -36,8 +36,25 @@ export default defineConfig({
     {
       name: 'firefox',
       use: { ...devices['Desktop Firefox'] }
+    },
+    {
+      name: 'continuous-delivery-dev',
+      use: {
+        ...devices['Desktop Chrome'],
+        ...devices['Desktop Firefox'],
+        baseURL: 'https://inbrowser.dev'
+      }
+    },
+    {
+      name: 'continuous-delivery-prod',
+      use: {
+        ...devices['Desktop Chrome'],
+        ...devices['Desktop Firefox'],
+        baseURL: 'https://inbrowser.link'
+      }
     }
   ],
+  // TODO: disable webservers when testing `continuous-delivery-dev` and `continuous-delivery-prod`
   webServer: [
     {
       command: 'node test-e2e/reverse-proxy.js',

test-e2e/fixtures/config-test-fixtures.ts

@@ -2,11 +2,45 @@ import { test as base, type Page } from '@playwright/test'
 import { setConfig, setSubdomainConfig } from './set-sw-config.js'
 import { waitForServiceWorker } from './wait-for-service-worker.js'
 
+const rootDomain = async ({ baseURL }, use): Promise<void> => {
+  const url = new URL(baseURL)
+  await use(url.host)
+}
+const baseURLProtocol = async ({ baseURL }, use): Promise<void> => {
+  const url = new URL(baseURL)
+  await use(url.protocol)
+}
+
+export const test = base.extend<{ rootDomain: string, baseURL: string, protocol: string }>({
+  rootDomain: [rootDomain, { scope: 'test' }],
+  protocol: [baseURLProtocol, { scope: 'test' }],
+  page: async ({ page, baseURL }, use) => {
+    await page.goto(baseURL, { waitUntil: 'networkidle' })
+    await waitForServiceWorker(page)
+    await setConfig({
+      page,
+      config: {
+        gateways: [process.env.KUBO_GATEWAY as string],
+        routers: [process.env.KUBO_GATEWAY as string]
+      }
+    })
+
+    await use(page)
+  }
+})
+
 /**
  * You should use this fixture instead of the `test` fixture from `@playwright/test` when testing path routing via the service worker.
  */
-export const testPathRouting = base.extend({
-  page: async ({ page }, use) => {
+export const testPathRouting = base.extend<{ rootDomain: string, baseURL: string, protocol: string }>({
+  rootDomain: [rootDomain, { scope: 'test' }],
+  protocol: [baseURLProtocol, { scope: 'test' }],
+  page: async ({ page, rootDomain }, use) => {
+    if (!rootDomain.includes('localhost')) {
+      // for non localhost tests, we skip path routing tests
+      testPathRouting.skip()
+      return
+    }
     await page.goto('http://127.0.0.1:3333', { waitUntil: 'networkidle' })
     await waitForServiceWorker(page)
     await setConfig({
@@ -31,17 +65,19 @@ export const testPathRouting = base.extend({
  * import { testSubdomainRouting as test, expect } from './fixtures/config-test-fixtures.js'
  *
  * test.describe('subdomain-detection', () => {
- *   test('path requests are redirected to subdomains', async ({ page }) => {
- *     await page.goto('http://bafkqablimvwgy3y.ipfs.localhost:3333/', { waitUntil: 'networkidle' })
+ *   test('path requests are redirected to subdomains', async ({ page, rootDomain, protocol }) => {
+ *     await page.goto(`${protocol}//bafkqablimvwgy3y.ipfs.${rootDomain}/`, { waitUntil: 'networkidle' })
  *     const bodyTextLocator = page.locator('body')
  *     await expect(bodyTextLocator).toContainText('hello')
  *   })
  * })
  * ```
  */
-export const testSubdomainRouting = base.extend({
-  page: async ({ page }, use) => {
-    await page.goto('http://localhost:3333', { waitUntil: 'networkidle' })
+export const testSubdomainRouting = base.extend<{ rootDomain: string, baseURL: string, protocol: string }>({
+  rootDomain: [rootDomain, { scope: 'test' }],
+  protocol: [baseURLProtocol, { scope: 'test' }],
+  page: async ({ page, baseURL }, use) => {
+    await page.goto(baseURL, { waitUntil: 'networkidle' })
     await waitForServiceWorker(page)
 
     const oldPageGoto = page.goto.bind(page)

test-e2e/subdomain-detection.test.ts

@@ -1,19 +1,18 @@
-import { test } from '@playwright/test'
-import { testSubdomainRouting, expect } from './fixtures/config-test-fixtures.js'
+import { test, testSubdomainRouting, expect } from './fixtures/config-test-fixtures.js'
 import { setConfig, setSubdomainConfig } from './fixtures/set-sw-config.js'
 import { waitForServiceWorker } from './fixtures/wait-for-service-worker.js'
 
 test.describe('subdomain-detection', () => {
-  test('path requests are redirected to subdomains', async ({ page }) => {
-    await page.goto('http://localhost:3333', { waitUntil: 'networkidle' })
+  test('path requests are redirected to subdomains', async ({ page, baseURL, rootDomain, protocol }) => {
+    await page.goto(baseURL, { waitUntil: 'networkidle' })
     await waitForServiceWorker(page)
     await setConfig({ page, config: { autoReload: false, gateways: [process.env.KUBO_GATEWAY as string], routers: [process.env.KUBO_GATEWAY as string] } })
     const initialResponse = await page.goto('/ipfs/bafkqablimvwgy3y', { waitUntil: 'commit' })
 
-    expect(initialResponse?.url()).toBe('http://bafkqablimvwgy3y.ipfs.localhost:3333/')
-    expect(initialResponse?.request()?.redirectedFrom()?.url()).toBe('http://localhost:3333/ipfs/bafkqablimvwgy3y')
+    expect(initialResponse?.url()).toBe(`${protocol}//bafkqablimvwgy3y.ipfs.${rootDomain}/`)
+    expect(initialResponse?.request()?.redirectedFrom()?.url()).toBe(`${protocol}//${rootDomain}/ipfs/bafkqablimvwgy3y`)
 
-    await page.waitForURL('http://bafkqablimvwgy3y.ipfs.localhost:3333')
+    await page.waitForURL(`${protocol}//bafkqablimvwgy3y.ipfs.${rootDomain}`)
     const bodyTextLocator = page.locator('body')
     await expect(bodyTextLocator).toContainText('Registering Helia service worker')
 
@@ -25,8 +24,8 @@ test.describe('subdomain-detection', () => {
     await expect(bodyTextLocator).toContainText('hello')
   })
 
-  test('enabling autoreload automatically loads the subdomain', async ({ page }) => {
-    await page.goto('http://bafkqablimvwgy3y.ipfs.localhost:3333/', { waitUntil: 'networkidle' })
+  test('enabling autoreload automatically loads the subdomain', async ({ page, rootDomain, protocol }) => {
+    await page.goto(`${protocol}//bafkqablimvwgy3y.ipfs.${rootDomain}/`, { waitUntil: 'networkidle' })
     await setSubdomainConfig({ page, config: { autoReload: true, gateways: [process.env.KUBO_GATEWAY as string], routers: [process.env.KUBO_GATEWAY as string] } })
 
     const bodyTextLocator = page.locator('body')
@@ -36,8 +35,8 @@ test.describe('subdomain-detection', () => {
 })
 
 testSubdomainRouting.describe('subdomain-detection auto fixture', () => {
-  testSubdomainRouting('loads subdomains easily', async ({ page }) => {
-    await page.goto('http://bafkqablimvwgy3y.ipfs.localhost:3333/', { waitUntil: 'networkidle' })
+  testSubdomainRouting('loads subdomains easily', async ({ page, rootDomain, protocol }) => {
+    await page.goto(`${protocol}//bafkqablimvwgy3y.ipfs.${rootDomain}/`, { waitUntil: 'networkidle' })
 
     const bodyTextLocator = page.locator('body')