diff --git a/.github/actions/ui-test/action.yml b/.github/actions/ui-test/action.yml index ed021093b1df6..21c8ca8575957 100644 --- a/.github/actions/ui-test/action.yml +++ b/.github/actions/ui-test/action.yml @@ -30,6 +30,10 @@ inputs: required: false description: Database Server (mysql/mariadb) default: 'mysql' + TAKE_SCREENSHOT_AFTER_EACH_STEP: + required: false + description: Take screenshot after each step + default: 'false' runs: using: 'composite' @@ -42,7 +46,9 @@ runs: - name: Use .env.ci working-directory: ${{ inputs.TESTS_DIR }} shell: bash - run: cp .env.ci .env + run: | + cp .env.ci .env + sed -i -e "s/TAKE_SCREENSHOT_AFTER_EACH_STEP.*/TAKE_SCREENSHOT_AFTER_EACH_STEP=${{ inputs.TAKE_SCREENSHOT_AFTER_EACH_STEP == 'false' && 'false' || 'true' }}/g" .env - name: Install dependencies working-directory: ${{ inputs.TESTS_DIR }} diff --git a/tests/UI/.env.ci b/tests/UI/.env.ci index 302087f346f9b..4352745ba8046 100644 --- a/tests/UI/.env.ci +++ b/tests/UI/.env.ci @@ -32,6 +32,7 @@ INTERCEPT_ERRORS=false # Screenshots TAKE_SCREENSHOT_AFTER_FAIL=true +TAKE_SCREENSHOT_AFTER_EACH_STEP=false # Mocha GENERATE_FAILED_STEPS=false diff --git a/tests/UI/.env.local b/tests/UI/.env.local index 7a8501d4358bd..435a9ba340918 100644 --- a/tests/UI/.env.local +++ b/tests/UI/.env.local @@ -33,6 +33,7 @@ INTERCEPT_ERRORS=false # Screenshots TAKE_SCREENSHOT_AFTER_FAIL=true +TAKE_SCREENSHOT_AFTER_EACH_STEP=false # Mocha GENERATE_FAILED_STEPS=false diff --git a/tests/UI/package-lock.json b/tests/UI/package-lock.json index 800f2e0d981a8..0f4b43cb6043e 100644 --- a/tests/UI/package-lock.json +++ b/tests/UI/package-lock.json @@ -431,7 +431,7 @@ }, "node_modules/@prestashop-core/ui-testing": { "version": "0.0.12", - "resolved": "git+ssh://git@github.com/PrestaShop/ui-testing-library.git#b46a9c1dc6d7434e1e5f52cb048a5700521f8029", + "resolved": "git+ssh://git@github.com/PrestaShop/ui-testing-library.git#51a09670aa37448a83110e4a2ff844953bab2102", "license": "MIT", "dependencies": { "@faker-js/faker": "^8.3.1", @@ -8444,7 +8444,7 @@ } }, "@prestashop-core/ui-testing": { - "version": "git+ssh://git@github.com/PrestaShop/ui-testing-library.git#b46a9c1dc6d7434e1e5f52cb048a5700521f8029", + "version": "git+ssh://git@github.com/PrestaShop/ui-testing-library.git#51a09670aa37448a83110e4a2ff844953bab2102", "from": "@prestashop-core/ui-testing@https://github.com/PrestaShop/ui-testing-library#main", "requires": { "@faker-js/faker": "^8.3.1", diff --git a/tests/UI/pages/FO/classic/checkout/index.ts b/tests/UI/pages/FO/classic/checkout/index.ts index 494c6d55d5a68..d6e172d45ce23 100644 --- a/tests/UI/pages/FO/classic/checkout/index.ts +++ b/tests/UI/pages/FO/classic/checkout/index.ts @@ -765,7 +765,7 @@ class CheckoutPage extends FOBasePage { * @returns {Promise} */ async fillAddressForm(page: Page, address: FakerAddress): Promise { - if (await this.elementVisible(page, this.addressStepAliasInput)) { + if (await this.elementVisible(page, this.addressStepAliasInput, 500)) { await this.setValue(page, this.addressStepAliasInput, address.alias); } await this.setValue(page, this.addressStepPhoneInput, address.phone); diff --git a/tests/UI/types/global.d.ts b/tests/UI/types/global.d.ts index a42c87a542c57..57085d0d5db50 100644 --- a/tests/UI/types/global.d.ts +++ b/tests/UI/types/global.d.ts @@ -60,7 +60,8 @@ type GlobalBrowserErrors = { type GlobalScreenshot = { FOLDER: string - AFTER_FAIL: any + AFTER_FAIL: boolean + EACH_STEP: boolean } type GlobalMaildevConfig = { diff --git a/tests/UI/utils/globals.ts b/tests/UI/utils/globals.ts index 38cca0408df69..ad82ebfd7aabf 100755 --- a/tests/UI/utils/globals.ts +++ b/tests/UI/utils/globals.ts @@ -61,6 +61,7 @@ global.GENERATE_FAILED_STEPS = process.env.GENERATE_FAILED_STEPS ? JSON.parse(pr global.SCREENSHOT = { FOLDER: process.env.SCREENSHOT_FOLDER || './screenshots', AFTER_FAIL: process.env.TAKE_SCREENSHOT_AFTER_FAIL ? JSON.parse(process.env.TAKE_SCREENSHOT_AFTER_FAIL) : false, + EACH_STEP: process.env.TAKE_SCREENSHOT_AFTER_EACH_STEP ? JSON.parse(process.env.TAKE_SCREENSHOT_AFTER_EACH_STEP) : false, }; global.maildevConfig = { diff --git a/tests/UI/utils/setup.ts b/tests/UI/utils/setup.ts index a69051978657b..c1464fc0a20d0 100644 --- a/tests/UI/utils/setup.ts +++ b/tests/UI/utils/setup.ts @@ -1,4 +1,5 @@ import { + utilsCore, utilsFile, utilsPlaywright, } from '@prestashop-core/ui-testing'; @@ -47,6 +48,20 @@ after(async function () { } }); +const takeScreenShotAfterStep = async (browser: any, screenshotPath: string) => { + const currentTab = await utilsPlaywright.getLastOpenedTab(browser); + + // Take a screenshot + if (currentTab !== null) { + await currentTab.screenshot( + { + path: screenshotPath, + fullPage: true, + }, + ); + } +}; + /** * @function afterEach * @description Take a screenshot if a step is failed @@ -54,18 +69,23 @@ after(async function () { afterEach(async function () { // Take screenshot if demanded after failed step if (global.SCREENSHOT.AFTER_FAIL && this.currentTest?.state === 'failed') { - const currentTab = await utilsPlaywright.getLastOpenedTab(this.browser); + await takeScreenShotAfterStep(this.browser, `${global.SCREENSHOT.FOLDER}/fail_test_${screenshotNumber}.png`); + screenshotNumber += 1; + } + if (global.SCREENSHOT.EACH_STEP) { + const testPath = this.currentTest?.file; + // eslint-disable-next-line no-unsafe-optional-chaining + const folderPath = testPath?.slice(testPath?.indexOf('tests/UI') + 8).slice(0, -3); + let stepId: string = `screenshot-${screenshotNumber}`; - // Take a screenshot - if (currentTab !== null) { - await currentTab.screenshot( - { - path: `${global.SCREENSHOT.FOLDER}/fail_test_${screenshotNumber}.png`, - fullPage: true, - }, - ); + if (this.currentTest?.title) { + stepId = `${screenshotNumber}-${this.currentTest?.title}`; } + const screenshotPath = `${global.SCREENSHOT.FOLDER}${folderPath}/${utilsCore.slugify(stepId)}.png`; + await takeScreenShotAfterStep(this.browser, screenshotPath).catch((err) => { + console.log(`screenshot for ${this.currentTest?.title} failed`, err); + }); screenshotNumber += 1; } });