Add test for sorting by price, unification of productList folder (#2170)

* Add test for sorting by price, unification of productList folder

* Correction after review

* correction of function name

cypress/e2e/products/productsList/filteringProducts.js

@@ -23,7 +23,7 @@ import {
   selectProductsOutOfStock,
 } from "../../../support/pages/catalog/products/productsListPage";
 
-describe("Filtering products", () => {
+describe("As an admin I should be able to filter products", () => {
   const startsWith = "CyFilterProducts-";
   const name = `${startsWith}${faker.datatype.number()}`;
   const stockQuantity = 747;
@@ -89,15 +89,18 @@ describe("Filtering products", () => {
       .visit(urlList.products);
   });
 
-  // const filterProductsBy = ["category", "collection", "productType"];
+  const filterProductsBy = [
-  const filterProductsBy = ["category", "productType"];
+    { type: "category", testCase: "SALEOR_2601" },
+    { type: "productType", testCase: "SALEOR_2602" },
+    { type: "collection", testCase: "SALEOR_2603" },
+  ];
   filterProductsBy.forEach(filterBy => {
     it(
-      `should filter products by ${filterBy}`,
+      `should filter products by ${filterBy.type}. TC: ${filterBy.testCase}`,
       { tags: ["@productsList", "@allEnv"] },
       () => {
         cy.expectSkeletonIsVisible().waitForProgressBarToNotExist();
-        selectFilterOption(filterBy, name);
+        selectFilterOption(filterBy.type, name);
         cy.getTextFromElement(PRODUCTS_LIST.productsNames).then(product => {
           expect(product).to.includes(name);
         });
@@ -106,7 +109,7 @@ describe("Filtering products", () => {
   });
 
   it(
-    "should filter products out of stock",
+    "should filter products out of stock. TC: SALEOR_2604",
     { tags: ["@productsList", "@allEnv"] },
     () => {
       cy.expectSkeletonIsVisible();

cypress/e2e/products/productsList/pagination.js

@@ -9,7 +9,7 @@ import {
   isNumberOfProductsSameAsInSelectResultsOnPage,
 } from "../../../support/pages/catalog/products/productsListPage";
 
-describe("Products", () => {
+describe("As an admin I should be able to manage products table", () => {
   beforeEach(() => {
     cy.clearSessionData().loginUserViaRequest();
     cy.visit(urlList.products);

cypress/e2e/products/productsList/sortingProducts.js

@@ -4,33 +4,61 @@
 import { PRODUCTS_LIST } from "../../../elements/catalog/products/products-list";
 import { SHARED_ELEMENTS } from "../../../elements/shared/sharedElements";
 import { urlList } from "../../../fixtures/urlList";
-import { expectProductsSortedBy } from "../../../support/api/utils/products/productsListUtils";
+import { getDefaultChannel } from "../../../support/api/utils/channelsUtils";
+import {
+  selectChannel,
+  sortProductsBy,
+  submitFilters,
+} from "../../../support/pages/catalog/products/productsListPage";
 
-describe("Sorting products", () => {
+describe("As an admin I should be able to sort products", () => {
-  const sortByList = ["name", "type"];
+  let defaultChannel;
-  sortByList.forEach(sortBy => {
+
-    it(
+  beforeEach(() => {
-      `Sorting by ${sortBy}`,
-      { tags: ["@productsList", "@allEnv", "@stable"] },
-      () => {
     cy.clearSessionData()
       .loginUserViaRequest()
-          .visit(urlList.products);
+      .visit(urlList.products)
-        cy.expectSkeletonIsVisible();
+      .expectSkeletonIsVisible()
-        cy.get(SHARED_ELEMENTS.header).should("be.visible");
+      .get(SHARED_ELEMENTS.header)
-        if (sortBy !== "name") {
+      .should("be.visible");
-          cy.get(PRODUCTS_LIST.tableHeaders[sortBy])
+  });
+
+  before(() => {
+    cy.clearSessionData().loginUserViaRequest();
+    getDefaultChannel().then(channel => {
+      defaultChannel = channel;
+    });
+  });
+
+  it(
+    "should be able to sort products by price. TC: SALEOR_2607",
+    { tags: ["@productsList", "@allEnv", "@stable"] },
+    () => {
+      selectChannel(defaultChannel.slug);
+      submitFilters();
+      cy.get(PRODUCTS_LIST.tableHeaders.price)
         .click()
         .waitForProgressBarToNotExist();
-        }
+      sortProductsBy("price");
-        expectProductsSortedBy(sortBy);
+    },
-        cy.addAliasToGraphRequest("ProductList")
+  );
-          .get(PRODUCTS_LIST.tableHeaders[sortBy])
+
+  it(
+    "should be able to sort products by type. TC: SALEOR_2608",
+    { tags: ["@productsList", "@allEnv", "@stable"] },
+    () => {
+      cy.get(PRODUCTS_LIST.tableHeaders.type)
         .click()
-          .waitForProgressBarToNotExist()
+        .waitForProgressBarToNotExist();
-          .waitForRequestAndCheckIfNoErrors("@ProductList");
+      sortProductsBy("type");
-        expectProductsSortedBy(sortBy, false);
+    },
+  );
+
+  it(
+    "should be able to sort products by name. TC: SALEOR_2609",
+    { tags: ["@productsList", "@allEnv", "@stable"] },
+    () => {
+      sortProductsBy("name");
     },
   );
 });
-});

cypress/elements/catalog/products/products-list.js

@@ -10,13 +10,13 @@ export const PRODUCTS_LIST = {
     name: '[data-test-id="name"]',
     type: '[data-test-id="product-type"]',
     availability: '[data-test-id="availability"]',
-    price: '[data-test-id="price"]'
+    price: '[data-test-id="price"]',
   },
   tableHeaders: {
     name: "[data-test-id='col-name-header']",
     type: "[data-test-id='col-type-header']",
     availability: "[data-test-id='col-availability-header']",
-    price: "[data-test-id='col-price-header']"
+    price: "[data-test-id='col-price-header']",
   },
   showFiltersButton: '[data-test-id="show-filters-button"]',
   filters: {
@@ -27,7 +27,7 @@ export const PRODUCTS_LIST = {
       collection: '[data-test-id="filter-group-active-collections"]',
       productType: '[data-test-id="filter-group-active-productType"]',
       stock: '[data-test-id="filter-group-active-stock"]',
-      channel: '[data-test-id="filter-group-active-channel"]'
+      channel: '[data-test-id="filter-group-active-channel"]',
     },
     filterField: {
       filterField: '[data-test-id*="filter-field"]',
@@ -35,12 +35,12 @@ export const PRODUCTS_LIST = {
       collection: '[data-test-id="filter-field-collections"]',
       productType: '[data-test-id="filter-field-productType"]',
       stock: '[data-test-id="filter-field-stock"]',
-      channel: '[data-test-id="filter-field-channel"]'
+      channel: '[data-test-id="filter-field-channel"]',
     },
-    filterBySearchInput: '[data-test-id="filter-field-autocomplete-input"]'
+    filterBySearchInput: '[data-test-id="filter-field-autocomplete-input"]',
   },
   nextPageButton: "[data-test='button-pagination-next']",
   previousPagePagination: "[data-test='button-pagination-back']",
   resultsOnPageSelect: "[data-test-id='PaginationRowNumberSelect']",
-  rowNumberOption: "[data-test-id='rowNumberOption']"
+  rowNumberOption: "[data-test-id='rowNumberOption']",
 };

cypress/support/api/utils/products/productsListUtils.js

@@ -1,4 +1,5 @@
 import { PRODUCTS_LIST } from "../../../../elements/catalog/products/products-list";
+
 export function getDisplayedColumnArray(columnName) {
   let productsList = new Array();
   return cy
@@ -16,6 +17,7 @@ export function getDisplayedColumnArray(columnName) {
 export function expectProductsSortedBy(columnName, inAscOrder = true) {
   let sortedProductsArray;
   let productsArray;
+
   cy.get(PRODUCTS_LIST.emptyProductRow).should("not.exist");
   getDisplayedColumnArray(columnName)
     .then(productsArrayResp => {
@@ -23,7 +25,7 @@ export function expectProductsSortedBy(columnName, inAscOrder = true) {
       sortedProductsArray = productsArray.slice();
       if (columnName !== "price") {
         sortedProductsArray = sortedProductsArray.sort((a, b) =>
-          a.localeCompare(b, undefined, { ignorePunctuation: true })
+          a.localeCompare(b, undefined, { ignorePunctuation: true }),
         );
         if (!inAscOrder) {
           sortedProductsArray.reverse();
@@ -31,13 +33,16 @@ export function expectProductsSortedBy(columnName, inAscOrder = true) {
       } else {
         sortedProductsArray = getSortedPriceColumn(
           sortedProductsArray,
-          inAscOrder
+          inAscOrder,
         );
+        if (!inAscOrder) {
+          sortedProductsArray.reverse();
+        }
       }
     })
     .then(() => {
       expect(
-        JSON.stringify(productsArray) === JSON.stringify(sortedProductsArray)
+        JSON.stringify(productsArray) === JSON.stringify(sortedProductsArray),
       ).to.be.eq(true);
     });
 }

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

@@ -5,9 +5,11 @@ import {
   SHARED_ELEMENTS,
 } from "../../../../elements/shared/sharedElements";
 import { urlList } from "../../../../fixtures/urlList";
+import { expectProductsSortedBy } from "../../../api/utils/products/productsListUtils";
 
 export function isNumberOfProductsSameAsInSelectResultsOnPage() {
   let numberOfResults;
+
   return cy
     .get(PRODUCTS_LIST.productsList)
     .should("be.visible")
@@ -27,6 +29,7 @@ export function isNumberOfProductsSameAsInSelectResultsOnPage() {
 
 export function getDisplayedColumnArray(columnName) {
   let productsList = new Array();
+
   return cy
     .get(PRODUCTS_LIST.productsList)
     .each($product => {
@@ -97,11 +100,12 @@ export function showFilters() {
 }
 
 export function selectChannel(channelSlug) {
+  cy.waitForProgressBarToNotExist();
   selectFilterBy("channel");
   cy.get(getElementByDataTestId(channelSlug)).click();
 }
 
-function submitFilters() {
+export function submitFilters() {
   cy.get(BUTTON_SELECTORS.submit)
     .click()
     .waitForProgressBarToNotExist()
@@ -114,3 +118,13 @@ export function enterProductListPage() {
     .expectSkeletonIsVisible()
     .waitForProgressBarToNotExist();
 }
+
+export function sortProductsBy(sortBy) {
+  expectProductsSortedBy(sortBy);
+  cy.addAliasToGraphRequest("ProductList")
+    .get(PRODUCTS_LIST.tableHeaders[sortBy])
+    .click()
+    .waitForProgressBarToNotExist()
+    .waitForRequestAndCheckIfNoErrors("@ProductList");
+  expectProductsSortedBy(sortBy, false);
+}