Skip to content

Commit 1a7563a

Browse files
committed
test(e2e): add new e2e testing process
1 parent 2dc0992 commit 1a7563a

25 files changed

+750
-456
lines changed

.github/workflows/playwright.yml

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
name: Playwright Tests
2+
on:
3+
push:
4+
branches: [ main ]
5+
pull_request:
6+
branches: [ main ]
7+
jobs:
8+
test:
9+
timeout-minutes: 60
10+
runs-on: ubuntu-latest
11+
steps:
12+
- uses: actions/checkout@v3
13+
- uses: actions/setup-node@v3
14+
with:
15+
node-version: 18
16+
- name: Install dependencies
17+
run: npm install -g pnpm && pnpm install
18+
- name: Install Playwright Browsers
19+
run: pnpm exec playwright install --with-deps
20+
- name: Run Playwright tests
21+
run: pnpm exec playwright test
22+
- uses: actions/upload-artifact@v3
23+
if: always()
24+
with:
25+
name: playwright-report
26+
path: playwright-report/
27+
retention-days: 30

.gitignore

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,3 +18,7 @@ browser/*
1818
# Replay
1919
replay/*
2020
!replay/package.json
21+
/test-results/
22+
/playwright-report/
23+
/blob-report/
24+
/playwright/.cache/

e2e/capture.spec.ts

Lines changed: 0 additions & 138 deletions
This file was deleted.
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
export default function RootLayout({ children }) {
2+
return (
3+
<html>
4+
<head></head>
5+
<body>{children}</body>
6+
</html>
7+
)
8+
}
Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
'use client';
2+
3+
import { useState } from 'react';
4+
5+
export default function Home() {
6+
const [count, setCounter] = useState(0)
7+
8+
function functionThatThrows() {
9+
throw new Error('Oops! Something went wrong')
10+
}
11+
12+
function triggerCaptureFlood() {
13+
for (let i = 0; i < 10000; i++) {
14+
try {
15+
functionThatThrows()
16+
} catch (e) {}
17+
}
18+
}
19+
20+
return (
21+
<main>
22+
<button onClick={triggerCaptureFlood}>Trigger flood</button>
23+
<button onClick={() => setCounter(count + 1)}>Increment</button>
24+
<p>{count}</p>
25+
</main>
26+
);
27+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { defineFlytrapConfig } from "useflytrap"
2+
3+
export default defineFlytrapConfig({
4+
projectId: 'testing-project',
5+
publicApiKey: 'pk_MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA4336HggHVTZck87ZW6PJDiq4WRFiyQI8HCifukMRKyoCOoEC2WuI94jrY1zem5793LXq7HKjUVnWVA0vJnI/xemjTMEIvJHXPAt9SoTBv5AJrYW0iS08x7CEJkhKyMrlAWZQB8taf0odgF3D2dPoBaKGq0+SnhLcenhKnyRc+zbbxV6YpnyI22wyuOK9jAI9jiCkJ5TDnGaR4rU6FLghc+tvnFPQ/UImHdwURaNwZ71EAgaaie6qSHYOYn6K7NjG511T1ZzkL2/8b4yOxlSvjlOeBcJH0eK+Pmgck6wXZoGmyOhq/1Ywn+nEYFjsrhsoveWNfJh4jMlUD63E1ZXGTQIDAQAB',
6+
secretApiKey: 'sk_XnTKeX1ozIcTYZj0iqMNDc3DT-zsem1XWwDkEoydjkCumZIZ',
7+
privateKey: 'sk_MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQDjffoeCAdVNlyTztlbo8kOKrhZEWLJAjwcKJ+6QxErKgI6gQLZa4j3iOtjXN6bnv3cterscqNRWdZUDS8mcj/F6aNMwQi8kdc8C31KhMG/kAmthbSJLTzHsIQmSErIyuUBZlAHy1p/Sh2AXcPZ0+gFooarT5KeEtx6eEqfJFz7NtvFXpimfIjbbDK44r2MAj2OIKQnlMOcZpHitToUuCFz62+cU9D9QiYd3BRFo3BnvUQCBpqJ7qpIdg5ifors2MbnXVPVnOQvb/xvjI7GVK+OU54FwkfR4r4+aByTrBdmgabI6Gr/VjCf6cRgWOyuGyi95Y18mHiMyVQPrcTVlcZNAgMBAAECggEAB94S+NfpPQKwx/HW5YrwCJvknTvzMSVxI74p6/ymytnckt5kVVWZOopTLbAICNTCTdBCzCOYz1buiSCdmVRJLVSLr7tbTH40teBl2F5n/vKByyz9FeNpHzTVFSfZ4kDWE6rQqLxZKF7NT2OuwslH1G4O/zy0wt+/HUMsvX058/wcgpf17o3K0XUf5PVMo+DluZn5jIpI2T34Xx0y0Bvz+g2dHd9JxLZJVY7+KMnRTvufUCqNP6z/Kwg6Pwj+RTFICOon9syGAcarECAggeYCla9P6kL0rtJpPSolr0NsNcoG/kr/owQaYIaUnsvAMZ+4J0SPr+SimOrDYaknt8XCFwKBgQD2SFUCEnsR0dSe5Mt7MVCWBgpx804C3HgHYtTPQMzTTtW5PDkPLjXuLPj2ugDJyHgMCY9SS+mQ/kZxqrKKVeqwhiSCpaT64F7zEMOdPwHoDrFnkOiiAYac2F4pma6VhmietdVXKvMT/uYNdhB/mJ8YK8E++/Zu4q5wi4jAZhUvOwKBgQDsd9hW33y1EzMDPmkxZEpZtaOl+cmPnRt7aUdhBd6IQbUQn6Y72cWQOn5IjCVveAc7fvKTf1Vd9bYo+Lc91/usEnl+keWirn00M49v6owo1skrRCCHoAHDleLFzoyPkycBX9MZebfWBV/6TbFp73ynlfU2OTZl4b+XgoCwhbMYFwKBgQC+s/W3PA42Fy+3tdxmUSJgeN7/q3G9v2/l8D5vGXNBMGtIGvzn51V1Tzec/Rx9IxDp6UEkbYm3b12myJGlkq++7rA4xgEBDloXhuShz1cvlKkEU+3+/IV60APh3JGWUNSUCKLg8230Ds2eoMxXsRuIQOFLXxlMdZSzqyhCKwm+XwKBgQCN58nDMHDlNXVaj/yOsHHR7igb9Y+ZCJ4ybFZyihQmTtA6/qPCrQhbak7YeIoKn8wvTxqBm1t+fHLpmYBVs6SLebbBVwqomu/2AK8maWndJDArL8IZwdLtLaieLjq5+oPg1kGXuyywWh9j1XYPbbGv3FUASkszzsqsQJu70zBL1wKBgA19hEoatxK+p3R1SjZ9vdx95NobkDIjID3MmCVV+JSqmIbMWLDZI2seyyo/aKFZde+U1WQpj0/YHcvPsCNyUxzLOYB2y8gugz5Aadg/4KQuWJwIHRVuLJoNHMOxcBnE+Pwaeh15dl4+6xa6XyY6h7TAOMNV1Jy0rGjrL6FQHmcb',
8+
mode: 'capture',
9+
logging: ["api-calls"],
10+
captureIgnores: [
11+
() => true
12+
]
13+
})
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"compilerOptions": {
3+
"paths": {
4+
"@/*": ["./*"]
5+
}
6+
}
7+
}
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { FlytrapTransformPlugin } from "useflytrap/transform"
2+
3+
/** @type {import('next').NextConfig} */
4+
const nextConfig = {
5+
webpack(config) {
6+
config.plugins = config.plugins ?? []
7+
config.infrastructureLogging = { level: 'error' }
8+
config.plugins.push(FlytrapTransformPlugin.webpack())
9+
return config
10+
}
11+
};
12+
13+
export default nextConfig;
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"name": "capture-flood-example",
3+
"version": "0.1.0",
4+
"private": true,
5+
"scripts": {
6+
"dev": "next dev",
7+
"build": "next build",
8+
"start": "next start",
9+
"lint": "next lint"
10+
},
11+
"dependencies": {
12+
"react": "^18",
13+
"react-dom": "^18",
14+
"next": "14.1.0",
15+
"useflytrap": "latest"
16+
}
17+
}
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import { join } from "path";
2+
import { createNextTest } from "../../fixture";
3+
import { expect } from '@playwright/test'
4+
import { getDirname } from "../../utils";
5+
6+
const { test } = createNextTest({
7+
path: join(getDirname(import.meta.url), 'app'),
8+
dependencies: {
9+
"useflytrap": `link:${join(getDirname(import.meta.url), '..', '..', '..')}`
10+
}
11+
})
12+
13+
// @todo: we need to install `useflytrap` by path
14+
// to test out the bug fix.
15+
// "useflytrap": "link:/Users/rasmus/Desktop/DEV/Web/flytrap-libs",
16+
17+
18+
test("flood of captures are ignored and doesn't affect app performance", async ({ page }) => {
19+
await page.goto('/');
20+
21+
// Get the initial value of the counter
22+
const initialCounterValue = await page.getByRole('paragraph').textContent()
23+
24+
if (initialCounterValue === null) {
25+
throw new Error(`Counter is null`)
26+
}
27+
28+
// Trigger flood of captures
29+
await page.getByRole('button', { name: 'Trigger flood' }).click()
30+
31+
// Then, click the increment button
32+
await page.getByRole('button', { name: 'Increment' }).click()
33+
34+
// Get the updated value of the counter
35+
const updatedCounterValue = await page.getByRole("paragraph").textContent()
36+
37+
// Check if the counter has incremented
38+
expect(updatedCounterValue).not.toBe(initialCounterValue);
39+
})

0 commit comments

Comments
 (0)