Delete single and bulk delete variants tests

.changeset/cuddly-crabs-lick.md

@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": minor
+---
+
+Delete single and bulk delete variants tests

playwright.config.ts

@@ -12,7 +12,7 @@ export default defineConfig({
   retries: process.env.CI ? 2 : 0,
   workers: process.env.CI ? 2 : undefined,
   reporter: process.env.CI ? "blob" : "html",
-  timeout: process.env.CI ? 60000 : 10000,
+  timeout: process.env.CI ? 60000 : 20000,
   // webServer: {
   //   command: "npm run dev",
   //   url: "http://localhost:9000/",

playwright/data/e2eTestData.ts

@@ -26,6 +26,17 @@ export const PRODUCTS = {
     id: "UHJvZHVjdDo3MzM%3D",
     info: "Product that contains single variant",
   },
+  singleVariantDeleteProduct: {
+    productId: "UHJvZHVjdDo3Njc%3D",
+    variantId: "UHJvZHVjdFZhcmlhbnQ6MTIzNg%3D%3D",
+    productName: "beer with variant to be deleted",
+    info: "Delete variant via it details page product",
+  },
+  multipleVariantsBulkDeleteProduct: {
+    productId: "UHJvZHVjdDo3NjY%3D",
+    productName: "juice with variant to be deleted",
+    info: "Delete multiple variants via grid product page",
+  },
   productWithVariantWhichWillBeUpdated: {
     id: "UHJvZHVjdDo3NjU%3D",
     name: "product with variant which will be updated",

playwright/pages/basePage.ts

@@ -8,6 +8,7 @@ export class BasePage {
   constructor(
     page: Page,
     readonly pageHeader = page.getByTestId("page-header"),
+    readonly bulkDeleteGridRowsButton = page.getByTestId("bulk-delete-button"),
     readonly gridCanvas = page.locator('[data-testid="data-grid-canvas"]'),
     readonly gridInput = page
       .locator('[class="clip-region"]')
@@ -42,17 +43,26 @@ export class BasePage {
   async clickFilterButton() {
     await this.filterButton.click();
   }
+  async clickBulkDeleteGridRowsButton() {
+    await this.bulkDeleteGridRowsButton.click();
+  }
 
   async typeInSearchOnListView(searchItem: string) {
     await this.searchInputListView.fill(searchItem);
   }
   async clickNextPageButton() {
     await this.nextPagePaginationButton.click();
-    await expect(this.errorBanner).not.toBeVisible();
+    await expect(
+      this.errorBanner,
+      "No error banner should be visible",
+    ).not.toBeVisible();
   }
   async clickPreviousPageButton() {
     await this.previousPagePaginationButton.click();
-    await expect(this.errorBanner).not.toBeVisible();
+    await expect(
+      this.errorBanner,
+      "No error banner should be visible",
+    ).not.toBeVisible();
   }
   async clickNumbersOfRowsButton() {
     await this.rowNumberButton.click();
@@ -66,17 +76,26 @@ export class BasePage {
     await this.successBanner
       .locator(`text=${msg}`)
       .waitFor({ state: "visible", timeout: 10000 });
-    await expect(this.errorBanner).not.toBeVisible();
+    await expect(
+      this.errorBanner,
+      "No error banner should be visible",
+    ).not.toBeVisible();
   }
   async expectSuccessBanner() {
     await this.successBanner
       .first()
       .waitFor({ state: "visible", timeout: 15000 });
-    await expect(this.errorBanner).not.toBeVisible();
+    await expect(
+      this.errorBanner,
+      "No error banner should be visible",
+    ).not.toBeVisible();
   }
   async expectInfoBanner() {
     await this.infoBanner.first().waitFor({ state: "visible", timeout: 15000 });
-    await expect(this.errorBanner).not.toBeVisible();
+    await expect(
+      this.errorBanner,
+      "No error banner should be visible",
+    ).not.toBeVisible();
   }
 
   async getRandomInt(max: number) {

playwright/pages/dialogs/deleteVariantDialog.ts

@@ -0,0 +1,12 @@
+import type { Page } from "@playwright/test";
+
+export class DeleteVariantDialog {
+  constructor(
+    page: Page,
+    readonly deleteVariantButton = page.getByTestId("delete-variant-button"),
+  ) {}
+
+  async clickDeleteVariantButton() {
+    await this.deleteVariantButton.click();
+  }
+}

playwright/pages/productPage.ts

@@ -63,6 +63,7 @@ export class ProductPage {
     readonly saveUploadUrlButton = page.getByTestId("upload-url-button"),
     readonly editVariantButton = page.getByTestId("row-action-button"),
     readonly productUpdateFormSection = page.getByTestId("product-update-form"),
+    readonly noVariantsText = page.getByTestId("empty-data-grid-text"),
     readonly firstCategoryItem = page.locator("#downshift-0-item-0"),
     readonly visibleRadioBtn = page.locator("[name='isPublished']"),
     readonly channelAvailabilityItem = page.locator(

playwright/pages/variantsPage.ts

@@ -1,15 +1,17 @@
 import { URL_LIST } from "@data/url";
+import { ChannelSelectDialog } from "@dialogs/channelSelectDialog";
+import { DeleteVariantDialog } from "@dialogs/deleteVariantDialog";
 import type { Page } from "@playwright/test";
 
 import { BasePage } from "./basePage";
-import { ChannelSelectDialog } from "./dialogs/channelSelectDialog";
 import { MetadataSeoPage } from "./pageElements/metadataSeoPage";
 
 export class VariantsPage {
   readonly page: Page;
   channelSelectDialog: ChannelSelectDialog;
   metadataSeoPage: MetadataSeoPage;
   basePage: BasePage;
+  deleteVariantDialog: DeleteVariantDialog;
 
   constructor(
     page: Page,
@@ -22,6 +24,7 @@ export class VariantsPage {
     readonly addWarehouseButton = page.getByTestId("add-warehouse"),
     readonly chooseMediaButton = page.getByTestId("choose-media-button"),
     readonly addVariantButton = page.getByTestId("button-add-variant"),
+    readonly deleteVariantButton = page.getByTestId("button-bar-delete"),
     readonly warehouseOption = page.getByRole("menuitem"),
     readonly saveButton = page.getByTestId("button-bar-confirm"),
     readonly stockInput = page.getByTestId("stock-input"),
@@ -44,6 +47,7 @@ export class VariantsPage {
     this.basePage = new BasePage(page);
     this.metadataSeoPage = new MetadataSeoPage(page);
     this.channelSelectDialog = new ChannelSelectDialog(page);
+    this.deleteVariantDialog = new DeleteVariantDialog(page);
   }
 
   async typeVariantName(variantName = "XXL beverage") {
@@ -82,6 +86,9 @@ export class VariantsPage {
   async clickMageChannelsButton() {
     await this.manageChannels.click();
   }
+  async clickDeleteVariantButton() {
+    await this.deleteVariantButton.click();
+  }
   async clickChooseMediaButton() {
     await this.chooseMediaButton.click();
   }