From 6c4987d6f44bdcbe00c37ed29d5a63ac6469db04 Mon Sep 17 00:00:00 2001 From: sirin Date: Thu, 3 Oct 2024 02:57:50 +0700 Subject: [PATCH] Update playwright config + Add placeholder test --- .gitignore | 3 +++ playwright.config.ts | 25 +++++++++++++++---------- src/components/auth/loginForm.tsx | 14 +++++++++++--- test_util/global-setup.ts | 25 +++++++++++++++++++++++++ tests/test-1.spec.ts | 13 +++++++++++++ tests/test-2.spec.ts | 11 +++++++++++ 6 files changed, 78 insertions(+), 13 deletions(-) create mode 100644 test_util/global-setup.ts create mode 100644 tests/test-1.spec.ts create mode 100644 tests/test-2.spec.ts diff --git a/.gitignore b/.gitignore index c172ac0..7936bc1 100644 --- a/.gitignore +++ b/.gitignore @@ -44,3 +44,6 @@ node_modules/ /playwright-report/ /blob-report/ /playwright/.cache/ + + +storageState.json \ No newline at end of file diff --git a/playwright.config.ts b/playwright.config.ts index a05d8b5..4854f23 100644 --- a/playwright.config.ts +++ b/playwright.config.ts @@ -4,14 +4,15 @@ import { defineConfig, devices } from '@playwright/test'; * Read environment variables from file. * https://github.com/motdotla/dotenv */ -// import dotenv from 'dotenv'; -// import path from 'path'; -// dotenv.config({ path: path.resolve(__dirname, '.env') }); +import dotenv from 'dotenv'; +import path from 'path'; +dotenv.config({ path: path.resolve(__dirname, '.env') }); /** * See https://playwright.dev/docs/test-configuration. */ export default defineConfig({ + globalSetup: require.resolve('./test_util/global-setup'), testDir: './tests', /* Run tests in files in parallel */ fullyParallel: true, @@ -26,10 +27,12 @@ export default defineConfig({ /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ use: { /* Base URL to use in actions like `await page.goto('/')`. */ - // baseURL: 'http://127.0.0.1:3000', + baseURL: 'http://127.0.0.1:3000', /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ trace: 'on-first-retry', + storageState: './storageState.json', + ignoreHTTPSErrors: true, }, /* Configure projects for major browsers */ @@ -41,7 +44,9 @@ export default defineConfig({ { name: 'firefox', - use: { ...devices['Desktop Firefox'] }, + use: { ...devices['Desktop Firefox'], + storageState:"./storageState.json" + }, }, { @@ -71,9 +76,9 @@ export default defineConfig({ ], /* Run your local dev server before starting the tests */ - // webServer: { - // command: 'npm run start', - // url: 'http://127.0.0.1:3000', - // reuseExistingServer: !process.env.CI, - // }, + webServer: { + command: 'npm run dev', + url: 'http://127.0.0.1:3000', + reuseExistingServer: !process.env.CI, + }, }); diff --git a/src/components/auth/loginForm.tsx b/src/components/auth/loginForm.tsx index 536b59d..46bea2b 100644 --- a/src/components/auth/loginForm.tsx +++ b/src/components/auth/loginForm.tsx @@ -23,9 +23,17 @@ export function LoginForm() { return (
- setEmail(e.target.value)} placeholder="Email" /> - setPassword(e.target.value)} placeholder="Password" /> - + setEmail(e.target.value)} placeholder="Email" /> + setPassword(e.target.value)} + placeholder="Password" + /> +
); } diff --git a/test_util/global-setup.ts b/test_util/global-setup.ts new file mode 100644 index 0000000..60e4443 --- /dev/null +++ b/test_util/global-setup.ts @@ -0,0 +1,25 @@ +import { firefox, FullConfig } from '@playwright/test'; + +async function globalSetup(config: FullConfig) { + const email = process.env.NEXT_PUBLIC_DUMMY_EMAIL; + const password = process.env.NEXT_PUBLIC_DUMMY_PASSWORD; + const baseUrl = 'http://127.0.0.1:3000'; + + if (!email || !password) { + throw new Error('NEXT_PUBLIC_DUMMY_EMAIL and NEXT_PUBLIC_DUMMY_PASSWORD must be set'); + } + + const browser = await firefox.launch(); + const page = await browser.newPage(); + await page.goto(baseUrl + '/auth'); + await page.fill('id=email', email); + await page.fill('id=password', password); + await Promise.all([ + page.waitForURL(baseUrl), + page.click('id=login') + ]); + await page.context().storageState({ path: 'storageState.json' }); + await browser.close(); +} + +export default globalSetup; \ No newline at end of file diff --git a/tests/test-1.spec.ts b/tests/test-1.spec.ts new file mode 100644 index 0000000..23ccd59 --- /dev/null +++ b/tests/test-1.spec.ts @@ -0,0 +1,13 @@ +import { test, expect } from '@playwright/test'; + +test.use({ + storageState: './storageState.json' +}); + +test('test', async ({ page }) => { + await page.goto('http://127.0.0.1:3000/'); + await page.getByLabel('Main').getByRole('img').click(); + await page.getByPlaceholder('Enter business name...').click(); + await page.getByPlaceholder('Enter business name...').fill('neon'); + await page.getByPlaceholder('Enter business name...').press('Enter'); +}); \ No newline at end of file diff --git a/tests/test-2.spec.ts b/tests/test-2.spec.ts new file mode 100644 index 0000000..2e4a427 --- /dev/null +++ b/tests/test-2.spec.ts @@ -0,0 +1,11 @@ +import { test, expect } from '@playwright/test'; + +test.use({ + storageState: './storageState.json' +}); + +test('test', async ({ page }) => { + await page.goto('http://127.0.0.1:3000/'); + await page.getByRole('button', { name: 'Start Investing' }).click(); + await page.getByRole('heading', { name: 'Investment Opportunities' }).click(); +}); \ No newline at end of file