Demonstrate Playwright

examples/accident-counter/tests/counter.spec.js

@@ -1,2 +1,12 @@
 import { test, expect } from '@playwright/test';
-import { createServer } from 'vite';
+
+test.beforeEach(async ({ page }) => {
+  await page.goto('http://localhost:5173');
+});
+
+test('it has a counter', async ({ page }) => {
+  const count = page.getByTestId('counter-count');
+  const incrementButton = page.getByRole('button', { name: /increment/i });
+
+  await incrementButton.click();
+});

examples/scratchpad/__snapshots__/index.test.js.snap

@@ -0,0 +1,3 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`a super simple test 1`] = `"<div>wowowow</div>"`;

examples/scratchpad/index.js

@@ -1,5 +0,0 @@
-import { it, expect } from 'vitest';
-
-it('is a super simple test', () => {
-  expect(true).toBe(true);
-});

examples/task-list/src/mocks/handlers.js

@@ -11,4 +11,13 @@ const createTask = (title) => ({
   lastModified: new Date('02-29-2024').toISOString(),
 });
 
-export const handlers = [];
+export const handlers = [
+  http.get('/api/tasks', async () => {
+    return HttpResponse.json(tasks);
+  }),
+  http.post('/api/tasks', async ({ request }) => {
+    const { title } = await request.json();
+    const task = createTask(title);
+    return HttpResponse.json(task);
+  }),
+];

examples/task-list/tests/task-list.spec.js

@@ -1,8 +1,7 @@
 import { test, expect } from '@playwright/test';
 
-/** @type {import('../start-server').DevelopmentServer} */
 test.beforeEach(async ({ page }) => {
-  await page.goto('http://localhost:5173');
+  await page.goto('http://localhost:5174');
 });
 
 test('it should load the page', async ({ page }) => {
@@ -16,7 +15,7 @@ test('it should add a task', async ({ page }) => {
   await input.fill('Learn Playwright');
   await submit.click();
 
-  const heading = await page.getByRole('heading', { name: 'Learn Playwright' });
+  const heading = page.getByRole('heading', { name: 'Learn Playwright' });
 
   await expect(heading).toBeVisible();
 });