Migrate vouchers tests to playwright (#4578)

* change billing and shipping address in orders

* Create twenty-games-complain.md

* test rename

* Draft orders bulk delete & Create draft order tests

* Vouchers tests

* TC numbers update

* migrated vouchers tests

* removed doubled changeset

* assign voucher tests

.changeset/fair-news-fetch.md

@@ -0,0 +1,15 @@
+---
+"saleor-dashboard": minor
+---
+
+Create voucher with auto-generated codes and fixed amount discount
+Create voucher with manual code and percentage discount
+Edit voucher to have free shipping discount
+Edit voucher Usage Limits: used in total, per customer, staff only, code used once
+Create voucher with minimum value of order,
+Edit voucher minimum quantity of items
+Delete voucher
+Bulk delete voucher
+Edit voucher - assign voucher to specific product
+Edit voucher - assign voucher to specific collection
+Edit voucher - assign voucher to specific category

playwright/data/copy.ts

@@ -0,0 +1,3 @@
+export const AVAILABILITY = {
+  in1OutOf7Channels: "In 1 out of 7 channels",
+};

playwright/data/e2eTestData.ts

@@ -1,3 +1,27 @@
+export const VOUCHERS_AND_DISCOUNTS = {
+  vouchers: {
+    voucherToBeEditedWithFreeShipping: {
+      id: "Vm91Y2hlcjoyMDI%3D",
+    },
+    voucherToBeEditedUsageLimits: {
+      id: "Vm91Y2hlcjoyMDM%3D",
+    },
+    voucherToBeEditedMinimumQuantity: {
+      id: "Vm91Y2hlcjoyMDQ%3D",
+    },
+    voucherToBeEditedAssignCategoryProductCollection: {
+      id: "Vm91Y2hlcjoyMDk%3D",
+      name: "Assign category, product, collection",
+    },
+    voucherToBeBulkDeleted: {
+      names: ["Bulk delete voucher 1/2", "Bulk delete voucher 2/2"],
+    },
+    voucherToBeDeleted: {
+      name: "Delete voucher",
+      id: "Vm91Y2hlcjoyMDY%3D",
+    },
+  },
+};
 export const CUSTOMER_ADDRESS = {
   changeBillingAddress: {
     firstName: "Change Billing Address",

playwright/data/url.ts

@@ -32,6 +32,7 @@ export const URL_LIST = {
   translations: "translations/",
   variants: "variant/",
   vouchers: "discounts/vouchers/",
+  vouchersAddPage: "discounts/vouchers/add",
   variant: "variant/",
   warehouses: "warehouses/",
   webhooksAndEvents: "custom-apps/",

playwright/pages/basePage.ts

@@ -178,7 +178,10 @@ export class BasePage {
   }
 
   async findRowIndexBasedOnText(searchTextArray: string[]) {
-    await this.waitForGrid();
+    await this.gridCanvas
+      .locator("table tr")
+      .first()
+      .waitFor({ state: "attached" });
     let rowIndexes: number[] = [];
 
     const rows = await this.page.$$eval("table tr", rows =>
@@ -218,4 +221,22 @@ export class BasePage {
       expect(locator).toContainText(objectProperty);
     }
   }
+
+  async getNumberOfGridRowsWithText(expectedText: string) {
+    await this.gridCanvas
+      .locator("tr")
+      .filter({ hasText: expectedText })
+      .first()
+      .waitFor({ state: "attached" });
+    const gridRowsWithText = await this.gridCanvas
+      .locator("tr")
+      .filter({ hasText: expectedText })
+      .count();
+    return gridRowsWithText;
+  }
+  async getNumberOfGridRows() {
+    await this.gridCanvas.locator("tr").first().waitFor({ state: "attached" });
+    const gridRowsWithText = await this.gridCanvas.locator("tr").count();
+    return gridRowsWithText;
+  }
 }

playwright/pages/dialogs/addVoucherCodeDialog.ts

@@ -0,0 +1,24 @@
+import type { Page } from "@playwright/test";
+
+export class AddVoucherCodeDialog {
+  constructor(
+    page: Page,
+    readonly quantityInput = page.getByTestId("quantity-input"),
+    readonly prefixInput = page.getByTestId("prefix-input"),
+    readonly confirmButton = page.getByTestId("confirm-button"),
+    readonly enterCodeInput = page.getByTestId("enter-code-input"),
+  ) {}
+
+  async typeCodesQuantity(quantity = "10") {
+    await this.quantityInput.fill(quantity);
+  }
+  async typeCodesPrefix(prefix = "automation") {
+    await this.prefixInput.fill(prefix);
+  }
+  async typeCode(code = "123456789") {
+    await this.enterCodeInput.fill(code);
+  }
+  async clickConfirmButton() {
+    await this.confirmButton.click();
+  }
+}

playwright/pages/dialogs/assignSpecificProductsDialog.ts

@@ -0,0 +1,26 @@
+import type { Page } from "@playwright/test";
+
+export class AssignSpecificProductsDialog {
+  readonly page: Page;
+
+  constructor(
+    page: Page,
+    readonly nameInput = page.getByTestId("value-name").locator("input"),
+    readonly assignAndSaveButton = page.locator("button[type='submit']"),
+  ) {
+    this.page = page;
+  }
+
+  async clickAssignAndSaveButton() {
+    await this.assignAndSaveButton.click();
+    await this.assignAndSaveButton.waitFor({ state: "hidden" });
+  }
+
+  async assignSpecificProductsByNameAndSave(nameAkaText: string) {
+    const specificProductCheckbox = await this.page
+      .getByRole("row", { name: nameAkaText })
+      .getByRole("checkbox");
+    await specificProductCheckbox.click();
+    await this.clickAssignAndSaveButton();
+  }
+}

playwright/pages/dialogs/deleteVoucherDialog.ts

@@ -0,0 +1,13 @@
+import type { Page } from "@playwright/test";
+
+export class DeleteVoucherDialog {
+  readonly page: Page;
+
+  constructor(page: Page, readonly deleteButton = page.getByTestId("submit")) {
+    this.page = page;
+  }
+
+  async clickDeleteButton() {
+    await this.deleteButton.first().click();
+  }
+}

playwright/pages/dialogs/deleteVouchersDialog.ts

@@ -0,0 +1,13 @@
+import type { Page } from "@playwright/test";
+
+export class DeleteVouchersDialog {
+  readonly page: Page;
+
+  constructor(page: Page, readonly deleteButton = page.getByTestId("submit")) {
+    this.page = page;
+  }
+
+  async clickDeleteButton() {
+    await this.deleteButton.first().click();
+  }
+}

playwright/pages/pageElements/rightSideDetailsSection.ts

@@ -1,6 +1,10 @@
+import { ChannelSelectDialog } from "@pages/dialogs/channelSelectDialog";
 import { expect, Page } from "@playwright/test";
 
 export class RightSideDetailsPage {
+  readonly channelSelectDialog: ChannelSelectDialog;
+  readonly page: Page;
+
   constructor(
     page: Page,
     readonly selectWarehouseShippingMethodButton = page.getByTestId(
@@ -58,7 +62,10 @@ export class RightSideDetailsPage {
     readonly selectCustomerOption = page.getByTestId(
       "single-autocomplete-select-option",
     ),
-  ) {}
+  ) {
+    this.page = page;
+    this.channelSelectDialog = new ChannelSelectDialog(page);
+  }
 
   async clickEditBillingAddressButton() {
     await this.editBillingAddressButton.click();
@@ -123,4 +130,17 @@ export class RightSideDetailsPage {
   async selectCustomer(customer = "allison.freeman@example.com") {
     await this.selectCustomerOption.locator(`text=${customer}`).click();
   }
+
+  async selectOneChannelAsAvailableWhenMoreSelected() {
+    await this.manageChannelsButton.click();
+    await this.channelSelectDialog.clickAllChannelsCheckbox();
+    await this.channelSelectDialog.selectFirstChannel();
+    await this.channelSelectDialog.clickConfirmButton();
+  }
+  async selectOneChannelAsAvailableWhenNoneSelected() {
+    await this.manageChannelsButton.click();
+    await this.channelSelectDialog.selectFirstChannel();
+    await this.channelSelectDialog.clickConfirmButton();
+    await this.page.waitForLoadState("domcontentloaded");
+  }
 }

playwright/pages/productPage.ts

@@ -67,9 +67,6 @@ export class ProductPage extends BasePage {
     readonly channelAvailabilityItem = page.locator(
       "[data-test-id*='channel-availability-item']",
     ),
-    readonly manageChannelsButton = page.getByTestId(
-      "channels-availability-manage-button",
-    ),
     readonly addVariantButton = page.locator(
       "[data-test-id*='button-add-variant']",
     ),
@@ -177,18 +174,6 @@ export class ProductPage extends BasePage {
   async expectSuccessBanner() {
     await this.basePage.expectSuccessBanner();
   }
-  async selectOneChannelAsAvailableWhenMoreSelected() {
-    await this.manageChannelsButton.click();
-    await this.channelSelectDialog.clickAllChannelsCheckbox();
-    await this.channelSelectDialog.selectFirstChannel();
-    await this.channelSelectDialog.clickConfirmButton();
-  }
-  async selectOneChannelAsAvailableWhenNoneSelected() {
-    await this.manageChannelsButton.click();
-    await this.channelSelectDialog.selectFirstChannel();
-    await this.channelSelectDialog.clickConfirmButton();
-    await this.page.waitForLoadState("domcontentloaded");
-  }
 
   async clickCreateProductButton() {
     await this.createProductButton.click();