chore: make tests OS agnostic (#616)

Co-authored-by: Edmund Hung <me@edmund.dev>
edmundhung · May 20, 2024 · 09063d6 · 09063d6
1 parent 1a9c9bd
commit 09063d6
Show file tree

Hide file tree

Showing 28 changed files with 14,782 additions and 12,584 deletions.
diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml
@@ -1,61 +1,64 @@
 name: Tests
 on:
   push:
-    branches:
-      - main
-      - next
-      - v1
+    branches: [main, next, v1]
   pull_request:
-    branches:
-      - main
-      - next
-      - v1
+    branches: [main, next, v1]
 jobs:
   unit:
     name: API Tests
     runs-on: ubuntu-latest
     steps:
       - name: Checkout repo
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
       - name: Setup node
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: 20
-      - uses: pnpm/action-setup@v2
-        with:
-          version: 8
-      - name: Download deps
+      - name: Enable Corepack
+        run: corepack enable
+      - name: Install dependencies
         run: pnpm i
-      - name: Build packages
-        run: pnpm run build
-      - name: Run tests
+      - name: Run Vitest tests
         run: pnpm exec vitest
-      - name: Typecheck
+      - name: Run Typecheck
         run: pnpm -r run typecheck
-
   e2e:
     name: E2E Tests
-    runs-on: ubuntu-latest
+    timeout-minutes: 60
+    runs-on: ${{ matrix.os }}
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [ubuntu-latest, macos-latest, windows-latest]
+        browser: [chromium, firefox, webkit]
+        node: [18, 20, 22]
+        exclude:
+          - os: macos-latest
+            browser: firefox
+          - os: windows-latest
+            browser: firefox
+          - os: windows-latest
+            browser: webkit
     steps:
       - name: Checkout repo
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
       - name: Setup node
-        uses: actions/setup-node@v3
-        with:
-          node-version: 20
-      - uses: pnpm/action-setup@v2
+        uses: actions/setup-node@v4
         with:
-          version: 8
-      - name: Download deps
+          node-version: ${{ matrix.node }}
+      - name: Enable Corepack
+        run: corepack enable
+      - name: Install dependencies
         run: pnpm i
-      - name: Install Playwright
-        run: pnpm exec playwright install --with-deps
-      - name: Run tests
-        run: pnpm exec playwright test
-      - name: Upload test result
-        uses: actions/upload-artifact@v2
-        if: always()
+      - name: Install Playwright Browsers
+        run: pnpm exec playwright install --with-deps ${{ matrix.browser }}
+      - name: Run Playwright tests
+        run: pnpm exec playwright test --project=${{ matrix.browser }}
+      - name: Upload report to GitHub Actions Artifacts
+        uses: actions/upload-artifact@v4
+        if: ${{ !cancelled() }}
         with:
-          name: test-results
+          name: playwright-report-${{ matrix.os }}-node${{ matrix.node }}-${{ matrix.browser }}
           path: test-results/
-          retention-days: 30
+          retention-days: 14
diff --git a/.gitignore b/.gitignore
@@ -1,6 +1,6 @@
 # Logs
-logs
 *.log
+logs
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
@@ -9,20 +9,20 @@ yarn-error.log*
 report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
 
 # Runtime data
-pids
 *.pid
-*.seed
 *.pid.lock
+*.seed
+pids
 
 # Build result
-/packages/*/*.js
 !/packages/*/rollup.config.js
+/packages/*/_virtual
 /packages/*/*.cjs
-/packages/*/*.mjs
 /packages/*/*.d.ts
-/packages/*/README
+/packages/*/*.js
+/packages/*/*.mjs
 /packages/*/LICENSE
-/packages/*/_virtual
+/packages/*/README
 
 # Anything built
 build/
@@ -41,10 +41,9 @@ node_modules/
 
 # Output of 'npm pack'
 *.tgz
-/test-results/
 /playwright-report/
 /playwright/.cache/
+/test-results/
 
 # DS Store
 .DS_Store
-**/.DS_Store
diff --git a/package.json b/package.json
@@ -20,7 +20,7 @@
 		"@conform-to/validitystate": "workspace:*",
 		"@conform-to/yup": "workspace:*",
 		"@conform-to/zod": "workspace:*",
-		"@playwright/test": "^1.40.1",
+		"@playwright/test": "^1.44.0",
 		"@remix-run/eslint-config": "^1.19.3",
 		"@remix-run/node": "^1.19.3",
 		"@types/node": "^20.10.4",
@@ -32,9 +32,7 @@
 		"yup": "^0.32.11",
 		"zod": "3.21.4"
 	},
-	"engines": {
-		"node": "20.x"
-	},
+	"packageManager": "pnpm@9.1.0+sha256.22e36fba7f4880ecf749a5ca128b8435da085ecd49575e7fb9e64d6bf4fad394",
 	"lint-staged": {
 		"*.{js,jsx,ts,tsx}": "eslint --ignore-path .gitignore --cache --ext .js,.jsx,.ts,.tsx",
 		"*.{js,jsx,ts,tsx,css,json,yaml}": "prettier --ignore-path .gitignore --write"

diff --git a/playground/app/routes/subscription.tsx b/playground/app/routes/subscription.tsx
@@ -37,7 +37,7 @@ export async function loader({ request }: LoaderFunctionArgs) {
 
 	return {
 		noClientValidate: url.searchParams.get('noClientValidate') === 'yes',
-		isStrcitMode: Boolean(process.env.CI),
+		isStrictMode: Boolean(process.env.NODE_ENV === 'production'),
 	};
 }
 
@@ -54,7 +54,7 @@ export async function action({ request }: ActionFunctionArgs) {
 }
 
 export default function Example() {
-	const { noClientValidate, isStrcitMode: strict } =
+	const { noClientValidate, isStrictMode: strict } =
 		useLoaderData<typeof loader>();
 	const actionData = useActionData<typeof action>();
 	const [form, fields] = useForm({

diff --git a/playground/public/favicon.ico b/playground/public/favicon.ico
diff --git a/playwright.config.ts b/playwright.config.ts
@@ -1,26 +1,10 @@
-import { type PlaywrightTestConfig } from '@playwright/test';
-import { devices } from '@playwright/test';
-
-/**
- * Read environment variables from file.
- * https://github.com/motdotla/dotenv
- */
-// require('dotenv').config();
+import { defineConfig, devices } from '@playwright/test';
 
 /**
  * See https://playwright.dev/docs/test-configuration.
  */
-const config: PlaywrightTestConfig = {
+export default defineConfig({
 	testDir: './tests/integrations',
-	/* Maximum time one test can run for. */
-	timeout: 30 * 1000,
-	expect: {
-		/**
-		 * Maximum time expect() should wait for the condition to be met.
-		 * For example in `await expect(locator).toHaveText();`
-		 */
-		timeout: 5000,
-	},
 	/* Run tests in files in parallel */
 	fullyParallel: true,
 	/* Fail the build on CI if you accidentally left test.only in the source code. */
@@ -30,14 +14,9 @@ const config: PlaywrightTestConfig = {
 	/* Opt out of parallel tests on CI. */
 	workers: process.env.CI ? 1 : undefined,
 	/* Reporter to use. See https://playwright.dev/docs/test-reporters */
-	// reporter: 'html',
+	reporter: process.env.CI ? 'github' : 'html',
 	/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
 	use: {
-		/* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
-		actionTimeout: 0,
-		/* Base URL to use in actions like `await page.goto('/')`. */
-		// baseURL: 'http://localhost:3000',
-
 		/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
 		trace: 'on-first-retry',
 		/* Take screenshot on testrun failure. */
@@ -48,29 +27,20 @@ const config: PlaywrightTestConfig = {
 	projects: [
 		{
 			name: 'chromium',
-			use: {
-				...devices['Desktop Chrome'],
-			},
+			use: devices['Desktop Chrome'],
 		},
 
 		{
 			name: 'firefox',
-			use: {
-				...devices['Desktop Firefox'],
-			},
+			use: devices['Desktop Firefox'],
 		},
 
 		{
 			name: 'webkit',
-			use: {
-				...devices['Desktop Safari'],
-			},
+			use: devices['Desktop Safari'],
 		},
 	],
 
-	/* Folder for test artifacts such as screenshots, videos, traces, etc. */
-	outputDir: 'test-results/',
-
 	/* Run your local dev server before starting the tests */
 	webServer: {
 		command: 'pnpm --filter=./playground start',
@@ -79,6 +49,4 @@ const config: PlaywrightTestConfig = {
 		stderr: 'pipe',
 		stdout: 'pipe',
 	},
-};
-
-export default config;
+});