diff --git a/.github/workflows/playwright.yml b/.github/workflows/playwright.yml new file mode 100644 index 000000000..f630b56cb --- /dev/null +++ b/.github/workflows/playwright.yml @@ -0,0 +1,44 @@ +name: Playwright E2E Tests +on: + push: + branches: [main] + pull_request: + branches: [main] + +jobs: + e2e-test: + timeout-minutes: 60 + runs-on: ubuntu-24.04 + steps: + - uses: actions/checkout@v4 + - uses: actions/setup-node@v4 + with: + node-version: v22.11.x + - name: Install dependencies + run: | + sudo apt-get update + sudo apt-get --no-install-recommends install -y \ + libglib2.0-0 libnss3 libdbus-1-3 libatk1.0-0 libatk-bridge2.0-0 libcups2 libgtk-3-0 libasound2t64 \ + xvfb + npm ci --legacy-peer-deps + sudo chown root /home/runner/work/bruno/bruno/node_modules/electron/dist/chrome-sandbox + sudo chmod 4755 /home/runner/work/bruno/bruno/node_modules/electron/dist/chrome-sandbox + + - name: Build libraries + run: | + npm run build:graphql-docs + npm run build:bruno-query + npm run build:bruno-common + npm run sandbox:bundle-libraries --workspace=packages/bruno-js + npm run build:bruno-converters + npm run build:bruno-requests + + - name: Run Playwright tests + run: | + xvfb-run npm run test:e2e + - uses: actions/upload-artifact@v4 + if: ${{ !cancelled() }} + with: + name: playwright-report + path: playwright-report/ + retention-days: 30 diff --git a/.gitignore b/.gitignore index b97cd17e3..9331b13ff 100644 --- a/.gitignore +++ b/.gitignore @@ -47,4 +47,7 @@ yarn-error.log* #dev editor bruno.iml .idea -.vscode \ No newline at end of file +.vscode + +# Playwright +/blob-report/ diff --git a/e2e-tests/test-app-start.spec.ts b/e2e-tests/test-app-start.spec.ts new file mode 100644 index 000000000..891c7ce3b --- /dev/null +++ b/e2e-tests/test-app-start.spec.ts @@ -0,0 +1,5 @@ +import { test, expect } from '../playwright'; + +test('test-app-start', async ({ page }) => { + await expect(page.getByRole('button', { name: 'bruno' })).toBeVisible(); +}); \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 1fa51c2c1..15809857d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,8 +23,10 @@ "devDependencies": { "@faker-js/faker": "^7.6.0", "@jest/globals": "^29.2.0", + "@playwright/test": "^1.51.1", "@types/jest": "^29.5.11", "@types/lodash-es": "^4.17.12", + "@types/node": "^22.14.1", "concurrently": "^8.2.2", "eslint": "^9.26.0", "fs-extra": "^11.1.1", @@ -33,6 +35,7 @@ "jest": "^29.2.0", "lint-staged": "^15.5.2", "lodash-es": "^4.17.21", + "playwright": "^1.51.1", "pretty-quick": "^3.1.3", "randomstring": "^1.2.2", "rimraf": "^6.0.1", @@ -6103,6 +6106,22 @@ "node": ">=14" } }, + "node_modules/@playwright/test": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.52.0.tgz", + "integrity": "sha512-uh6W7sb55hl7D6vsAeA+V2p5JnlAqzhqFyF0VcJkKZXkgnFcVG9PziERRHQfPLfNGx1C292a4JqbWzhR8L4R1g==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "playwright": "1.52.0" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=18" + } + }, "node_modules/@popperjs/core": { "version": "2.11.8", "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", @@ -8273,6 +8292,7 @@ "version": "5.0.0", "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz", "integrity": "sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==", + "dev": true, "license": "MIT" }, "node_modules/@types/lodash": { @@ -8295,6 +8315,7 @@ "version": "12.2.3", "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-12.2.3.tgz", "integrity": "sha512-GKMHFfv3458yYy+v/N8gjufHO6MSZKCOXpZc5GXIWWy8uldwfmPn98vp81gZ5f9SVw8YYBctgfJ22a2d7AOMeQ==", + "dev": true, "license": "MIT", "dependencies": { "@types/linkify-it": "*", @@ -8305,6 +8326,7 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/@types/mdurl/-/mdurl-2.0.0.tgz", "integrity": "sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==", + "dev": true, "license": "MIT" }, "node_modules/@types/ms": { @@ -8315,13 +8337,13 @@ "license": "MIT" }, "node_modules/@types/node": { - "version": "22.10.2", - "resolved": "https://registry.npmjs.org/@types/node/-/node-22.10.2.tgz", - "integrity": "sha512-Xxr6BBRCAOQixvonOye19wnzyDiUtTeqldOOmj3CkeblonbccA12PFwlufvRdrpjXxqnmUaeiU5EOA+7s5diUQ==", + "version": "22.15.17", + "resolved": "https://registry.npmjs.org/@types/node/-/node-22.15.17.tgz", + "integrity": "sha512-wIX2aSZL5FE+MR0JlvF87BNVrtFWf6AE6rxSE9X7OwnVvoyCQjpzSRJ+M87se/4QCkCiebQAqrJ0y6fwIyi7nw==", "devOptional": true, "license": "MIT", "dependencies": { - "undici-types": "~6.20.0" + "undici-types": "~6.21.0" } }, "node_modules/@types/plist": { @@ -13246,6 +13268,7 @@ "version": "0.1.13", "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz", "integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -21282,6 +21305,53 @@ "integrity": "sha512-fnWVljUchTro6RiCFvCXBbNhJc2NijN7oIQxbwsyL0buWJPG85v81ehlHI9fXrJsMNgTofEoWIQeClKpgxFLrg==", "license": "MIT" }, + "node_modules/playwright": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.52.0.tgz", + "integrity": "sha512-JAwMNMBlxJ2oD1kce4KPtMkDeKGHQstdpFPcPH3maElAXon/QZeTvtsfXmTMRyO9TslfoYOXkSsvao2nE1ilTw==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "playwright-core": "1.52.0" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=18" + }, + "optionalDependencies": { + "fsevents": "2.3.2" + } + }, + "node_modules/playwright-core": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.52.0.tgz", + "integrity": "sha512-l2osTgLXSMeuLZOML9qYODUQoPPnUsKsb5/P6LJ2e6uPKXUdPK5WYhN4z03G+YNbWmGDY4YENauNu4ZKczreHg==", + "dev": true, + "license": "Apache-2.0", + "bin": { + "playwright-core": "cli.js" + }, + "engines": { + "node": ">=18" + } + }, + "node_modules/playwright/node_modules/fsevents": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", + "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", + "dev": true, + "hasInstallScript": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, "node_modules/plist": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/plist/-/plist-3.1.0.tgz", @@ -26410,7 +26480,7 @@ "version": "4.9.5", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", - "devOptional": true, + "dev": true, "license": "Apache-2.0", "bin": { "tsc": "bin/tsc", @@ -26436,9 +26506,9 @@ } }, "node_modules/undici-types": { - "version": "6.20.0", - "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", - "integrity": "sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg==", + "version": "6.21.0", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz", + "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==", "devOptional": true, "license": "MIT" }, diff --git a/package.json b/package.json index 4bd03c657..8d7ee6287 100644 --- a/package.json +++ b/package.json @@ -20,8 +20,10 @@ "devDependencies": { "@faker-js/faker": "^7.6.0", "@jest/globals": "^29.2.0", + "@playwright/test": "^1.51.1", "@types/jest": "^29.5.11", "@types/lodash-es": "^4.17.12", + "@types/node": "^22.14.1", "concurrently": "^8.2.2", "eslint": "^9.26.0", "fs-extra": "^11.1.1", @@ -30,6 +32,7 @@ "jest": "^29.2.0", "lint-staged": "^15.5.2", "lodash-es": "^4.17.21", + "playwright": "^1.51.1", "pretty-quick": "^3.1.3", "randomstring": "^1.2.2", "rimraf": "^6.0.1", @@ -57,7 +60,8 @@ "build:electron:rpm": "./scripts/build-electron.sh rpm", "build:electron:snap": "./scripts/build-electron.sh snap", "watch:common": "npm run watch --workspace=packages/bruno-common", - "test:codegen": "npm run dev:web & node ./scripts/playwright-codegen.js", + "test:codegen": "node playwright/codegen.ts", + "test:e2e": "playwright test", "test:prettier:web": "npm run test:prettier --workspace=packages/bruno-app", "prepare": "husky install", "lint": "npx eslint ./" diff --git a/playwright.config.ts b/playwright.config.ts new file mode 100644 index 000000000..b0adb030f --- /dev/null +++ b/playwright.config.ts @@ -0,0 +1,25 @@ +import { defineConfig, devices } from '@playwright/test'; + +export default defineConfig({ + testDir: './e2e-tests', + fullyParallel: false, + forbidOnly: !!process.env.CI, + retries: process.env.CI ? 2 : 0, + workers: process.env.CI ? undefined : 1, + reporter: 'html', + use: { + trace: 'on-first-retry' + }, + + projects: [ + { + name: 'Bruno Electron App' + } + ], + + webServer: { + command: 'npm run dev:web', + url: 'http://localhost:3000', + reuseExistingServer: !process.env.CI + } +}); diff --git a/playwright/codegen.ts b/playwright/codegen.ts new file mode 100644 index 000000000..da2bfcb1f --- /dev/null +++ b/playwright/codegen.ts @@ -0,0 +1,13 @@ +const path = require('path'); +const { startApp } = require('./electron.ts'); + +async function main() { + const { app, context } = await startApp(); + let outputFile = process.argv[2]?.trim(); + if (outputFile && !/\.(ts|js)$/.test(outputFile)) { + outputFile = path.join(__dirname, '../e2e-tests/', outputFile + '.spec.ts'); + } + await context._enableRecorder({ language: 'playwright-test', mode: 'recording', outputFile }); +} + +main(); diff --git a/playwright/electron.ts b/playwright/electron.ts new file mode 100644 index 000000000..bc49363f1 --- /dev/null +++ b/playwright/electron.ts @@ -0,0 +1,13 @@ +const path = require('path'); +const { _electron: electron } = require('playwright'); + +const electronAppPath = path.join(__dirname, '../packages/bruno-electron'); + +exports.startApp = async () => { + const app = await electron.launch({ args: [electronAppPath] }); + const context = await app.context(); + + app.process().stdout.on('data', (data) => console.log(data.toString())); + app.process().stderr.on('data', (error) => console.error(error.toString())); + return { app, context }; +}; diff --git a/playwright/index.ts b/playwright/index.ts new file mode 100644 index 000000000..ca865437d --- /dev/null +++ b/playwright/index.ts @@ -0,0 +1,23 @@ +import { test as baseTest, ElectronApplication, Page } from '@playwright/test'; + +const { startApp } = require('./electron.ts'); + +export const test = baseTest.extend<{ page: Page }, { electronApp: ElectronApplication }>({ + electronApp: [ + async ({}, use) => { + const { app: electronApp, context } = await startApp(); + + await use(electronApp); + await context.close(); + await electronApp.close(); + }, + { scope: 'worker' } + ], + page: async ({ electronApp }, use) => { + const page = await electronApp.firstWindow(); + await use(page); + await page.reload(); + } +}); + +export * from '@playwright/test' diff --git a/scripts/playwright-codegen.js b/scripts/playwright-codegen.js deleted file mode 100644 index ae96c7a41..000000000 --- a/scripts/playwright-codegen.js +++ /dev/null @@ -1,17 +0,0 @@ -const path = require('path'); -const timer = require('node:timers/promises'); -const { _electron: electron } = require('playwright'); - -const electronAppPath = path.join(__dirname, '../packages/bruno-electron'); - -(async () => { - const browser = await electron.launch({ args: [electronAppPath] }); - const context = await browser.context(); - await context.route('**/*', (route) => route.continue()); - - while (true) { - if(browser.windows().length) break; - await timer.setTimeout(200); - } - await browser.windows()[0].pause(); -})();