Skip to content

Commit

Permalink
test(e2e): retrofit all e2e sandboxes tests to use open ports (TanSta…
Browse files Browse the repository at this point in the history
  • Loading branch information
SeanCassiere authored and timoconnellaus committed Dec 19, 2024
1 parent 275125e commit 106d360
Show file tree
Hide file tree
Showing 66 changed files with 1,416 additions and 441 deletions.
2 changes: 1 addition & 1 deletion e2e/react-router/basic-esbuild-file-based/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
"private": true,
"type": "module",
"scripts": {
"dev": "esbuild src/main.tsx --serve=3001 --bundle --outfile=dist/main.js --watch --servedir=.",
"dev": "esbuild src/main.tsx --serve=3090 --bundle --outfile=dist/main.js --watch --servedir=.",
"build": "esbuild src/main.tsx --bundle --outfile=dist/main.js",
"serve": "esbuild src/main.tsx --bundle --outfile=dist/main.js --servedir=.",
"start": "dev",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,12 @@ export default defineConfig({

use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: 'http://localhost:3001/',
baseURL: 'http://localhost:3090/',
},

webServer: {
command: 'pnpm run dev',
url: 'http://localhost:3001',
url: 'http://localhost:3090',
reuseExistingServer: !process.env.CI,
stdout: 'pipe',
},
Expand Down
8 changes: 6 additions & 2 deletions e2e/react-router/basic-file-based-code-splitting/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@
"private": true,
"type": "module",
"scripts": {
"dev": "vite --port=3001",
"dev": "vite --port 3000",
"dev:e2e": "vite",
"build": "vite build && tsc --noEmit",
"serve": "vite preview",
"start": "vite",
Expand All @@ -22,6 +23,9 @@
"@types/react": "^18.2.47",
"@types/react-dom": "^18.2.18",
"@vitejs/plugin-react": "^4.3.4",
"vite": "^5.4.11"
"get-port-please": "^3.1.2",
"terminate": "^2.8.0",
"vite": "^5.4.11",
"wait-port": "^1.1.0"
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,17 +8,17 @@ export default defineConfig({

reporter: [['line']],

use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: 'http://localhost:3001/',
},
// use: {
// /* Base URL to use in actions like `await page.goto('/')`. */
// baseURL: 'http://localhost:3001/',
// },

webServer: {
command: 'pnpm run dev',
url: 'http://localhost:3001',
reuseExistingServer: !process.env.CI,
stdout: 'pipe',
},
// webServer: {
// command: 'pnpm run dev',
// url: 'http://localhost:3001',
// reuseExistingServer: !process.env.CI,
// stdout: 'pipe',
// },

projects: [
{
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,12 @@
import { expect, test } from '@playwright/test'
import { expect } from '@playwright/test'
import { test } from './utils'

test.beforeEach(async ({ page }) => {
await page.goto('/')
test.beforeEach(async ({ page, setupApp }) => {
await page.goto(setupApp.ADDR + '/')
})

test.afterEach(async ({ setupApp }) => {
await setupApp.killProcess()
})

test('Navigating to a post page', async ({ page }) => {
Expand All @@ -11,7 +16,6 @@ test('Navigating to a post page', async ({ page }) => {
})

test('Navigating nested layouts', async ({ page }) => {
await page.goto('/')
await page.getByRole('link', { name: 'Layout', exact: true }).click()

await expect(page.locator('#app')).toContainText("I'm a layout")
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,12 @@
import { expect, test } from '@playwright/test'
import { expect } from '@playwright/test'
import { test } from './utils'

test.beforeEach(async ({ page }) => {
await page.goto('/')
test.beforeEach(async ({ page, setupApp }) => {
await page.goto(setupApp.ADDR + '/')
})

test.afterEach(async ({ setupApp }) => {
await setupApp.killProcess()
})

test('hovering a link with preload=intent to a route without a loader should preload route', async ({
Expand Down
40 changes: 40 additions & 0 deletions e2e/react-router/basic-file-based-code-splitting/tests/utils.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import { exec } from 'node:child_process'
import { test as baseTest } from '@playwright/test'
import { getRandomPort } from 'get-port-please'
import terminate from 'terminate/promise'
import waitPort from 'wait-port'

async function _setup(): Promise<{
PORT: number
PID: number
ADDR: string
killProcess: () => Promise<void>
}> {
const PORT = await getRandomPort()
const ADDR = `http://localhost:${PORT}`

const childProcess = exec(
`VITE_SERVER_PORT=${PORT} pnpm run dev:e2e --port ${PORT}`,
)
childProcess.stdout?.on('data', (data) => {
const message = data.toString()
console.log('Stdout:', message)
})
await waitPort({ port: PORT })

const PID = childProcess.pid!
const killProcess = () => terminate(PID)

return { PORT, PID, ADDR, killProcess }
}

type SetupApp = Awaited<ReturnType<typeof _setup>>

export const test = baseTest.extend<{ setupApp: SetupApp }>({
// don't know why playwright wants this fist argument to be destructured
// eslint-disable-next-line unused-imports/no-unused-vars
setupApp: async ({ page }, use) => {
const setup = await _setup()
await use(setup)
},
})
8 changes: 6 additions & 2 deletions e2e/react-router/basic-file-based/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@
"private": true,
"type": "module",
"scripts": {
"dev": "vite --port=3001",
"dev": "vite --port 3000",
"dev:e2e": "vite",
"build": "vite build && tsc --noEmit",
"serve": "vite preview",
"start": "vite",
Expand All @@ -24,6 +25,9 @@
"@types/react": "^18.2.47",
"@types/react-dom": "^18.2.18",
"@vitejs/plugin-react": "^4.3.4",
"vite": "^5.4.11"
"get-port-please": "^3.1.2",
"terminate": "^2.8.0",
"vite": "^5.4.11",
"wait-port": "^1.1.0"
}
}
20 changes: 10 additions & 10 deletions e2e/react-router/basic-file-based/playwright.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,17 +8,17 @@ export default defineConfig({

reporter: [['line']],

use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: 'http://localhost:3001/',
},
// use: {
// /* Base URL to use in actions like `await page.goto('/')`. */
// baseURL: 'http://localhost:3001/',
// },

webServer: {
command: 'pnpm run dev',
url: 'http://localhost:3001',
reuseExistingServer: !process.env.CI,
stdout: 'pipe',
},
// webServer: {
// command: 'pnpm run dev',
// url: 'http://localhost:3001',
// reuseExistingServer: !process.env.CI,
// stdout: 'pipe',
// },

projects: [
{
Expand Down
34 changes: 22 additions & 12 deletions e2e/react-router/basic-file-based/tests/app.spec.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,14 @@
import { expect, test } from '@playwright/test'
import { expect } from '@playwright/test'
import { test } from './utils'
import type { Page } from '@playwright/test'

test.beforeEach(async ({ page }) => {
await page.goto('/')
test.beforeEach(async ({ page, setupApp }) => {
const { ADDR } = setupApp
await page.goto(ADDR + '/')
})

test.afterEach(async ({ setupApp }) => {
await setupApp.killProcess()
})

test('Navigating to a post page', async ({ page }) => {
Expand All @@ -12,7 +18,6 @@ test('Navigating to a post page', async ({ page }) => {
})

test('Navigating nested layouts', async ({ page }) => {
await page.goto('/')
await page.getByRole('link', { name: 'Layout', exact: true }).click()

await expect(page.locator('#app')).toContainText("I'm a layout")
Expand Down Expand Up @@ -72,9 +77,10 @@ testCases.forEach(({ description, testId }) => {
})
})

test('navigating to an unnested route', async ({ page }) => {
test('navigating to an unnested route', async ({ page, setupApp }) => {
const { ADDR } = setupApp
const postId = 'hello-world'
page.goto(`/posts/${postId}/edit`)
page.goto(ADDR + `/posts/${postId}/edit`)
await expect(page.getByTestId('params-via-hook')).toContainText(postId)
await expect(page.getByTestId('params-via-route-hook')).toContainText(postId)
await expect(page.getByTestId('params-via-route-api')).toContainText(postId)
Expand All @@ -86,8 +92,12 @@ async function getRenderCount(page: Page) {
)
return renderCount
}
async function structuralSharingTest(page: Page, enabled: boolean) {
page.goto(`/structural-sharing/${enabled}/?foo=f1&bar=b1`)
async function structuralSharingTest(
page: Page,
baseUrl: string,
enabled: boolean,
) {
page.goto(baseUrl + `/structural-sharing/${enabled}/?foo=f1&bar=b1`)
await expect(page.getByTestId('enabled')).toHaveText(JSON.stringify(enabled))

async function checkSearch({ foo, bar }: { foo: string; bar: string }) {
Expand All @@ -107,13 +117,13 @@ async function structuralSharingTest(page: Page, enabled: boolean) {
await checkSearch({ bar: 'b2', foo: 'f2' })
}

test('structural sharing disabled', async ({ page }) => {
await structuralSharingTest(page, false)
test('structural sharing disabled', async ({ page, setupApp }) => {
await structuralSharingTest(page, setupApp.ADDR, false)
expect(await getRenderCount(page)).toBeGreaterThan(2)
})

test('structural sharing enabled', async ({ page }) => {
await structuralSharingTest(page, true)
test('structural sharing enabled', async ({ page, setupApp }) => {
await structuralSharingTest(page, setupApp.ADDR, true)
expect(await getRenderCount(page)).toBe(2)
await page.getByTestId('link').click()
expect(await getRenderCount(page)).toBe(2)
Expand Down
40 changes: 40 additions & 0 deletions e2e/react-router/basic-file-based/tests/utils.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import { exec } from 'node:child_process'
import { test as baseTest } from '@playwright/test'
import { getRandomPort } from 'get-port-please'
import terminate from 'terminate/promise'
import waitPort from 'wait-port'

async function _setup(): Promise<{
PORT: number
PID: number
ADDR: string
killProcess: () => Promise<void>
}> {
const PORT = await getRandomPort()
const ADDR = `http://localhost:${PORT}`

const childProcess = exec(
`VITE_SERVER_PORT=${PORT} pnpm run dev:e2e --port ${PORT}`,
)
childProcess.stdout?.on('data', (data) => {
const message = data.toString()
console.log('Stdout:', message)
})
await waitPort({ port: PORT })

const PID = childProcess.pid!
const killProcess = () => terminate(PID)

return { PORT, PID, ADDR, killProcess }
}

type SetupApp = Awaited<ReturnType<typeof _setup>>

export const test = baseTest.extend<{ setupApp: SetupApp }>({
// don't know why playwright wants this fist argument to be destructured
// eslint-disable-next-line unused-imports/no-unused-vars
setupApp: async ({ page }, use) => {
const setup = await _setup()
await use(setup)
},
})
8 changes: 6 additions & 2 deletions e2e/react-router/basic-react-query-file-based/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@
"private": true,
"type": "module",
"scripts": {
"dev": "vite --port=3001",
"dev": "vite --port 3000",
"dev:e2e": "vite",
"build": "vite build && tsc --noEmit",
"serve": "vite preview",
"start": "vite",
Expand All @@ -25,6 +26,9 @@
"@types/react": "^18.2.47",
"@types/react-dom": "^18.2.18",
"@vitejs/plugin-react": "^4.3.4",
"vite": "^5.4.11"
"get-port-please": "^3.1.2",
"terminate": "^2.8.0",
"vite": "^5.4.11",
"wait-port": "^1.1.0"
}
}
20 changes: 10 additions & 10 deletions e2e/react-router/basic-react-query-file-based/playwright.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,17 +8,17 @@ export default defineConfig({

reporter: [['line']],

use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: 'http://localhost:3001/',
},
// use: {
// /* Base URL to use in actions like `await page.goto('/')`. */
// baseURL: 'http://localhost:3001/',
// },

webServer: {
command: 'pnpm run dev',
url: 'http://localhost:3001',
reuseExistingServer: !process.env.CI,
stdout: 'pipe',
},
// webServer: {
// command: 'pnpm run dev',
// url: 'http://localhost:3001',
// reuseExistingServer: !process.env.CI,
// stdout: 'pipe',
// },

projects: [
{
Expand Down
12 changes: 8 additions & 4 deletions e2e/react-router/basic-react-query-file-based/tests/app.spec.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,12 @@
import { expect, test } from '@playwright/test'
import { expect } from '@playwright/test'
import { test } from './utils'

test.beforeEach(async ({ page }) => {
await page.goto('/')
test.beforeEach(async ({ page, setupApp }) => {
await page.goto(setupApp.ADDR + '/')
})

test.afterEach(async ({ setupApp }) => {
await setupApp.killProcess()
})

test('Navigating to a post page', async ({ page }) => {
Expand All @@ -11,7 +16,6 @@ test('Navigating to a post page', async ({ page }) => {
})

test('Navigating nested layouts', async ({ page }) => {
await page.goto('/')
await page.getByRole('link', { name: 'Layout', exact: true }).click()

await expect(page.locator('#app')).toContainText("I'm a layout")
Expand Down
Loading

0 comments on commit 106d360

Please sign in to comment.