diff --git a/.github/workflows/ui-tests.yaml b/.github/workflows/ui-tests.yaml new file mode 100644 index 0000000..083abe3 --- /dev/null +++ b/.github/workflows/ui-tests.yaml @@ -0,0 +1,40 @@ +name: Playwright Tests +on: + # push: + # branches: [ main, master ] + # pull_request: + # branches: [ main, master ] + workflow_dispatch: + inputs: + IMAGE_VER: + description: "version for build image" + type: string +# act workflow_dispatch --reuse -W .github/workflows/ui-tests.yaml +jobs: + test: + env: + working-directory: UI_tests + # defaults: + # run: + # working-directory: ${{ env.working-directory }} + timeout-minutes: 60 + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 + with: + node-version: 20 + - name: test pwd + run: ls + - name: Install dependencies + run: cd UI_Tests && npm ci + - name: Install Playwright Browsers + run: cd UI_Tests && npx playwright install --with-deps + - name: Run Playwright tests + run: cd UI_Tests && npx playwright test + - uses: actions/upload-artifact@v3 + if: always() + with: + name: playwright-report + path: UI_Tests/playwright-report/ + retention-days: 30 \ No newline at end of file diff --git a/Services/client/.prettierrc.json b/Services/client/.prettierrc.json index f8dec5b..9532646 100644 --- a/Services/client/.prettierrc.json +++ b/Services/client/.prettierrc.json @@ -1,5 +1,6 @@ { "tabWidth": 2, "semi": false, - "singleQuote": true -} + "singleQuote": true, + "trailingComma": "all" +} \ No newline at end of file diff --git a/Services/client/src/modules/01_user/components/SearchBar.vue b/Services/client/src/modules/01_user/components/SearchBar.vue index b7c3611..4e8d186 100644 --- a/Services/client/src/modules/01_user/components/SearchBar.vue +++ b/Services/client/src/modules/01_user/components/SearchBar.vue @@ -107,7 +107,9 @@ async function searchSubmit() { id="inputSearch" @keydown.enter.prevent="searchSubmit" > - + @@ -173,3 +175,9 @@ async function searchSubmit() { + + diff --git a/UI_Tests/.gitignore b/UI_Tests/.gitignore new file mode 100644 index 0000000..68c5d18 --- /dev/null +++ b/UI_Tests/.gitignore @@ -0,0 +1,5 @@ +node_modules/ +/test-results/ +/playwright-report/ +/blob-report/ +/playwright/.cache/ diff --git a/UI_Tests/Readme.md b/UI_Tests/Readme.md new file mode 100644 index 0000000..e485bda --- /dev/null +++ b/UI_Tests/Readme.md @@ -0,0 +1,20 @@ + + +## Linux +ให้อัปเดต library ที่จำเป็นก่อน +``` +sudo apt update +sudo apt upgrade +sudo apt-get install libnss3 libnspr4 libatk1.0-0 libatk-bridge2.0-0 libcups2 libxkbcommon0 libatspi2.0-0 libxcomposite1 libxdamage1 libxfixes3 libxrandr2 libgbm1 libpango-1.0-0 libcairo2 libasound2 +``` + +## เรียกใช้งาน + +``` +# ถ้า clone มาเรียกคำสั่งนี้ก่อน +npx playwright install +npx playwright test --project=chromium +npx playwright show-report +``` + +ให้ติดตั้ง [LetxPath](https://chrome.google.com/webstore/detail/letxpath/bekehlnepmijedippfibbmbglglbmlgk) ใน chrome เพื่อดู selector ช่วยสำหรับเขียนโค้ดทดสอบได้ง่ายขึ้น diff --git a/UI_Tests/package-lock.json b/UI_Tests/package-lock.json new file mode 100644 index 0000000..c84bc37 --- /dev/null +++ b/UI_Tests/package-lock.json @@ -0,0 +1,91 @@ +{ + "name": "playwright", + "version": "1.0.0", + "lockfileVersion": 3, + "requires": true, + "packages": { + "": { + "name": "playwright", + "version": "1.0.0", + "license": "ISC", + "devDependencies": { + "@playwright/test": "^1.40.1", + "@types/node": "^20.10.2" + } + }, + "node_modules/@playwright/test": { + "version": "1.40.1", + "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.40.1.tgz", + "integrity": "sha512-EaaawMTOeEItCRvfmkI9v6rBkF1svM8wjl/YPRrg2N2Wmp+4qJYkWtJsbew1szfKKDm6fPLy4YAanBhIlf9dWw==", + "dev": true, + "dependencies": { + "playwright": "1.40.1" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=16" + } + }, + "node_modules/@types/node": { + "version": "20.10.3", + "resolved": "https://registry.npmjs.org/@types/node/-/node-20.10.3.tgz", + "integrity": "sha512-XJavIpZqiXID5Yxnxv3RUDKTN5b81ddNC3ecsA0SoFXz/QU8OGBwZGMomiq0zw+uuqbL/krztv/DINAQ/EV4gg==", + "dev": true, + "dependencies": { + "undici-types": "~5.26.4" + } + }, + "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, + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, + "node_modules/playwright": { + "version": "1.40.1", + "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.40.1.tgz", + "integrity": "sha512-2eHI7IioIpQ0bS1Ovg/HszsN/XKNwEG1kbzSDDmADpclKc7CyqkHw7Mg2JCz/bbCxg25QUPcjksoMW7JcIFQmw==", + "dev": true, + "dependencies": { + "playwright-core": "1.40.1" + }, + "bin": { + "playwright": "cli.js" + }, + "engines": { + "node": ">=16" + }, + "optionalDependencies": { + "fsevents": "2.3.2" + } + }, + "node_modules/playwright-core": { + "version": "1.40.1", + "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.40.1.tgz", + "integrity": "sha512-+hkOycxPiV534c4HhpfX6yrlawqVUzITRKwHAmYfmsVreltEl6fAZJ3DPfLMOODw0H3s1Itd6MDCWmP1fl/QvQ==", + "dev": true, + "bin": { + "playwright-core": "cli.js" + }, + "engines": { + "node": ">=16" + } + }, + "node_modules/undici-types": { + "version": "5.26.5", + "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", + "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==", + "dev": true + } + } +} diff --git a/UI_Tests/package.json b/UI_Tests/package.json new file mode 100644 index 0000000..8ca24ff --- /dev/null +++ b/UI_Tests/package.json @@ -0,0 +1,14 @@ +{ + "name": "playwright", + "version": "1.0.0", + "description": "", + "main": "index.js", + "scripts": {}, + "keywords": [], + "author": "", + "license": "ISC", + "devDependencies": { + "@playwright/test": "^1.40.1", + "@types/node": "^20.10.2" + } +} diff --git a/UI_Tests/playwright.config.ts b/UI_Tests/playwright.config.ts new file mode 100644 index 0000000..7e7653d --- /dev/null +++ b/UI_Tests/playwright.config.ts @@ -0,0 +1,78 @@ +import { defineConfig, devices } from '@playwright/test'; + +/** + * Read environment variables from file. + * https://github.com/motdotla/dotenv + */ +// require('dotenv').config(); + +/** + * See https://playwright.dev/docs/test-configuration. + */ +export default defineConfig({ + testDir: './tests', + /* Run tests in files in parallel */ + fullyParallel: true, + + /* Fail the build on CI if you accidentally left test.only in the source code. */ + forbidOnly: !!process.env.CI, + /* Retry on CI only */ + retries: process.env.CI ? 2 : 0, + /* Opt out of parallel tests on CI. */ + workers: process.env.CI ? 1 : undefined, + /* Reporter to use. See https://playwright.dev/docs/test-reporters */ + reporter: 'html', + /* 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', + //headless:false, + /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ + trace: 'on-first-retry', + }, + + /* Configure projects for major browsers */ + projects: [ + { + name: 'chromium', + use: { ...devices['Desktop Chrome'] }, + }, + + { + name: 'firefox', + use: { ...devices['Desktop Firefox'] }, + }, + + { + name: 'webkit', + use: { ...devices['Desktop Safari'] }, + }, + + /* Test against mobile viewports. */ + // { + // name: 'Mobile Chrome', + // use: { ...devices['Pixel 5'] }, + // }, + // { + // name: 'Mobile Safari', + // use: { ...devices['iPhone 12'] }, + // }, + + /* Test against branded browsers. */ + // { + // name: 'Microsoft Edge', + // use: { ...devices['Desktop Edge'], channel: 'msedge' }, + // }, + // { + // name: 'Google Chrome', + // use: { ...devices['Desktop Chrome'], channel: 'chrome' }, + // }, + ], + + /* 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, + // }, +}); diff --git a/UI_Tests/tests/login.spec.ts b/UI_Tests/tests/login.spec.ts new file mode 100644 index 0000000..ca133fb --- /dev/null +++ b/UI_Tests/tests/login.spec.ts @@ -0,0 +1,14 @@ +import { test, expect } from '@playwright/test'; +test('EDM Login/Logout Test', async ({ page }) => { + await page.goto('https://edm.frappet.synology.me'); + await expect(page).toHaveTitle("Sign in to EDM"); + await page.fill("input[name='username']","oom") + await page.fill("input[name='password']","oom") + await page.click("input[name='login']") + await page.waitForTimeout(5000) + await page.click("(//div[@role='toolbar']//button)[1]") + await page.waitForTimeout(2000) + await page.click("//div[text()='Logout']") + await page.waitForTimeout(4000) + await expect(page).toHaveTitle("Sign in to EDM"); +});