refactor product variants tests (#2418)

.github/PULL_REQUEST_TEMPLATE.md

@@ -51,5 +51,6 @@ To run all tests, just select the stable checkbox. To speed up tests, increase t
 19. [ ] plugins
 20. [ ] translations
 21. [ ] navigation
+22. [ ] variants
 
 CONTAINERS=1

cypress/e2e/products/productsVariants.js

@@ -4,8 +4,6 @@
 import faker from "faker";
 
 import { PRODUCT_DETAILS } from "../../elements/catalog/products/product-details";
-import { VARIANTS_SELECTORS } from "../../elements/catalog/products/variants-selectors";
-import { BUTTON_SELECTORS } from "../../elements/shared/button-selectors";
 import { urlList } from "../../fixtures/urlList";
 import { ONE_PERMISSION_USERS } from "../../fixtures/users";
 import { createChannel } from "../../support/api/requests/Channels";
@@ -15,8 +13,14 @@ import {
 } from "../../support/api/requests/Product";
 import * as productUtils from "../../support/api/utils/products/productsUtils";
 import { getProductVariants } from "../../support/api/utils/storeFront/storeFrontProductUtils";
-import { createVariant } from "../../support/pages/catalog/products/VariantsPage";
+import {
-
+  addVariantToDataGrid,
+  enterVariantEditPage,
+} from "../../support/pages/catalog/products/productDetailsPage";
+import {
+  createVariant,
+  selectChannelsForVariant,
+} from "../../support/pages/catalog/products/VariantsPage";
 describe("As an admin I should be able to create variant", () => {
   const startsWith = "CyCreateVariants-";
   const attributeValues = ["value1", "value2"];
@@ -79,34 +83,15 @@ describe("As an admin I should be able to create variant", () => {
             productId: createdProduct.id,
             channelId: newChannel.id,
           });
-          cy.visit(`${urlList.products}${createdProduct.id}`)
+          cy.visit(
-            .waitForProgressBarToNotBeVisible()
+            `${urlList.products}${createdProduct.id}`,
-            .get(PRODUCT_DETAILS.addVariantButton)
+          ).waitForProgressBarToNotBeVisible();
-            .should("exist")
+          addVariantToDataGrid(name);
-            .click()
+          cy.get(PRODUCT_DETAILS.dataGridTable)
-            .get(PRODUCT_DETAILS.dataGridTable)
             .should("be.visible")
-            .get(PRODUCT_DETAILS.firstRowDataGrid)
+            .wait(1000);
-            .click({ force: true })
+          enterVariantEditPage();
-            .type(name)
+          selectChannelsForVariant();
-            .get(BUTTON_SELECTORS.confirm)
-            .click()
-            .confirmationMessageShouldAppear()
-            .reload()
-            .waitForProgressBarToNotBeVisible()
-            .get(PRODUCT_DETAILS.dataGridTable)
-            .should("be.visible")
-            .wait(1000)
-            .get(BUTTON_SELECTORS.showMoreButton)
-            .click()
-            .get(PRODUCT_DETAILS.editVariant)
-            .click()
-            .get(VARIANTS_SELECTORS.manageChannels)
-            .click()
-            .get(VARIANTS_SELECTORS.allChannels)
-            .check()
-            .get(BUTTON_SELECTORS.submit)
-            .click();
           createVariant({
             channelName: [defaultChannel.name, newChannel.name],
             sku: name,
@@ -151,12 +136,9 @@ describe("As an admin I should be able to create variant", () => {
         .then(({ product: productResp }) => {
           createdProduct = productResp;
 
-          cy.visit(`${urlList.products}${createdProduct.id}`)
+          cy.visit(`${urlList.products}${createdProduct.id}`);
-            .get(BUTTON_SELECTORS.showMoreButton)
+          enterVariantEditPage();
-            .click()
+          cy.get(PRODUCT_DETAILS.addVariantButton)
-            .get(PRODUCT_DETAILS.editVariant)
-            .click()
-            .get(PRODUCT_DETAILS.addVariantButton)
             .click()
             .then(() => {
               createVariant({

cypress/support/pages/catalog/products/VariantsPage.js

@@ -200,3 +200,12 @@ export function saveVariant(waitForAlias = "VariantCreate") {
     .click()
     .waitForRequestAndCheckIfNoErrors(`@${waitForAlias}`);
 }
+
+export function selectChannelsForVariant() {
+  cy.get(VARIANTS_SELECTORS.manageChannels)
+    .click()
+    .get(VARIANTS_SELECTORS.allChannels)
+    .check()
+    .get(BUTTON_SELECTORS.submit)
+    .click();
+}

cypress/support/pages/catalog/products/productDetailsPage.js

@@ -133,3 +133,26 @@ export function fillUpCollectionAndCategory({ category, collection }) {
       return organization;
     });
 }
+
+export function addVariantToDataGrid(variantName) {
+  cy.get(PRODUCT_DETAILS.addVariantButton)
+    .should("exist")
+    .click()
+    .get(PRODUCT_DETAILS.dataGridTable)
+    .should("be.visible")
+    .get(PRODUCT_DETAILS.firstRowDataGrid)
+    .click({ force: true })
+    .type(variantName)
+    .get(BUTTON_SELECTORS.confirm)
+    .click()
+    .confirmationMessageShouldAppear()
+    .reload()
+    .waitForProgressBarToNotBeVisible();
+}
+
+export function enterVariantEditPage() {
+  cy.get(BUTTON_SELECTORS.showMoreButton)
+    .click()
+    .get(PRODUCT_DETAILS.editVariant)
+    .click();
+}