🚧/🔥: Work in progress.

packages/app/package.json

@@ -8,7 +8,7 @@
     "start": "next start -H 0.0.0.0 -p 3000",
     "lint": "next lint",
     "check-types": "tsc --noEmit --incremental",
-    "test:ui": "playwright test --ui",
+    "test:ui": "dotenvx run -f test.env -- playwright test --ui",
     "test": "dotenvx run -f test.env -- playwright test",
     "prettier:fix": "prettier --write './app' './components' './lib' ./tests",
     "prettier:check": "prettier --check './app' './components' './lib' ./tests/"
@@ -100,7 +100,6 @@
   "devDependencies": {
     "@dotenvx/dotenvx": "^1.0.1",
     "@playwright/test": "^1.37.0",
-    "@synthetixio/synpress": "^3.7.3",
     "@tailwindcss/typography": "^0.5.10",
     "@types/fluent-ffmpeg": "^2.1.21",
     "@types/fuzzy-search": "^2.1.5",
@@ -112,6 +111,7 @@
     "dotenv": "^16.4.5",
     "eslint": "8.50.0",
     "eslint-config-next": "^14.0.2",
+    "jose": "^5.6.2",
     "next-bundle-analyzer": "^0.6.8",
     "tailwind-merge": "^2.2.0",
     "tailwindcss": "3.3.2",

packages/app/tests/login.spec.ts

@@ -1,17 +1,66 @@
 import { test, expect } from '@playwright/test'
+import { getAccessToken } from '@privy-io/react-auth'
+import * as jose from 'jose'
 
 test.beforeEach(async ({ page }) => {
   await page.goto('http://localhost:3000/studio')
 })
 
-test('sign in button exists', async ({ page }) => {
-  await page.keyboard.press('Escape')
+async function generatePrivyJWT() {
+  const { publicKey, privateKey } = await jose.generateKeyPair(
+    'ES256'
+  )
 
-  const button = page.getByRole('button')
-  await expect(button).toBeVisible()
-})
+  console.log(process.env.PRIVY_APP_ID)
+
+  const session = 'test-session-' + Date.now()
+  const subject = 'did:privy:test-' + Date.now()
+  const issuer = 'privy.io'
+  const audience = process.env.PRIVY_APP_ID || ''
+  const expiration = '1h'
+
+  const authToken = await new jose.SignJWT({ sid: session })
+    .setProtectedHeader({ alg: 'ES256', typ: 'JWT' })
+    .setIssuer(issuer)
+    .setIssuedAt()
+    .setAudience(audience)
+    .setSubject(subject)
+    .setExpirationTime(expiration)
+    .sign(privateKey)
+
+  try {
+    const payload = await jose.jwtVerify(authToken, publicKey, {
+      issuer: 'privy.io',
+      audience: process.env.PRIVY_APP_ID || '',
+    })
+    console.log('JWT verified successfully. Payload:', payload)
+  } catch (error) {
+    console.error(`JWT failed to verify with error: ${error}`)
+    throw error
+  }
+
+  return authToken
+}
+
+test('login to studio page with Privy JWT', async ({ page }) => {
+  const authToken = await generatePrivyJWT()
+  const accessToken = await getAccessToken()
+
+  console.log(accessToken)
+
+  await page.goto('http://localhost:3000/studio/create', {
+    waitUntil: 'networkidle',
+  })
+
+  await page.evaluate((token) => {
+    localStorage.setItem('privy:auth:token', token)
+  }, authToken)
+
+  await page.reload({ waitUntil: 'networkidle' })
+
+  expect(page.url()).toContain('/studio')
 
-test('login with metamask', async ({ page }) => {
-  const button = page.getByRole('button')
-  await expect(button).toBeVisible()
+  await expect(page.locator('text=Studio')).toBeVisible({
+    timeout: 30000,
+  })
 })