From 0157914edb816862f91a5f08f7868bdf97e865e9 Mon Sep 17 00:00:00 2001 From: Karolina Date: Mon, 15 Mar 2021 14:16:02 +0100 Subject: [PATCH] Saleor 1740 tests for draft orders (#1002) * first test for draft orders * tests for channels in draft orders * tests for channels in draft orders * tests for channels in draft orders * test for moving draft order to orders * test for orders * test for orders * tests for draft orders * tests for draft orders * tests for draft orders * tests for draft orders * test for moving draft order --- cypress/apiRequests/Customer.js | 2 +- .../elements/orders/draft-order-selectors.js | 9 +- .../orders/draft-orders-list-selectors.js | 3 + cypress/elements/orders/orders-selectors.js | 3 +- .../shipping/select-shipping-method-form.js | 5 + cypress/integration/homePage.js | 7 +- .../orders/channelsInDraftOrders.js | 97 ++++++ cypress/integration/orders/draftOrders.js | 101 ++++++ cypress/steps/channelsSteps.js | 16 + cypress/steps/draftOrderSteps.js | 39 +++ cypress/support/elements/index.js | 3 + cypress/support/index.js | 1 + cypress/url/urlList.js | 1 + .../ExtendedPageHeader/ExtendedPageHeader.tsx | 4 +- src/components/PageHeader/PageHeader.tsx | 1 + .../DraftOrderChannelSectionCard.tsx | 2 +- .../OrderCustomer/OrderCustomer.tsx | 2 + .../OrderDraftDetailsSummary.tsx | 9 +- .../OrderDraftList/OrderDraftList.tsx | 1 + src/orders/components/OrderList/OrderList.tsx | 1 + .../__snapshots__/Stories.test.ts.snap | 293 ++++++++++++++++++ 21 files changed, 592 insertions(+), 8 deletions(-) create mode 100644 cypress/elements/orders/draft-orders-list-selectors.js create mode 100644 cypress/elements/shipping/select-shipping-method-form.js create mode 100644 cypress/integration/orders/channelsInDraftOrders.js create mode 100644 cypress/integration/orders/draftOrders.js create mode 100644 cypress/steps/draftOrderSteps.js create mode 100644 cypress/support/elements/index.js diff --git a/cypress/apiRequests/Customer.js b/cypress/apiRequests/Customer.js index 783c7b47c..11ffc4c36 100644 --- a/cypress/apiRequests/Customer.js +++ b/cypress/apiRequests/Customer.js @@ -38,7 +38,7 @@ export function createCustomer(email, customerName, address, isActive = false) { return cy.sendRequestWithQuery(mutation); } -export function deleteCustomers(startsWith) { +export function deleteCustomersStartsWith(startsWith) { getCustomers(startsWith).then(resp => { if (resp.body.data.customers) { const customers = resp.body.data.customers.edges; diff --git a/cypress/elements/orders/draft-order-selectors.js b/cypress/elements/orders/draft-order-selectors.js index cc98608c3..cfa1bc6c6 100644 --- a/cypress/elements/orders/draft-order-selectors.js +++ b/cypress/elements/orders/draft-order-selectors.js @@ -1,3 +1,10 @@ export const DRAFT_ORDER_SELECTORS = { - addProducts: "[data-test-id='add-products-button']" + addProducts: "[data-test-id='add-products-button']", + salesChannel: "[data-test-id='sales-channel']", + editCustomerButton: "[data-test-id='edit-customer']", + selectCustomer: "[data-test-id='select-customer']", + selectCustomerOption: "[data-test-type='option']", + addShippingCarrierLink: "[data-test-id='add-shipping-carrier']", + finalizeButton: "[data-test='button-bar-confirm']", + pageHeader: "[data-test-id='page-header']" }; diff --git a/cypress/elements/orders/draft-orders-list-selectors.js b/cypress/elements/orders/draft-orders-list-selectors.js new file mode 100644 index 000000000..48f1694ea --- /dev/null +++ b/cypress/elements/orders/draft-orders-list-selectors.js @@ -0,0 +1,3 @@ +export const DRAFT_ORDERS_LIST_SELECTORS = { + draftOrderRow: "[data-test-id='draft-order-table-row']" +}; diff --git a/cypress/elements/orders/orders-selectors.js b/cypress/elements/orders/orders-selectors.js index 5effccb99..bafa5768c 100644 --- a/cypress/elements/orders/orders-selectors.js +++ b/cypress/elements/orders/orders-selectors.js @@ -1,4 +1,5 @@ export const ORDERS_SELECTORS = { orders: "[data-test='submenu-item-label'][data-test-id='orders']", - createOrder: "[data-test-id='create-order-button']" + createOrder: "[data-test-id='create-order-button']", + orderRow: "[data-test-id='order-table-row']" }; diff --git a/cypress/elements/shipping/select-shipping-method-form.js b/cypress/elements/shipping/select-shipping-method-form.js new file mode 100644 index 000000000..4aa93f777 --- /dev/null +++ b/cypress/elements/shipping/select-shipping-method-form.js @@ -0,0 +1,5 @@ +export const SELECT_SHIPPING_METHOD_FORM = { + selectShippingMethod: "[id='mui-component-select-shippingMethod']", + shippingMethodOption: "[data-test='selectFieldOption']", + submitButton: "[type='submit']" +}; diff --git a/cypress/integration/homePage.js b/cypress/integration/homePage.js index f9aadd4ef..73201d050 100644 --- a/cypress/integration/homePage.js +++ b/cypress/integration/homePage.js @@ -1,6 +1,9 @@ import faker from "faker"; -import { createCustomer, deleteCustomers } from "../apiRequests/Customer"; +import { + createCustomer, + deleteCustomersStartsWith +} from "../apiRequests/Customer"; import { HOMEPAGE_SELECTORS } from "../elements/homePage/homePage-selectors"; import { changeChannel } from "../steps/homePageSteps"; import { urlList } from "../url/urlList"; @@ -34,7 +37,7 @@ describe("Homepage analytics", () => { before(() => { cy.clearSessionData().loginUserViaRequest(); productsUtils.deleteProductsStartsWith(startsWith); - deleteCustomers(startsWith); + deleteCustomersStartsWith(startsWith); shippingUtils.deleteShippingStartsWith(startsWith); let addresses; diff --git a/cypress/integration/orders/channelsInDraftOrders.js b/cypress/integration/orders/channelsInDraftOrders.js new file mode 100644 index 000000000..cbeb76dc1 --- /dev/null +++ b/cypress/integration/orders/channelsInDraftOrders.js @@ -0,0 +1,97 @@ +// +import faker from "faker"; + +import { CHANNEL_FORM_SELECTORS } from "../../elements/channels/channel-form-selectors"; +import { HEADER_SELECTORS } from "../../elements/header/header-selectors"; +import { DRAFT_ORDER_SELECTORS } from "../../elements/orders/draft-order-selectors"; +import { ORDERS_SELECTORS } from "../../elements/orders/orders-selectors"; +import { + selectChannelInHeader, + selectChannelInPicker +} from "../../steps/channelsSteps"; +import { urlList } from "../../url/urlList"; +import * as channelsUtils from "../../utils/channelsUtils"; + +describe("Channels in draft orders", () => { + const startsWith = "Cy-"; + const randomName = startsWith + faker.random.number(); + + let defaultChannel; + let otherChannel; + + before(() => { + cy.clearSessionData().loginUserViaRequest(); + channelsUtils.deleteChannelsStartsWith(startsWith); + channelsUtils + .getDefaultChannel() + .then(channel => { + defaultChannel = channel; + channelsUtils.createChannel({ name: randomName }); + }) + .then(channelResp => { + otherChannel = channelResp; + }); + }); + + beforeEach(() => { + cy.clearSessionData().loginUserViaRequest(); + }); + + it("Draft order channel should be taken from global channel picker", () => { + let channelName; + cy.visit(urlList.homePage); + cy.getTextFromElement(HEADER_SELECTORS.channelSelect).then( + channelInHeader => { + channelName = channelInHeader; + } + ); + cy.visit(urlList.orders) + .get(ORDERS_SELECTORS.createOrder) + .click(); + cy.getTextFromElement(CHANNEL_FORM_SELECTORS.channelSelect).then( + selectedChannelName => { + expect(channelName).to.contains(selectedChannelName); + } + ); + cy.get(CHANNEL_FORM_SELECTORS.confirmButton).click(); + cy.getTextFromElement(DRAFT_ORDER_SELECTORS.salesChannel).then( + channelNameInDraftOrder => { + expect(channelName).to.contains(channelNameInDraftOrder); + } + ); + }); + it("Draft order channel should be taken from global channel picker when changed", () => { + cy.visit(urlList.homePage); + selectChannelInHeader(otherChannel.name); + cy.visit(urlList.orders); + cy.get(ORDERS_SELECTORS.createOrder).click(); + cy.getTextFromElement(CHANNEL_FORM_SELECTORS.channelSelect).then( + channelInSelect => { + expect(channelInSelect).to.be.eq(otherChannel.name); + } + ); + cy.get(CHANNEL_FORM_SELECTORS.confirmButton).click(); + cy.getTextFromElement(DRAFT_ORDER_SELECTORS.salesChannel).then( + channelInDraftOrder => { + expect(channelInDraftOrder).to.be.eq(otherChannel.name); + } + ); + }); + it("should create draft order with chosen channel", () => { + cy.visit(urlList.homePage); + selectChannelInHeader(defaultChannel.name); + cy.visit(urlList.orders); + cy.get(ORDERS_SELECTORS.createOrder).click(); + cy.getTextFromElement(CHANNEL_FORM_SELECTORS.channelSelect).then( + channelInSelect => { + expect(channelInSelect).to.be.eq(defaultChannel.name); + } + ); + selectChannelInPicker(otherChannel.name); + cy.getTextFromElement(DRAFT_ORDER_SELECTORS.salesChannel).then( + channelInDraftOrder => { + expect(channelInDraftOrder).to.be.eq(otherChannel.name); + } + ); + }); +}); diff --git a/cypress/integration/orders/draftOrders.js b/cypress/integration/orders/draftOrders.js new file mode 100644 index 000000000..68ee36872 --- /dev/null +++ b/cypress/integration/orders/draftOrders.js @@ -0,0 +1,101 @@ +// +import faker from "faker"; + +import { + createCustomer, + deleteCustomersStartsWith +} from "../../apiRequests/Customer"; +import { DRAFT_ORDERS_LIST_SELECTORS } from "../../elements/orders/draft-orders-list-selectors"; +import { ORDERS_SELECTORS } from "../../elements/orders/orders-selectors"; +import { selectChannelInPicker } from "../../steps/channelsSteps"; +import { finalizeDraftOrder } from "../../steps/draftOrderSteps"; +import { urlList } from "../../url/urlList"; +import { getDefaultChannel } from "../../utils/channelsUtils"; +import * as productsUtils from "../../utils/productsUtils"; +import { + createShipping, + deleteShippingStartsWith +} from "../../utils/shippingUtils"; + +describe("Draft orders", () => { + const startsWith = "Cy-"; + const randomName = startsWith + faker.random.number(); + + let defaultChannel; + let warehouse; + + before(() => { + cy.clearSessionData().loginUserViaRequest(); + deleteCustomersStartsWith(startsWith); + deleteShippingStartsWith(startsWith); + productsUtils.deleteProductsStartsWith(startsWith); + + getDefaultChannel() + .then(channel => { + defaultChannel = channel; + }) + .then(() => { + cy.fixture("addresses"); + }) + .then(addresses => { + createCustomer( + `${randomName}@example.com`, + randomName, + addresses.plAddress, + true + ); + createShipping({ + channelId: defaultChannel.id, + name: randomName, + address: addresses.plAddress + }); + }) + .then(({ warehouse: warehouseResp }) => { + warehouse = warehouseResp; + productsUtils.createTypeAttributeAndCategoryForProduct(randomName); + }) + .then( + ({ + productType: productTypeResp, + attribute: attributeResp, + category: categoryResp + }) => { + productsUtils.createProductInChannel({ + name: randomName, + channelId: defaultChannel.id, + warehouseId: warehouse.id, + productTypeId: productTypeResp.id, + attributeId: attributeResp.id, + categoryId: categoryResp.id + }); + } + ); + }); + + beforeEach(() => { + cy.clearSessionData().loginUserViaRequest(); + }); + + it("should move draft order to orders", () => { + cy.visit(urlList.orders) + .get(ORDERS_SELECTORS.createOrder) + .click(); + selectChannelInPicker(defaultChannel.name); + finalizeDraftOrder(randomName).then(draftOrderNumber => { + cy.visit(urlList.orders); + cy.contains(ORDERS_SELECTORS.orderRow, draftOrderNumber).should( + $order => { + /* eslint-disable no-unused-expressions */ + expect($order).to.be.visible; + } + ); + cy.visit(urlList.draftOrders); + cy.contains( + DRAFT_ORDERS_LIST_SELECTORS.draftOrderRow, + draftOrderNumber + ).should($draftOrder => { + expect($draftOrder).to.not.exist; + }); + }); + }); +}); diff --git a/cypress/steps/channelsSteps.js b/cypress/steps/channelsSteps.js index 0c79c56bd..ec26e3834 100644 --- a/cypress/steps/channelsSteps.js +++ b/cypress/steps/channelsSteps.js @@ -1,5 +1,7 @@ import { ADD_CHANNEL_FORM_SELECTORS } from "../elements/channels/add-channel-form-selectors"; +import { CHANNEL_FORM_SELECTORS } from "../elements/channels/channel-form-selectors"; import { CHANNELS_SELECTORS } from "../elements/channels/channels-selectors"; +import { HEADER_SELECTORS } from "../elements/header/header-selectors"; export function createChannelByView(name, currency, slug = name) { cy.get(CHANNELS_SELECTORS.createChannelButton) @@ -20,3 +22,17 @@ export function createChannelByView(name, currency, slug = name) { }); cy.get(ADD_CHANNEL_FORM_SELECTORS.saveButton).click(); } +export function selectChannelInPicker(channelName) { + cy.get(CHANNEL_FORM_SELECTORS.channelSelect).click(); + cy.contains(CHANNEL_FORM_SELECTORS.channelOption, channelName) + .click() + .get(CHANNEL_FORM_SELECTORS.confirmButton) + .click(); +} +export function selectChannelInHeader(channelName) { + cy.get(HEADER_SELECTORS.channelSelect) + .click() + .get(HEADER_SELECTORS.channelSelectList) + .contains(channelName) + .click(); +} diff --git a/cypress/steps/draftOrderSteps.js b/cypress/steps/draftOrderSteps.js new file mode 100644 index 000000000..bce9746a6 --- /dev/null +++ b/cypress/steps/draftOrderSteps.js @@ -0,0 +1,39 @@ +import { ASSIGN_PRODUCTS_SELECTORS } from "../elements/catalog/products/assign-products-selectors"; +import { DRAFT_ORDER_SELECTORS } from "../elements/orders/draft-order-selectors"; +import { SELECT_SHIPPING_METHOD_FORM } from "../elements/shipping/select-shipping-method-form"; + +export function finalizeDraftOrder(name) { + cy.get(DRAFT_ORDER_SELECTORS.addProducts) + .click() + .get(ASSIGN_PRODUCTS_SELECTORS.searchInput) + .type(name); + cy.contains(ASSIGN_PRODUCTS_SELECTORS.tableRow, name) + .find(ASSIGN_PRODUCTS_SELECTORS.checkbox) + .click() + .get(ASSIGN_PRODUCTS_SELECTORS.submitButton) + .click() + .get(DRAFT_ORDER_SELECTORS.editCustomerButton) + .click() + .get(DRAFT_ORDER_SELECTORS.selectCustomer) + .type(name); + cy.contains(DRAFT_ORDER_SELECTORS.selectCustomerOption, name) + .click() + .get(DRAFT_ORDER_SELECTORS.addShippingCarrierLink) + .click() + .get(SELECT_SHIPPING_METHOD_FORM.selectShippingMethod) + .click() + .get(SELECT_SHIPPING_METHOD_FORM.shippingMethodOption) + .first() + .click(); + cy.addAliasToGraphRequest("OrderShippingMethodUpdate") + .get(SELECT_SHIPPING_METHOD_FORM.submitButton) + .click(); + cy.wait("@OrderShippingMethodUpdate"); + cy.getTextFromElement(DRAFT_ORDER_SELECTORS.pageHeader).as( + "draftOrderNumber" + ); + cy.addAliasToGraphRequest("OrderDraftFinalize"); + cy.get(DRAFT_ORDER_SELECTORS.finalizeButton).click(); + cy.wait("@OrderDraftFinalize"); + return cy.get("@draftOrderNumber"); +} diff --git a/cypress/support/elements/index.js b/cypress/support/elements/index.js new file mode 100644 index 000000000..afb7b4475 --- /dev/null +++ b/cypress/support/elements/index.js @@ -0,0 +1,3 @@ +Cypress.Commands.add("getTextFromElement", element => + cy.get(element).invoke("text") +); diff --git a/cypress/support/index.js b/cypress/support/index.js index fbeac6e3a..e432eddd2 100644 --- a/cypress/support/index.js +++ b/cypress/support/index.js @@ -1,6 +1,7 @@ import "./user"; import "./softAssertions"; import "./deleteElement/index.js"; +import "./elements/index"; import { urlList } from "../url/urlList"; diff --git a/cypress/url/urlList.js b/cypress/url/urlList.js index fdfcc7a85..f91d13c72 100644 --- a/cypress/url/urlList.js +++ b/cypress/url/urlList.js @@ -2,6 +2,7 @@ export const urlList = { apiUri: Cypress.env("API_URI"), channels: "channels/", configuration: "configuration/", + draftOrders: "orders/drafts/", homePage: "/", orders: "orders/", products: "products/", diff --git a/src/components/ExtendedPageHeader/ExtendedPageHeader.tsx b/src/components/ExtendedPageHeader/ExtendedPageHeader.tsx index 8d6815b59..8655c5e73 100644 --- a/src/components/ExtendedPageHeader/ExtendedPageHeader.tsx +++ b/src/components/ExtendedPageHeader/ExtendedPageHeader.tsx @@ -51,15 +51,17 @@ interface ExtendedPageHeaderProps { className?: string; inline?: boolean; title?: React.ReactNode; + testId?: string; } const ExtendedPageHeader: React.FC = props => { - const { children, className, inline, title } = props; + const { children, className, inline, title, testId } = props; const classes = useStyles(props); return (
= props => { return ( - + {!channelName ? : {channelName}} diff --git a/src/orders/components/OrderCustomer/OrderCustomer.tsx b/src/orders/components/OrderCustomer/OrderCustomer.tsx index ddcfe94df..f086bb0f3 100644 --- a/src/orders/components/OrderCustomer/OrderCustomer.tsx +++ b/src/orders/components/OrderCustomer/OrderCustomer.tsx @@ -109,6 +109,7 @@ const OrderCustomer: React.FC = props => { requiredPermissions={[PermissionEnum.MANAGE_USERS]} >