@uuv/playwright 3.4.0 → 3.4.1

package/src/cucumber/step_definitions/playwright/generated/_en-generated-cucumber-steps-definition.ts

@@ -20,26 +20,25 @@ import { DEFAULT_TIMEOUT, fs, KEY_PRESS } from "@uuv/runner-commons";
 
 import { checkA11y, injectAxe } from "axe-playwright";
 import { devices, expect } from "@playwright/test";
-import { Page, Locator } from "playwright";
-import { DataTable } from "@cucumber/cucumber";
+import { Locator, Page } from "playwright";
+import { DataTable, Given, Then, When } from "@cucumber/cucumber";
 import {
-    addCookieWhenValueIsList,
-    COOKIE_NAME, deleteCookieByName,
-    deleteCookieByValue,
-    FILTER_TYPE,
-    findWithRoleAndName,
-    findWithRoleAndNameAndContent,
-    findWithRoleAndNameAndContentDisable,
-    findWithRoleAndNameAndContentEnable,
-    findWithRoleAndNameFocused,
-    getCookie,
-    getPageOrElement,
-    MockType,
-    notFoundWithRoleAndName,
-    withinRoleAndName
+  addCookie,
+  COOKIE_NAME,
+  deleteCookieByName,
+  FILTER_TYPE,
+  findWithRoleAndName,
+  findWithRoleAndNameAndContent,
+  findWithRoleAndNameAndContentDisable,
+  findWithRoleAndNameAndContentEnable,
+  findWithRoleAndNameFocused,
+  getCookie,
+  getPageOrElement,
+  MockCookie,
+  notFoundWithRoleAndName,
+  SelectedElementCookie,
+  withinRoleAndName
 } from "../core-engine";
-
-import { Given, When, Then } from "@cucumber/cucumber";
 import { World } from "../../../preprocessor/run/world";
 import { ContextObject, RunOptions } from "axe-core";
 import path from "path";
@@ -65,10 +64,10 @@ Given(
  * Start a keyboard navigation session from the top of the page<br/><a target='_blank' href='https://github.com/Orange-OpenSource/uuv/blob/main/example/en-keyboard.feature'>Examples</a>
  * */
 Given(
-    `I start a keyboard navigation from the top of the page`,
-    async function(this: World) {
-        await this.page.mouse.click(0.5, 0.5);
-    }
+ `I start a keyboard navigation from the top of the page`,
+ async function(this: World) {
+   await this.page.mouse.click(0.5, 0.5);
+ }
 );
 
 /**
@@ -83,12 +82,12 @@ Given(`I visit path {string}`, { timeout: 60 * 1000 }, async function(this: Worl
  * Triggers a click on the selected element.<br/>Make sure you've selected an element beforehand with the <strong>within...</strong> phrases.
  * */
 When(`I click`, async function(this: World) {
-    const keyBoardFocusTargetObj = keyBoardFocusTarget(this);
-    if ((await keyBoardFocusTargetObj.count()) === 1) {
-        await keyBoardFocusTargetObj.click({ timeout: DEFAULT_TIMEOUT });
-    } else {
-        await getPageOrElement(this).then((element: Locator) => element.click({ timeout: DEFAULT_TIMEOUT }));
-    }
+  const keyBoardFocusTargetObj = keyBoardFocusTarget(this);
+  if ((await keyBoardFocusTargetObj.count()) === 1) {
+    await keyBoardFocusTargetObj.click({ timeout: DEFAULT_TIMEOUT });
+  } else {
+    await getPageOrElement(this).then((element: Locator) => element.click({ timeout: DEFAULT_TIMEOUT }));
+  }
 });
 
 /**
@@ -112,14 +111,14 @@ When(`I click on element with role {string} and name {string}`, async function(t
 When(`within the element with aria-label {string}`, async function(this: World, expectedAriaLabel: string) {
   const sanitizedExpectedAriaLabel = encodeURIComponent(expectedAriaLabel).replaceAll("%20", " ");
   await getPageOrElement(this).then((element) => expect(element.getByLabel(sanitizedExpectedAriaLabel, { exact: true })).toHaveCount(1));
-  await addCookieWhenValueIsList(this, COOKIE_NAME.SELECTED_ELEMENT, { name: FILTER_TYPE.ARIA_LABEL, value: sanitizedExpectedAriaLabel });
+  await addCookie(this, COOKIE_NAME.SELECTED_ELEMENT, new SelectedElementCookie(FILTER_TYPE.ARIA_LABEL, sanitizedExpectedAriaLabel));
 });
 
 /**
  * Deletes selected element and timeout
  * */
 When(`I reset context`, async function(this: World) {
-  await this.context.clearCookies();
+  await deleteCookieByName(this, COOKIE_NAME.SELECTED_ELEMENT);
 });
 
 /**
@@ -127,23 +126,23 @@ When(`I reset context`, async function(this: World) {
  * */
 When(`within the element with selector {string}`, async function(this: World, selector: string) {
   await getPageOrElement(this).then((element) => expect(element.locator(selector)).toHaveCount(1));
-  await addCookieWhenValueIsList(this, COOKIE_NAME.SELECTED_ELEMENT, { name: FILTER_TYPE.SELECTOR, value: selector });
+  await addCookie(this, COOKIE_NAME.SELECTED_ELEMENT, new SelectedElementCookie(FILTER_TYPE.SELECTOR, selector));
 });
 
 /**
  * Writes the sentence passed as a parameter (useful for example to fill in a form field).<br/>Make sure you've selected an element beforehand with the <strong>within...</strong> phrases.
  * */
 When(`I type the sentence {string}`, async function(this: World, textToType: string) {
-    const keyBoardFocusTargetObj = keyBoardFocusTarget(this);
-    if ((await keyBoardFocusTargetObj.count()) === 1) {
-        await keyBoardFocusTargetObj.type(textToType);
-    } else {
-        await getPageOrElement(this).then(async (element: Locator) => {
-            // console.debug(element);
-            await element.focus({ timeout: 10000 });
-            await element.type(textToType);
-        });
-    }
+  const keyBoardFocusTargetObj = keyBoardFocusTarget(this);
+  if ((await keyBoardFocusTargetObj.count()) === 1) {
+    await keyBoardFocusTargetObj.type(textToType);
+  } else {
+    await getPageOrElement(this).then(async (element: Locator) => {
+      // console.debug(element);
+      await element.focus({ timeout: 10000 });
+      await element.type(textToType);
+    });
+  }
 });
 
 /**
@@ -159,21 +158,21 @@ When(`I press {int} times on {string}`, async function(this: World, nbTimes: num
  * Press specified key: <table><thead><tr><th>Key</th><th>Description</th></tr></thead><tbody><tr><td>{tab}</td><td>Tabulation</td></tr><tr><td>{reverseTab}</td><td>Reverse tabulation</td></tr><tr><td>{down}</td><td>Arrow Down</td></tr><tr><td>{right}</td><td>Arrow Right</td></tr><tr><td>{left}</td><td>Arrow Left</td></tr><tr><td>{up}</td><td>Arrow Up</td></tr></tbody></table><br/>Make sure you've selected an element beforehand with the <strong>within...</strong> phrases.
  * */
 When(`I press {string}`, async function(this: World, key: string) {
-    await pressKey(this, key);
+  await pressKey(this, key);
 });
 
 /**
  * Move to the previous html element that can be reached with back Tab<br/><a target='_blank' href='https://github.com/Orange-OpenSource/uuv/blob/main/example/en-keyboard.feature'>Examples</a>
  * */
 When(`I go to previous keyboard element`, async function(this: World) {
-    await this.page.keyboard.press("ShiftLeft+Tab");
+  await this.page.keyboard.press("ShiftLeft+Tab");
 });
 
 /**
  * Move to the next html element that can be reached with Tab<br/><a target='_blank' href='https://github.com/Orange-OpenSource/uuv/blob/main/example/en-keyboard.feature'>Examples</a>
  * */
 When(`I go to next keyboard element`, async function(this: World) {
-    await this.page.keyboard.press("Tab");
+  await this.page.keyboard.press("Tab");
 });
 
 /**
@@ -196,7 +195,7 @@ When(`within the element with role {string} and name {string}`, async function(t
 When(`within the element with testId {string}`, async function(this: World, testId: string) {
   testId = encodeURIComponent(testId);
   await getPageOrElement(this).then(async (element) => await expect(element.getByTestId(testId)).toHaveCount(1));
-  await addCookieWhenValueIsList(this, COOKIE_NAME.SELECTED_ELEMENT, { name: FILTER_TYPE.TEST_ID, value: testId });
+  await addCookie(this, COOKIE_NAME.SELECTED_ELEMENT, new SelectedElementCookie(FILTER_TYPE.TEST_ID, testId));
 });
 
 /**
@@ -205,10 +204,10 @@ When(`within the element with testId {string}`, async function(this: World, test
 When(
  `I mock a request {} on url {string} named {string} with content {}`,
  async function(this: World, verb: string, url: string, name: string, body: any) {
-   await addCookieWhenValueIsList(this, COOKIE_NAME.MOCK_URL, { name: name, url: url });
+   await addCookie(this, COOKIE_NAME.MOCK_URL, new MockCookie(name, url, verb));
    await this.page.route(url, async route => {
-     const json = body;
-     await route.fulfill({ json });
+     await route.fulfill({ body });
+     await afterMock(this, url, verb, name);
    });
  }
 );
@@ -219,9 +218,10 @@ When(
 When(
  `I mock a request {} on url {string} named {string} with status code {int}`,
  async function(this: World, verb: string, url: string, name: string, statusCode: number) {
-   await addCookieWhenValueIsList(this, COOKIE_NAME.MOCK_URL, { name: name, url: url });
+   await addCookie(this, COOKIE_NAME.MOCK_URL, new MockCookie(name, url, verb));
    await this.page.route(url, async route => {
      await route.fulfill({ status: statusCode });
+     await afterMock(this, url, verb, name);
    });
  }
 );
@@ -232,10 +232,12 @@ When(
 When(
  `I mock a request {} on url {string} named {string} with fixture {}`,
  async function(this: World, verb: string, url: string, name: string, fixture: any) {
-   await addCookieWhenValueIsList(this, COOKIE_NAME.MOCK_URL, { name: name, url: url });
-   const data = await fs.readFileSync(path.join(getConfigDir(), `playwright/fixtures/${fixture}`));
+   await addCookie(this, COOKIE_NAME.MOCK_URL, new MockCookie(name, url, verb));
+   const data = fs.readFileSync(path.join(getConfigDir(), `playwright/fixtures/${fixture}`), "utf8");
    await this.page.route(url, async route => {
      await route.fulfill({ body: data });
+     await afterMock(this, url, verb, name);
+
    });
  }
 );
@@ -325,7 +327,7 @@ Then(
  * Check that the current page have no accessibility issue for [axe-core](https://github.com/dequelabs/axe-core/blob/develop/doc/rule-descriptions.md) [with an option](https://github.com/dequelabs/axe-core/blob/HEAD/doc/API.md#options-parameter)
  * */
 Then(
-     `I should not have any axe-core accessibility issue with option json fixture {}`,
+ `I should not have any axe-core accessibility issue with option json fixture {}`,
  async function(this: World, option: any) {
    await injectAxe(this.page as Page);
    const optionFile = await fs.readFileSync(path.join(getConfigDir(), `playwright/fixtures/${option}`));
@@ -336,8 +338,8 @@ Then(
  });
 
 function getConfigDir(): string {
-    // eslint-disable-next-line dot-notation
-    return process.env["CONFIG_DIR"] ? process.env["CONFIG_DIR"] : "";
+  // eslint-disable-next-line dot-notation
+  return process.env["CONFIG_DIR"] ? process.env["CONFIG_DIR"] : "";
 }
 
 /**
@@ -420,10 +422,10 @@ Then(
  * Checks that the Html element with the specified [accessible role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles#aria_role_types) and [name](https://russmaxdesign.github.io/html-elements-names/) is focused<br/><a target='_blank' href='https://github.com/Orange-OpenSource/uuv/blob/main/example/en-keyboard.feature'>Examples</a>
  * */
 Then(
-    `the element with role {string} and name {string} should be keyboard focused`,
-    async function(this: World, expectedRole: string, name: string) {
-        await findWithRoleAndNameFocused(this, expectedRole, name);
-    }
+ `the element with role {string} and name {string} should be keyboard focused`,
+ async function(this: World, expectedRole: string, name: string) {
+   await findWithRoleAndNameFocused(this, expectedRole, name);
+ }
 );
 
 /**
@@ -432,7 +434,7 @@ Then(
 Then(
  `the element with selector {string} should be keyboard focused`,
  async function(this: World, selector: string) {
-   await getPageOrElement(this).then( async(element) => {
+   await getPageOrElement(this).then(async (element) => {
      const locator = element.locator(selector);
      await locator.focus({ timeout: 10000 });
      await expect(locator).toHaveCount(1);
@@ -492,16 +494,16 @@ Then(`I should see an element with aria-label {string} and content {string}`, as
  * Move to the previous html element that can be reached with Tab and checks that the Html element with the specified [accessible role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles#aria_role_types) and [name](https://russmaxdesign.github.io/html-elements-names/) is focused<br/><a target='_blank' href='https://github.com/Orange-OpenSource/uuv/blob/main/example/en-keyboard.feature'>Examples</a>
  * */
 When(`the previous keyboard element focused should have name {string} and role {string}`, async function(this: World, expectedRole: string, name: string) {
-    await this.page.keyboard.press("ShiftLeft+Tab");
-    await findWithRoleAndNameFocused(this, expectedRole, name);
+  await this.page.keyboard.press("ShiftLeft+Tab");
+  await findWithRoleAndNameFocused(this, expectedRole, name);
 });
 
 /**
  * "Move to the next html element that can be reached with Tab and checks that the Html element with the specified [accessible role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles#aria_role_types) and [name](https://russmaxdesign.github.io/html-elements-names/) is focused<br/><a target='_blank' href='https://github.com/Orange-OpenSource/uuv/blob/main/example/en-keyboard.feature'>Examples</a>
  * */
 When(`the next keyboard element focused should have name {string} and role {string}`, async function(this: World, expectedRole: string, name: string) {
-    await this.page.keyboard.press("Tab");
-    await findWithRoleAndNameFocused(this, expectedRole, name);
+  await this.page.keyboard.press("Tab");
+  await findWithRoleAndNameFocused(this, expectedRole, name);
 });
 
 
@@ -510,13 +512,21 @@ When(`the next keyboard element focused should have name {string} and role {stri
  * */
 Then(`I should consume a mock named {string}`, async function(this: World, name: string) {
   const cookie = await getCookie(this, COOKIE_NAME.MOCK_URL);
-  const mockUrls: MockType[] = JSON.parse(cookie.value);
-  const mockUrl: MockType | undefined = mockUrls.find(mock => mock.name === name);
-  await expect(mockUrl).not.toBeUndefined();
-  const requestPromise = await this.page.waitForResponse(mockUrl?.url);
-  const request = await requestPromise;
-  await deleteCookieByValue(this, COOKIE_NAME.MOCK_URL, mockUrl);
-  // console.debug("request: ", request);
+  expect(() => {
+    if (!cookie.isValid()) {
+      throw new Error(`Mock ${name} must be defined before use this sentence`);
+    }
+  }).not.toThrow();
+
+  await expect.poll(async () => {
+    const cookie = await getCookie(this, COOKIE_NAME.MOCK_URL);
+    const mockUrls: MockCookie[] = JSON.parse(cookie.value);
+    const mockUrl = mockUrls.find(mock => mock.name === name);
+    if (mockUrl) {
+      return mockUrl?.isConsumed;
+    }
+    return false;
+  }).toBeDefined();
 });
 
 /**
@@ -567,42 +577,60 @@ Then(
 );
 
 async function pressKey(world: World, key: string) {
-    switch (key) {
-        case KEY_PRESS.TAB:
-            await world.page.keyboard.press("Tab");
-            break;
-        case KEY_PRESS.REVERSE_TAB:
-            await world.page.keyboard.press("ShiftLeft+Tab");
-            break;
-        case KEY_PRESS.UP:
-            await world.page.keyboard.press("ArrowUp");
-            break;
-        case KEY_PRESS.DOWN:
-            await world.page.keyboard.press("ArrowDown");
-            break;
-        case KEY_PRESS.LEFT:
-            await world.page.keyboard.press("ArrowLeft");
-            break;
-        case KEY_PRESS.RIGHT:
-            await world.page.keyboard.press("ArrowRight");
-            break;
-        default:
-            console.error("the command" + key + " is unrecognized.");
-            break;
-    }
-    await deleteCookieByName(world, COOKIE_NAME.SELECTED_ELEMENT);
-    await addCookieWhenValueIsList(world, COOKIE_NAME.SELECTED_ELEMENT, { name: FILTER_TYPE.SELECTOR_PARENT, value: "*:focus" });
+  switch (key) {
+    case KEY_PRESS.TAB:
+      await world.page.keyboard.press("Tab");
+      break;
+    case KEY_PRESS.REVERSE_TAB:
+      await world.page.keyboard.press("ShiftLeft+Tab");
+      break;
+    case KEY_PRESS.UP:
+      await world.page.keyboard.press("ArrowUp");
+      break;
+    case KEY_PRESS.DOWN:
+      await world.page.keyboard.press("ArrowDown");
+      break;
+    case KEY_PRESS.LEFT:
+      await world.page.keyboard.press("ArrowLeft");
+      break;
+    case KEY_PRESS.RIGHT:
+      await world.page.keyboard.press("ArrowRight");
+      break;
+    default:
+      console.error("the command" + key + " is unrecognized.");
+      break;
+  }
+  await deleteCookieByName(world, COOKIE_NAME.SELECTED_ELEMENT);
+  await addCookie(world, COOKIE_NAME.SELECTED_ELEMENT, new SelectedElementCookie(FILTER_TYPE.SELECTOR_PARENT, "*:focus"));
 }
 
 async function click(world: World, role: any, name: string) {
   await getPageOrElement(world).then(async (element) => {
-      const byRole = element.getByRole(role, { name: name, includeHidden: true, exact: true });
-      await expect(byRole).toHaveCount(1);
-      await byRole.click({ timeout: DEFAULT_TIMEOUT });
-      await world.context.clearCookies();
+    const byRole = element.getByRole(role, { name: name, includeHidden: true, exact: true });
+    await expect(byRole).toHaveCount(1);
+    await byRole.click({ timeout: DEFAULT_TIMEOUT });
+    await world.page.waitForLoadState();
+    await deleteCookieByName(world, COOKIE_NAME.SELECTED_ELEMENT);
   });
 }
 
 function keyBoardFocusTarget(world: World) {
-    return world.page.locator(":focus");
+  return world.page.locator(":focus");
+}
+
+async function setMockAsConsumed(name: string, mock: MockCookie, world: World<any>) {
+  const newMockCookie = new MockCookie(name, mock.url, mock.verb);
+  newMockCookie.isConsumed = true;
+  await addCookie(world, COOKIE_NAME.MOCK_URL, newMockCookie);
+}
+
+async function afterMock(world: World, url: string, verb: string, name: string) {
+  await world.page.waitForResponse(url);
+  const cookie = await getCookie(world, COOKIE_NAME.MOCK_URL);
+  const mockCookie: MockCookie[] = JSON.parse(cookie.value);
+  for (const mock of mockCookie) {
+    if (mock.name === name && mock.verb === verb && mock.url === url) {
+      await setMockAsConsumed(name, mock, world);
+    }
+  }
 }