Add tests for updating & deleting collections and categories (#1662) (#1693)

* tests for updating & deleting collections and categories

* add empty spaces

* fix create category

cypress/elements/catalog/collection-selectors.js

@@ -2,5 +2,6 @@ export const COLLECTION_SELECTORS = {
   createCollectionButton: "[data-test-id = 'create-collection']",
   nameInput: "[name='name']",
   saveButton: "[data-test='button-bar-confirm']",
-  addProductButton: "[data-test-id='add-product']"
+  addProductButton: "[data-test-id='add-product']",
+  descriptionInput: '[data-test-id="description"]'
 };

cypress/elements/shared/sharedElements.js

@@ -17,6 +17,7 @@ export const SHARED_ELEMENTS = {
     loader: '[class*="codex-editor__loader"]',
     empty: '[class*="codex-editor--empty"]'
   },
+  contentEditable: '[contenteditable="true"]',
   filters: {
     filterGroupActivateCheckbox: '[data-test="filterGroupActive"]',
     filterRow: '[data-test="channel-availability-item"]'

cypress/fixtures/urlList.js

@@ -41,6 +41,9 @@ export const attributeDetailsUrl = attributeId =>
 export const categoryDetailsUrl = categoryId =>
   `${urlList.categories}${categoryId}`;
 
+export const collectionDetailsUrl = collectionId =>
+  `${urlList.collections}${collectionId}`;
+
 export const customerDetailsUrl = customerId =>
   `${urlList.customers}${customerId}`;
 

cypress/integration/catalog/categories.js

@@ -9,12 +9,16 @@ import { BUTTON_SELECTORS } from "../../elements/shared/button-selectors";
 import { SHARED_ELEMENTS } from "../../elements/shared/sharedElements";
 import { categoryDetailsUrl, urlList } from "../../fixtures/urlList";
 import { getCategory } from "../../support/api/requests/Category";
+import { createCategory as createCategoryRequest } from "../../support/api/requests/Category";
 import { deleteCategoriesStartsWith } from "../../support/api/utils/catalog/categoryUtils";
 import * as channelsUtils from "../../support/api/utils/channelsUtils";
 import * as productsUtils from "../../support/api/utils/products/productsUtils";
 import { deleteShippingStartsWith } from "../../support/api/utils/shippingUtils";
 import filterTests from "../../support/filterTests";
-import { createCategory } from "../../support/pages/catalog/categoriesPage";
+import {
+  createCategory,
+  updateCategory
+} from "../../support/pages/catalog/categoriesPage";
 
 filterTests({ definedTags: ["all"] }, () => {
   describe("Categories", () => {
@@ -79,13 +83,14 @@ filterTests({ definedTags: ["all"] }, () => {
         })
         .then(newCategory => {
           expect(newCategory.name).to.eq(categoryName);
-          // Uncomment this expect after fixing bug SALEOR-3728
+          const descriptionResp = JSON.parse(newCategory.description);
-          // expect(newCategory.description).to.eq(categoryName);
+          expect(descriptionResp.blocks[0].data.text).to.eq(categoryName);
         });
     });
 
     it("should add subcategory", () => {
       const categoryName = `${startsWith}${faker.datatype.number()}`;
+
       cy.visit(categoryDetailsUrl(category.id))
         .get(CATEGORY_DETAILS.createSubcategoryButton)
         .click();
@@ -136,5 +141,40 @@ filterTests({ definedTags: ["all"] }, () => {
       cy.contains(SHARED_ELEMENTS.tableRow, category.name).click();
       cy.contains(SHARED_ELEMENTS.header, category.name).should("be.visible");
     });
+
+    it("should delete category", () => {
+      const categoryName = `${startsWith}${faker.datatype.number()}`;
+
+      createCategoryRequest(categoryName).then(categoryResp => {
+        cy.visit(categoryDetailsUrl(categoryResp.id))
+          .get(BUTTON_SELECTORS.deleteButton)
+          .click()
+          .addAliasToGraphRequest("CategoryDelete")
+          .get(BUTTON_SELECTORS.submit)
+          .click()
+          .waitForRequestAndCheckIfNoErrors("@CategoryDelete");
+        getCategory(categoryResp.id).should("be.null");
+      });
+    });
+
+    it("should update category", () => {
+      const categoryName = `${startsWith}${faker.datatype.number()}`;
+      const updatedName = `${startsWith}updatedCategory`;
+
+      createCategoryRequest(categoryName)
+        .then(categoryResp => {
+          cy.visitAndWaitForProgressBarToDisappear(
+            categoryDetailsUrl(categoryResp.id)
+          );
+          updateCategory({ name: updatedName, description: updatedName });
+          getCategory(categoryResp.id);
+        })
+        .then(categoryResp => {
+          expect(categoryResp.name).to.eq(updatedName);
+          const descriptionJson = JSON.parse(categoryResp.description);
+          const descriptionText = descriptionJson.blocks[0].data.text;
+          expect(descriptionText).to.eq(updatedName);
+        });
+    });
   });
 });

cypress/integration/catalog/collections.js

@@ -3,8 +3,10 @@
 
 import faker from "faker";
 
-import { urlList } from "../../fixtures/urlList";
+import { BUTTON_SELECTORS } from "../../elements/shared/button-selectors";
+import { collectionDetailsUrl, urlList } from "../../fixtures/urlList";
 import { createChannel } from "../../support/api/requests/Channels";
+import { createCollection as createCollectionRequest } from "../../support/api/requests/Collections";
 import { updateChannelInProduct } from "../../support/api/requests/Product";
 import { getCollection } from "../../support/api/requests/storeFront/Collections";
 import { searchInShop } from "../../support/api/requests/storeFront/Search";
@@ -20,7 +22,8 @@ import { isProductVisibleInSearchResult } from "../../support/api/utils/storeFro
 import filterTests from "../../support/filterTests";
 import {
   assignProductsToCollection,
-  createCollection
+  createCollection,
+  updateCollection
 } from "../../support/pages/catalog/collectionsPage";
 
 filterTests({ definedTags: ["all"] }, () => {
@@ -85,9 +88,12 @@ filterTests({ definedTags: ["all"] }, () => {
           assignProductsToCollection(name);
         })
         .then(() => {
-          getCollection(collection.id, defaultChannel.slug);
+          getCollection({
+            collectionId: collection.id,
+            channelSlug: defaultChannel.slug
+          });
         })
-        .then(resp => {
+        .then(({ collection: resp }) => {
           const isVisible = isCollectionVisible(resp, collection.id);
           expect(isVisible).to.equal(false);
         });
@@ -96,6 +102,7 @@ filterTests({ definedTags: ["all"] }, () => {
     it("should display collections", () => {
       const collectionName = `${startsWith}${faker.datatype.number()}`;
       let collection;
+
       cy.visit(urlList.collections);
       cy.softExpectSkeletonIsVisible();
 
@@ -103,9 +110,12 @@ filterTests({ definedTags: ["all"] }, () => {
         .then(collectionResp => {
           collection = collectionResp;
           assignProductsToCollection(name);
-          getCollection(collection.id, defaultChannel.slug);
+          getCollection({
+            collectionId: collection.id,
+            channelSlug: defaultChannel.slug
+          });
         })
-        .then(resp => {
+        .then(({ collection: resp }) => {
           const isVisible = isCollectionVisible(resp, collection.id);
           expect(isVisible).to.equal(true);
         });
@@ -129,9 +139,12 @@ filterTests({ definedTags: ["all"] }, () => {
         .then(collectionResp => {
           collection = collectionResp;
           assignProductsToCollection(name);
-          getCollection(collection.id, defaultChannel.slug);
+          getCollection({
+            collectionId: collection.id,
+            channelSlug: defaultChannel.slug
+          });
         })
-        .then(resp => {
+        .then(({ collection: resp }) => {
           const isVisible = isCollectionVisible(resp, collection.id);
           expect(isVisible).to.equal(false);
         });
@@ -162,9 +175,12 @@ filterTests({ definedTags: ["all"] }, () => {
           assignProductsToCollection(randomName);
         })
         .then(() => {
-          getCollection(collection.id, defaultChannel.slug);
+          getCollection({
+            collectionId: collection.id,
+            channelSlug: defaultChannel.slug
+          });
         })
-        .then(resp => {
+        .then(({ collection: resp }) => {
           const isVisible = isProductInCollectionVisible(
             resp,
             createdProduct.id
@@ -182,5 +198,42 @@ filterTests({ definedTags: ["all"] }, () => {
           expect(isVisible).to.equal(false);
         });
     });
+
+    it("should delete collection", () => {
+      const collectionName = `${startsWith}${faker.datatype.number()}`;
+
+      createCollectionRequest(collectionName).then(collectionResp => {
+        cy.visit(collectionDetailsUrl(collectionResp.id))
+          .get(BUTTON_SELECTORS.deleteButton)
+          .click()
+          .addAliasToGraphRequest("RemoveCollection")
+          .get(BUTTON_SELECTORS.submit)
+          .click()
+          .waitForRequestAndCheckIfNoErrors("@RemoveCollection");
+        getCollection({ collectionId: collectionResp.id, auth: "auth" })
+          .its("collection")
+          .should("be.null");
+      });
+    });
+
+    it("should update collection", () => {
+      const collectionName = `${startsWith}${faker.datatype.number()}`;
+      const updatedName = `${startsWith}updatedCollection`;
+
+      createCollectionRequest(collectionName)
+        .then(collectionResp => {
+          cy.visitAndWaitForProgressBarToDisappear(
+            collectionDetailsUrl(collectionResp.id)
+          );
+          updateCollection({ name: updatedName, description: updatedName });
+          getCollection({ collectionId: collectionResp.id, auth: "auth" });
+        })
+        .then(({ collection: collectionResp }) => {
+          expect(collectionResp.name).to.eq(updatedName);
+          const descriptionJson = JSON.parse(collectionResp.description);
+          const descriptionText = descriptionJson.blocks[0].data.text;
+          expect(descriptionText).to.eq(updatedName);
+        });
+    });
   });
 });

cypress/support/api/requests/storeFront/Collections.js

@@ -1,9 +1,16 @@
-export function getCollection(collectionId, channelSlug) {
+import { getValueWithDefault } from "../utils/Utils";
+
+export function getCollection({ collectionId, channelSlug, auth = "token" }) {
+  const channelLine = getValueWithDefault(
+    channelSlug,
+    `channel: "${channelSlug}"`
+  );
   const query = `query Collection{
-    collection(id: "${collectionId}", channel: "${channelSlug}") {
+    collection(id: "${collectionId}" ${channelLine}) {
       id
       slug
       name
+      description
       products(first:100){
         totalCount
         edges{
@@ -15,5 +22,5 @@ export function getCollection(collectionId, channelSlug) {
       }
     }
   }`;
-  return cy.sendRequestWithQuery(query, "token");
+  return cy.sendRequestWithQuery(query, auth).its("body.data");
 }

cypress/support/api/utils/storeFront/collectionsUtils.js

@@ -1,10 +1,8 @@
-export const isCollectionVisible = (resp, collectionId) => {
+export const isCollectionVisible = (collection, collectionId) =>
-  const collection = resp.body.data.collection;
+  collection !== null && collection.id === collectionId;
-  return collection !== null && collection.id === collectionId;
-};
 
-export const isProductInCollectionVisible = (resp, productId) => {
+export const isProductInCollectionVisible = (collection, productId) => {
-  const productsList = resp.body.data.collection.products;
+  const productsList = collection.products;
   return (
     productsList.totalCount !== 0 && productsList.edges[0].node.id === productId
   );

cypress/support/pages/catalog/categoriesPage.js

@@ -1,15 +1,36 @@
 import { CATEGORY_DETAILS } from "../../../elements/catalog/categories/category-details";
 import { BUTTON_SELECTORS } from "../../../elements/shared/button-selectors";
+import { SHARED_ELEMENTS } from "../../../elements/shared/sharedElements";
 
 export function createCategory({ name, description }) {
+  fillUpCategoryGeneralInfo({ name, description });
+  return saveCategory();
+}
+
+export function updateCategory({ name, description }) {
+  fillUpCategoryGeneralInfo({ name, description });
+  return saveCategory("CategoryUpdate");
+}
+
+export function fillUpCategoryGeneralInfo({ name, description }) {
   return cy
-    .get(CATEGORY_DETAILS.nameInput)
-    .type(name)
     .get(CATEGORY_DETAILS.descriptionInput)
-    .type(description)
+    .find(SHARED_ELEMENTS.contentEditable)
-    .addAliasToGraphRequest("CategoryCreate")
+    .should("be.visible")
+    .get(CATEGORY_DETAILS.descriptionInput)
+    .click()
+    .get(CATEGORY_DETAILS.descriptionInput)
+    .find(SHARED_ELEMENTS.contentEditable)
+    .get(CATEGORY_DETAILS.descriptionInput)
+    .clearAndType(description)
+    .get(CATEGORY_DETAILS.nameInput)
+    .clearAndType(name);
+}
+
+export function saveCategory(alias = "CategoryCreate") {
+  return cy
+    .addAliasToGraphRequest(alias)
     .get(BUTTON_SELECTORS.confirm)
     .click()
-    .confirmationMessageShouldDisappear()
+    .waitForRequestAndCheckIfNoErrors(`@${alias}`);
-    .waitForRequestAndCheckIfNoErrors("@CategoryCreate");
 }

cypress/support/pages/catalog/collectionsPage.js

@@ -3,6 +3,7 @@ import { AVAILABLE_CHANNELS_FORM } from "../../../elements/channels/available-ch
 import { SELECT_CHANNELS_TO_ASSIGN } from "../../../elements/channels/select-channels-to-assign";
 import { ASSIGN_ELEMENTS_SELECTORS } from "../../../elements/shared/assign-elements-selectors";
 import { BUTTON_SELECTORS } from "../../../elements/shared/button-selectors";
+import { SHARED_ELEMENTS } from "../../../elements/shared/sharedElements";
 
 export function createCollection(collectionName, isPublished, channel) {
   const publishedSelector = isPublished
@@ -17,8 +18,7 @@ export function createCollection(collectionName, isPublished, channel) {
     .click()
     .get(SELECT_CHANNELS_TO_ASSIGN.allChannelsCheckbox)
     .click();
-  return cy
+  cy.contains(SELECT_CHANNELS_TO_ASSIGN.channelRow, channel.name)
-    .contains(SELECT_CHANNELS_TO_ASSIGN.channelRow, channel.name)
     .find(SELECT_CHANNELS_TO_ASSIGN.channelCheckbox)
     .click()
     .get(BUTTON_SELECTORS.submit)
@@ -26,13 +26,31 @@ export function createCollection(collectionName, isPublished, channel) {
     .get(AVAILABLE_CHANNELS_FORM.availableChannel)
     .click()
     .get(`${AVAILABLE_CHANNELS_FORM.publishedRadioButtons}${publishedSelector}`)
-    .click()
+    .click();
-    .addAliasToGraphRequest("CreateCollection")
+  return saveCollection().its("response.body.data.collectionCreate.collection");
+}
+export function saveCollection(alias = "CreateCollection") {
+  return cy
+    .addAliasToGraphRequest(alias)
     .get(COLLECTION_SELECTORS.saveButton)
     .click()
     .confirmationMessageShouldDisappear()
-    .waitForRequestAndCheckIfNoErrors("@CreateCollection")
+    .waitForRequestAndCheckIfNoErrors(`@${alias}`);
-    .its("response.body.data.collectionCreate.collection");
+}
+
+export function updateCollection({ name, description }) {
+  cy.get(COLLECTION_SELECTORS.descriptionInput)
+    .find(SHARED_ELEMENTS.contentEditable)
+    .should("be.visible")
+    .get(COLLECTION_SELECTORS.descriptionInput)
+    .click()
+    .get(COLLECTION_SELECTORS.descriptionInput)
+    .find(SHARED_ELEMENTS.contentEditable)
+    .get(COLLECTION_SELECTORS.descriptionInput)
+    .clearAndType(description)
+    .get(COLLECTION_SELECTORS.nameInput)
+    .clearAndType(name);
+  return saveCollection("CollectionUpdate");
 }
 
 export function assignProductsToCollection(productName) {