|
1 | | -import { test } from '@playwright/test'; |
| 1 | +import { mergeTests, expect } from '@playwright/test'; |
| 2 | +import { test as card } from '../../../fixtures/card.fixture'; |
| 3 | +import { test as srPanel } from '../../../fixtures/srPanel.fixture'; |
| 4 | +import { URL_MAP } from '../../../fixtures/URL_MAP'; |
| 5 | +import { REGULAR_TEST_CARD } from '../../utils/constants'; |
2 | 6 |
|
3 | | -test('#1 Error panel is present at start, when there are no errors, but is empty', async () => { |
4 | | - // Wait for field to appear in DOM |
5 | | - // error panel exists but is empty |
| 7 | +const test = mergeTests(card, srPanel); |
| 8 | + |
| 9 | +test('#1 Error panel is present at start, when there are no errors, but is empty', async ({ card, srPanel }) => { |
| 10 | + await card.goto(URL_MAP.cardWithVisibleSrPanel); |
| 11 | + expect(await srPanel.allMessages).toHaveLength(0); |
6 | 12 | }); |
7 | 13 |
|
8 | | -test('#2 Click pay with empty fields and error panel is populated', async () => { |
9 | | - // Wait for field to appear in DOM |
10 | | - // click pay, to validate & generate errors |
11 | | - // Expect 3 elements, in order, with specific text |
12 | | - // expect(cardPage.errorPanelEls.nth(0).withExactText(CARD_NUMBER_EMPTY).exists) |
13 | | - // expect(cardPage.errorPanelEls.nth(1).withExactText(EXPIRY_DATE_EMPTY).exists) |
14 | | - // expect(cardPage.errorPanelEls.nth(2).withExactText(CVC_EMPTY).exists) |
15 | | - // no 4th element |
16 | | - // Expect focus to be place on Card number field - since SRConfig for this card comp says it should be |
| 14 | +test('#2 Click pay with empty fields and error panel is populated', async ({ card, srPanel, page, browserName }) => { |
| 15 | + const expectedSRPanelTexts = ['Enter the card number-sr', 'Enter the expiry date-sr', 'Enter the security code-sr']; |
| 16 | + await card.goto(URL_MAP.cardWithVisibleSrPanel); |
| 17 | + await card.pay(); |
| 18 | + // Wait for all sr panel messages |
| 19 | + await page.waitForFunction( |
| 20 | + expectedLength => [...document.querySelectorAll('.adyen-checkout-sr-panel__msg')].map(el => el.textContent).length === expectedLength, |
| 21 | + expectedSRPanelTexts.length |
| 22 | + ); |
| 23 | + // check individual messages |
| 24 | + const srErrorMessages = await srPanel.allMessages; |
| 25 | + srErrorMessages.forEach((retrievedText, index) => { |
| 26 | + expect(retrievedText).toHaveText(expectedSRPanelTexts[index]); |
| 27 | + }); |
| 28 | + if (browserName !== 'firefox') { |
| 29 | + await expect(card.cardNumberInput).toBeFocused(); |
| 30 | + } else { |
| 31 | + console.log('Skipping focus check for Firefox'); |
| 32 | + } |
17 | 33 | }); |
18 | 34 |
|
19 | | -test('#3 Fill out PAN & see that first error in error panel is date related', async () => { |
20 | | - // Wait for field to appear in DOM |
21 | | - // await cardPage.cardUtils.fillCardNumber(t, REGULAR_TEST_CARD); |
22 | | - // click pay, to validate & generate errors |
23 | | - // Expect 2 elements, in order, with specific text |
24 | | - // expect(cardPage.errorPanelEls.nth(0).withExactText(EXPIRY_DATE_EMPTY).exists) |
25 | | - // expect(cardPage.errorPanelEls.nth(1).withExactText(CVC_EMPTY).exists) |
26 | | - // no 3rd element |
27 | | - // Expect focus to be place on Expiry date field |
| 35 | +test('#3 Fill out PAN & see that first error in error panel is date related', async ({ card, srPanel, page, browserName }) => { |
| 36 | + const expectedSRPanelTexts = ['Enter the expiry date-sr', 'Enter the security code-sr']; |
| 37 | + await card.goto(URL_MAP.cardWithVisibleSrPanel); |
| 38 | + await card.fillCardNumber(REGULAR_TEST_CARD); |
| 39 | + await card.pay(); |
| 40 | + // Wait for all sr panel messages |
| 41 | + await page.waitForFunction( |
| 42 | + expectedLength => [...document.querySelectorAll('.adyen-checkout-sr-panel__msg')].map(el => el.textContent).length === expectedLength, |
| 43 | + expectedSRPanelTexts.length |
| 44 | + ); |
| 45 | + // check individual messages |
| 46 | + const srErrorMessages = await srPanel.allMessages; |
| 47 | + srErrorMessages.forEach((retrievedText, index) => { |
| 48 | + expect(retrievedText).toHaveText(expectedSRPanelTexts[index]); |
| 49 | + }); |
| 50 | + if (browserName !== 'firefox') { |
| 51 | + await expect(card.expiryDateInput).toBeFocused(); |
| 52 | + } else { |
| 53 | + console.log('Skipping focus check for Firefox'); |
| 54 | + } |
28 | 55 | }); |
0 commit comments