From 0f952a6dcef3c84fc9ff4f8d23b0d14934c8ce4c Mon Sep 17 00:00:00 2001 From: Elvanos Date: Mon, 30 Oct 2023 00:40:55 +0100 Subject: [PATCH] revorked vitest to playwright tests, multiple fixes --- README.md | 9 - package.json | 12 +- playwright.config.ts | 2 + quasar.extensions.json | 14 +- quasar.testing.json | 5 - .../AppControlMenus.playwright.test.ts | 79 +++ .../AppControlMenus/AppControlMenus.vue | 42 +- .../AppControlSingleMenu.playwright.test.ts | 173 +++++++ .../AppControlSingleMenu.vue | 56 +- .../AppControlMenus/_data/project.ts | 1 - .../_testData/test.fixed.component.ts | 93 ++++ .../_testData/test.raw.component.ts | 94 ++++ .../DialogMarkdownDocument.playwright.test.ts | 3 +- .../DialogMarkdownDocument.vitest.test.ts | 19 - .../FantasiaMascotImage.playwright.test.ts | 98 +++- .../FantasiaMascotImage.vitest.test.ts | 90 ---- .../FantasiaMascotImage.vue | 3 +- .../GlobalWindowButtons.playwright.test.ts | 47 +- .../GlobalWindowButtons.vitest.test.ts | 65 --- vitest.config.ts | 25 - yarn.lock | 490 +----------------- 21 files changed, 689 insertions(+), 731 deletions(-) delete mode 100644 quasar.testing.json create mode 100644 src/components/AppControlMenus/AppControlMenus.playwright.test.ts create mode 100644 src/components/AppControlMenus/AppControlSingleMenu/AppControlSingleMenu.playwright.test.ts create mode 100644 src/components/AppControlMenus/_testData/test.fixed.component.ts create mode 100644 src/components/AppControlMenus/_testData/test.raw.component.ts delete mode 100644 src/components/DialogMarkdownDocument/DialogMarkdownDocument.vitest.test.ts delete mode 100644 src/components/FantasiaMascotImage/FantasiaMascotImage.vitest.test.ts delete mode 100644 src/components/GlobalWindowButtons/GlobalWindowButtons.vitest.test.ts delete mode 100644 vitest.config.ts diff --git a/README.md b/README.md index 7f769d7..6014faa 100644 --- a/README.md +++ b/README.md @@ -34,15 +34,6 @@ quasar build ### Testing: - -#### Unit test - with pretty web-UI -``` -test:unit:ui -``` -#### Unit test - Without any UI, fully in a terminal -``` -test:unit:ci -``` #### Component test - via Playwright ``` test:component diff --git a/package.json b/package.json index 53c77ba..c8e20f4 100644 --- a/package.json +++ b/package.json @@ -9,8 +9,6 @@ "lint": "eslint --ext .js,.ts,.vue ./", "dev:electron": "quasar dev -m electron", "build": "quasar build -m electron --publish never", - "test:unit:ui": "vitest --ui", - "test:unit:ci": "vitest run --reporter verbose", "test:component": "node \"node_modules/@playwright/test/cli.js\" test src/components/", "test:e2e": "node \"node_modules/@playwright/test/cli.js\" test test/playwright-e2e/" }, @@ -30,19 +28,14 @@ }, "devDependencies": { "@intlify/vite-plugin-vue-i18n": "^3.3.1", - "@pinia/testing": "^0.1.3", "@playwright/test": "^1.37.1", "@quasar/app-vite": "^1.3.0", "@quasar/quasar-app-extension-qmarkdown": "^2.0.0-beta.10", - "@quasar/quasar-app-extension-testing": "^2.1.0", - "@quasar/quasar-app-extension-testing-unit-vitest": "^0.4.0", "@types/lodash-es": "^4.17.10", "@types/node": "^16.18.0", "@types/uuid": "^9.0.5", "@typescript-eslint/eslint-plugin": "^5.10.0", "@typescript-eslint/parser": "^5.10.0", - "@vitest/ui": "^0.15.0", - "@vue/test-utils": "^2.0.0", "autoprefixer": "^10.4.2", "electron": "^25.5.0", "electron-builder": "^24.3.0", @@ -55,13 +48,12 @@ "jsdom": "^22.1.0", "playwright": "^1.37.1", "postcss-html": "^1.5.0", - "sass": "^1.69.0", + "sass": "1.29.0", "stylelint": "^15.10.3", "stylelint-config-standard": "^34.0.0", "stylelint-config-standard-scss": "^11.0.0", "stylelint-config-standard-vue": "^1.0.0", - "typescript": "^4.5.4", - "vitest": "^0.15.0" + "typescript": "^4.5.4" }, "engines": { "node": "^18 || ^16 || ^14.19", diff --git a/playwright.config.ts b/playwright.config.ts index 175aa80..179d204 100644 --- a/playwright.config.ts +++ b/playwright.config.ts @@ -1,6 +1,8 @@ import { defineConfig } from '@playwright/test' export default defineConfig({ + workers: 3, + fullyParallel: false, testMatch: '**/*playwright.@(spec|test).?(c|m)[jt]s?(x)', reporter: [ ['list'], diff --git a/quasar.extensions.json b/quasar.extensions.json index d29a932..c51ad8a 100644 --- a/quasar.extensions.json +++ b/quasar.extensions.json @@ -1,17 +1,5 @@ { - "@quasar/testing": { - "harnesses": [ - "unit-vitest@alpha" - ] - }, - "@quasar/testing-unit-vitest": { - "options": [ - "scripts", - "typescript", - "ui" - ] - }, "@quasar/qmarkdown": { "import_md": true } -} \ No newline at end of file +} diff --git a/quasar.testing.json b/quasar.testing.json deleted file mode 100644 index d7110cb..0000000 --- a/quasar.testing.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "unit-vitest": { - "runnerCommand": "vitest run" - } -} diff --git a/src/components/AppControlMenus/AppControlMenus.playwright.test.ts b/src/components/AppControlMenus/AppControlMenus.playwright.test.ts new file mode 100644 index 0000000..fddf141 --- /dev/null +++ b/src/components/AppControlMenus/AppControlMenus.playwright.test.ts @@ -0,0 +1,79 @@ +import { _electron as electron } from 'playwright' +import { test, expect } from '@playwright/test' +import { extraEnvVariablesAPI } from 'app/src-electron/customContentBridgeAPIs/extraEnvVariablesAPI' + +/** + * Extra env settings to trigger component testing via Playwright + */ +const extraEnvSettings = { + TEST_ENV: 'components', + COMPONENT_NAME: 'AppControlMenus', + COMPONENT_PROPS: JSON.stringify({}) +} + +/** + * Electron main filepath + */ +const electronMainFilePath:string = extraEnvVariablesAPI.ELECTRON_MAIN_FILEPATH + +/** + * Extra rended timer buffer for tests to start after loading the app + * - Change here in order manually adjust this component's wait times + */ +const faFrontendRenderTimer = extraEnvVariablesAPI.FA_FRONTEND_RENDER_TIMER + +/** + * Object of string data selectors for the component + */ +const selectorList = { + testMenu: 'appControlMenus-testMenu', + anyMenu: 'appControlMenus-anyMenu' +} + +/** + * Load a custom "Test Title" menu button in the menu and check if it loaded + */ +test('Load "Test Title" menu button sub-component', async () => { + const electronApp = await electron.launch({ + env: extraEnvSettings, + args: [electronMainFilePath] + }) + + const appWindow = await electronApp.firstWindow() + await appWindow.waitForTimeout(faFrontendRenderTimer) + + const testMenu = await appWindow.$(`[data-test-test-menu="${selectorList.testMenu}"]`) + + // Check if the tested element exists + if (testMenu !== null) { + await expect(true).toBe(true) + await electronApp.close() + } else { + // Element doesn't exist + test.fail() + } +}) + +/** + * Check if we have exactly one testing menu loaded + */ +test('Check if we have exactly one testing menu loaded', async () => { + const electronApp = await electron.launch({ + env: extraEnvSettings, + args: [electronMainFilePath] + }) + + const appWindow = await electronApp.firstWindow() + await appWindow.waitForTimeout(faFrontendRenderTimer) + + const anyMenus = await appWindow.$$(`[data-test-any-menu="${selectorList.anyMenu}"]`) + + // Check for example one testing menu + if (anyMenus.length === 1) { + await expect(true).toBe(true) + await electronApp.close() + } else { + // No menus/too many menus + test.fail() + } +}) diff --git a/src/components/AppControlMenus/AppControlMenus.vue b/src/components/AppControlMenus/AppControlMenus.vue index 629a8e5..4b5bf25 100644 --- a/src/components/AppControlMenus/AppControlMenus.vue +++ b/src/components/AppControlMenus/AppControlMenus.vue @@ -6,29 +6,57 @@ flat class="appControlMenus__inner" > - - + + - - + + - - + + + + + +