02/04: bind prisma to test cases

Author: kettanaito

exercises/02.authentication/04.solution.third-party-providers/eslint.config.js

@@ -8,7 +8,11 @@ export default [
 		files: ['**/tests/**/*.ts'],
 		rules: {
 			'react-hooks/rules-of-hooks': 'off',
-			'no-unused-vars': ['warning', { varsIgnorePattern: '^app$' }],
+			'no-unused-vars': ['warn', { argsIgnorePattern: '^app$' }],
+			'@typescript-eslint/no-unused-vars': [
+				'warn',
+				{ argsIgnorePattern: '^app$' },
+			],
 		},
 	},
 	{

exercises/02.authentication/04.solution.third-party-providers/tests/db-utils.ts

@@ -1,13 +1,13 @@
+import * as fs from 'node:fs'
 import { execSync } from 'node:child_process'
 import { faker } from '@faker-js/faker'
 import bcrypt from 'bcryptjs'
 import { UniqueEnforcer } from 'enforce-unique'
-import { getPasswordHash } from '#app/utils/auth.server.ts'
 import { prisma } from '#app/utils/db.server.ts'
 
 const uniqueUsernameEnforcer = new UniqueEnforcer()
 
-interface TestUserInfo {
+export interface TestUserInfo {
 	username: string
 	name: string
 	email: string
@@ -41,27 +41,6 @@ export function generateUserInfo(info?: Partial<TestUserInfo>): TestUserInfo {
 	}
 }
 
-export async function createUser(info?: Partial<TestUserInfo>) {
-	const userInfo = generateUserInfo(info)
-	const password = 'supersecret'
-	const user = await prisma.user.create({
-		data: {
-			...userInfo,
-			password: { create: { hash: await getPasswordHash(password) } },
-		},
-	})
-
-	return {
-		async [Symbol.asyncDispose]() {
-			await prisma.user.deleteMany({
-				where: { id: user.id },
-			})
-		},
-		...user,
-		password,
-	}
-}
-
 export async function createPasskey(input: {
 	id: string
 	userId: string
@@ -170,9 +149,9 @@ export function prepareTestDatabase(filePath: string) {
 		DATABASE_URL: `file:${filePath}`,
 	}
 
-	execSync('npx prisma migrate reset --force --skip-seed', {
-		env,
-	})
+	if (fs.existsSync(filePath)) {
+		fs.unlinkSync(filePath)
+	}
 
 	execSync('npx prisma migrate deploy', {
 		env,

exercises/02.authentication/04.solution.third-party-providers/tests/e2e/authentication-github.test.ts

@@ -1,5 +1,4 @@
 import { mockGitHubUser } from '#app/mocks/handlers.ts'
-import { createUser } from '#tests/db-utils.ts'
 import { test, expect } from '#tests/test-extend.ts'
 
 test('onboards a new GitHub user', async ({ app, navigate, page }) => {
@@ -34,7 +33,12 @@ test('onboards a new GitHub user', async ({ app, navigate, page }) => {
 	await expect(page.getByText('Thanks for signing up!')).toBeVisible()
 })
 
-test('authenticates an existing GitHub user', async ({ navigate, page }) => {
+test('authenticates the user with a connected GitHub account', async ({
+	app,
+	createUser,
+	navigate,
+	page,
+}) => {
 	await using user = await createUser({
 		name: mockGitHubUser.name,
 		username: mockGitHubUser.login,
@@ -45,4 +49,5 @@ test('authenticates an existing GitHub user', async ({ navigate, page }) => {
 	await page.getByRole('button', { name: 'Login with GitHub' }).click()
 
 	await expect(page.getByRole('link', { name: user.name! })).toBeVisible()
+	await expect(page.getByText('Your "kody" GitHub account')).toBeVisible()
 })

exercises/02.authentication/04.solution.third-party-providers/tests/test-extend.ts

@@ -1,5 +1,6 @@
 import { type AppProcess, defineLauncher } from '@epic-web/app-launcher'
 import { test as testBase, expect } from '@playwright/test'
+import { PrismaClient, type User } from '@prisma/client'
 import getPort from 'get-port'
 import {
 	definePersona,
@@ -9,14 +10,23 @@ import {
 import { href, type Register } from 'react-router'
 import { getPasswordHash } from '#app/utils/auth.server.ts'
 import { prisma } from '#app/utils/db.server.ts'
-import { generateUserInfo, prepareTestDatabase } from '#tests/db-utils'
+import {
+	generateUserInfo,
+	prepareTestDatabase,
+	type TestUserInfo,
+} from '#tests/db-utils'
 
 interface Fixtures {
 	app: AppProcess
+	databasePath: string
+	prisma: PrismaClient
 	navigate: <T extends keyof Register['pages']>(
 		...args: Parameters<typeof href<T>>
 	) => Promise<void>
 	authenticate: AuthenticateFunction<[typeof user]>
+	createUser: (
+		info?: Partial<TestUserInfo>,
+	) => Promise<AsyncDisposable & User & { password: string }>
 }
 
 const user = definePersona('user', {
@@ -54,6 +64,7 @@ const launcher = defineLauncher({
 	},
 	env({ context }) {
 		return {
+			NODE_ENV: 'test',
 			PORT: context.port.toString(),
 		}
 	},
@@ -66,31 +77,66 @@ const launcher = defineLauncher({
 })
 
 export const test = testBase.extend<Fixtures>({
-	async app({}, use, testInfo) {
+	async databasePath({}, use, testInfo) {
 		const databasePath = `./test-${testInfo.testId}.db`
+		await use(databasePath)
+	},
+	async prisma({ databasePath }, use) {
+		const prisma = new PrismaClient({
+			datasourceUrl: `file:${databasePath}`,
+		})
+		await use(prisma)
+		await prisma.$disconnect()
+	},
+	async app({ databasePath }, use) {
 		prepareTestDatabase(databasePath)
 
+		let a = performance.now()
 		/**
 		 * @todo No need to re-run the whole app on test re-runs.
 		 * Would be nice to spawn the app once, then reuse it across re-runs.
 		 * Just clear the DB between re-runs, that's crucial.
 		 */
 		const app = await launcher.run({
 			env: () => ({
+				// Configure the app's Prisma client to use the scoped database.
 				DATABASE_URL: `file:${databasePath}`,
 			}),
 		})
+		console.log('APP RUNNING IN:', performance.now() - a)
 
 		await use(app)
 		await app.dispose()
 	},
-	async navigate({ page, app }, use) {
+	async navigate({ page, app, contextOptions }, use) {
 		await use(async (...args) => {
-			const url = new URL(href(...args), app.url)
+			const url = new URL(href(...args), app.url || contextOptions.baseURL)
 			await page.goto(url.href)
 		})
 	},
 	authenticate: combinePersonas(user),
+	async createUser({ prisma }, use) {
+		await use(async (info) => {
+			const userInfo = generateUserInfo(info)
+			const password = 'supersecret'
+			const user = await prisma.user.create({
+				data: {
+					...userInfo,
+					password: { create: { hash: await getPasswordHash(password) } },
+				},
+			})
+
+			return {
+				async [Symbol.asyncDispose]() {
+					await prisma.user.deleteMany({
+						where: { id: user.id },
+					})
+				},
+				...user,
+				password,
+			}
+		})
+	},
 })
 
 export { expect }