djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Saleor 5021 add tests for customers (#1688) (#1733)

Browse source 
* customers

* all tests for customers

* change data-test attribute name

* add empty lines
This commit is contained in:
Karolina Rakoczy 2022-01-13 11:21:21 +01:00 committed by GitHub
parent df29cf6adf
commit 55492aff9a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 301 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
cypress/elements/customer/customer-details.js
View file

@ -1,6 +1,15 @@
export const CUSTOMER_DETAILS = {
nameInput: '[name="customerFirstName"]',
lastNameInput: '[name="customerLastName"]',
nameInput: '[name="firstName"]',
customerAddressNameInput: '[name="customerFirstName"]',
lastNameInput: '[name="lastName"]',
customerAddressLastNameInput: '[name="customerLastName"]',
emailInput: '[name="email"]',
noteInput: '[name="note"]'
noteInput: '[name="note"]',
activeCheckbox: '[name="isActive"]',
menageAddressesButton: '[data-test-id="manageAddresses"]',
addAddressButton: '[data-test-id="add-address"]',
deleteAddressMenuItem: '[data-test-id="delete-address"]',
setAddressAsDefaultShipping: '[data-test-id="set-default-shipping-address"]',
setAddressAsDefaultBilling: '[data-test-id="set-default-billing-address"]',
editAddressMenuitem: '[data-test-id="edit-address"]'
};

2
cypress/elements/shared/button-selectors.js
View file

@ -1,6 +1,6 @@
export const BUTTON_SELECTORS = {
back: '[data-test-id="app-header-back-button"]',
submit: '[data-test="submit"]',
submit: '[data-test="submit"], [data-test-id="submit"]',
confirm: '[data-test="button-bar-confirm"]',
goBackButton: "[data-test-id='app-header-back-button']",
checkbox: "[type='checkbox']",

12
cypress/fixtures/addresses.json
View file

@ -30,13 +30,13 @@
"secondUsAddress": {
"firstName": "test",
"lastName": "test",
"companyName": "Test2",
"streetAddress1": "Antonio Ridge",
"streetAddress2": "34930",
"city": "North Patrickfort",
"postalCode": "70958",
"companyName": "Test1",
"streetAddress1": "Rock Quarry Rd",
"streetAddress2": "345",
"city": "Afton",
"postalCode": "37745",
"country": "US",
"countryArea": "LA",
"countryArea": "TN",
"phone": "+12025550169",
"currency": "USD",
"countryFullName": "United States of America"

224
cypress/integration/configuration/customer.js
View file

@ -7,39 +7,52 @@ import { CUSTOMER_DETAILS } from "../../elements/customer/customer-details";
import { CUSTOMERS_LIST } from "../../elements/customer/customers-list";
import { BUTTON_SELECTORS } from "../../elements/shared/button-selectors";
import { SHARED_ELEMENTS } from "../../elements/shared/sharedElements";
import { urlList } from "../../fixtures/urlList";
import { customerDetailsUrl, urlList } from "../../fixtures/urlList";
import { ONE_PERMISSION_USERS } from "../../fixtures/users";
import { getCustomer } from "../../support/api/requests/Customer";
import {
addressCreate,
createCustomer,
deleteCustomersStartsWith,
getCustomer
} from "../../support/api/requests/Customer";
import filterTests from "../../support/filterTests";
filterTests({ definedTags: ["all"] }, () => {
describe("Tests for customer", () => {
const channelStartsWith = `Customers`;
const startsWith = `Customers`;
let address;
let secondAddress;
before(() => {
cy.clearSessionData().loginUserViaRequest();
deleteCustomersStartsWith(startsWith);
cy.fixture("addresses").then(({ usAddress, secondUsAddress }) => {
address = usAddress;
secondAddress = secondUsAddress;
});
});
beforeEach(() => {
cy.clearSessionData().loginUserViaRequest();
});
it("should create customer", () => {
const randomName = `${channelStartsWith}${faker.datatype.number()}`;
const randomName = `${startsWith}${faker.datatype.number()}`;
const email = `${randomName}@example.com`;
const note = faker.lorem.paragraph();
let address;
cy.clearSessionData()
.loginUserViaRequest("auth", ONE_PERMISSION_USERS.user)
.visit(urlList.customers)
cy.visit(urlList.customers)
.get(CUSTOMERS_LIST.createCustomerButton)
.click()
.get(SHARED_ELEMENTS.progressBar)
.should("not.be.visible")
.get(CUSTOMER_DETAILS.nameInput)
.get(CUSTOMER_DETAILS.customerAddressNameInput)
.type(randomName)
.get(CUSTOMER_DETAILS.lastNameInput)
.get(CUSTOMER_DETAILS.customerAddressLastNameInput)
.type(randomName)
.get(CUSTOMER_DETAILS.emailInput)
.type(email)
.fixture("addresses")
.then(({ usAddress }) => {
address = usAddress;
cy.fillUpAddressForm(address);
})
.fillUpAddressForm(address)
.get(CUSTOMER_DETAILS.noteInput)
.type(note)
.addAliasToGraphRequest("CreateCustomer")
@ -63,5 +76,186 @@ filterTests({ definedTags: ["all"] }, () => {
cy.expectCorrectFullAddress(customer.addresses[0], address);
});
});
it("should add address to customer", () => {
const randomName = `${startsWith}${faker.datatype.number()}`;
const email = `${randomName}@example.com`;
createCustomer(email, randomName).then(({ user }) => {
cy.visit(customerDetailsUrl(user.id))
.get(CUSTOMER_DETAILS.menageAddressesButton)
.click()
.get(CUSTOMER_DETAILS.addAddressButton)
.click()
.addAliasToGraphRequest("CreateCustomerAddress")
.fillUpAddressFormAndSubmit(secondAddress)
.waitForRequestAndCheckIfNoErrors("@CreateCustomerAddress");
getCustomer(user.id).then(({ addresses }) => {
expect(addresses).to.have.length(1);
cy.expectCorrectFullAddress(addresses[0], secondAddress);
});
});
});
it("should remove address from customer", () => {
const randomName = `${startsWith}${faker.datatype.number()}`;
const email = `${randomName}@example.com`;
createCustomer(email, randomName, address).then(({ user }) => {
cy.visit(customerDetailsUrl(user.id))
.get(CUSTOMER_DETAILS.menageAddressesButton)
.click()
.waitForProgressBarToNotExist()
.get(BUTTON_SELECTORS.showMoreButton)
.should("be.enabled")
.first()
.click()
.get(CUSTOMER_DETAILS.deleteAddressMenuItem)
.click()
.addAliasToGraphRequest("RemoveCustomerAddress")
.get(BUTTON_SELECTORS.submit)
.click()
.waitForRequestAndCheckIfNoErrors("@RemoveCustomerAddress");
getCustomer(user.id).then(({ addresses }) => {
expect(addresses).to.have.length(1);
});
});
});
it("should set address as default", () => {
const randomName = `${startsWith}${faker.datatype.number()}`;
const email = `${randomName}@example.com`;
let user;
createCustomer(email, randomName)
.then(({ user: userResp }) => {
user = userResp;
addressCreate(user.id, address);
})
.then(() => {
cy.visit(customerDetailsUrl(user.id))
.get(CUSTOMER_DETAILS.menageAddressesButton)
.click()
.waitForProgressBarToNotExist()
.get(BUTTON_SELECTORS.showMoreButton)
.should("be.enabled")
.click()
.addAliasToGraphRequest("SetCustomerDefaultAddress")
.get(CUSTOMER_DETAILS.setAddressAsDefaultShipping)
.click()
.wait("@SetCustomerDefaultAddress");
getCustomer(user.id);
})
.then(({ addresses }) => {
chai.softExpect(addresses[0].isDefaultShippingAddress).to.eq(true);
cy.get(BUTTON_SELECTORS.showMoreButton)
.should("be.enabled")
.click()
.addAliasToGraphRequest("SetCustomerDefaultAddress")
.get(CUSTOMER_DETAILS.setAddressAsDefaultBilling)
.click()
.wait("@SetCustomerDefaultAddress");
getCustomer(user.id);
})
.then(({ addresses }) => {
expect(addresses[0].isDefaultBillingAddress).to.be.true;
});
});
it("should update address", () => {
const randomName = `${startsWith}${faker.datatype.number()}`;
const email = `${randomName}@example.com`;
createCustomer(email, randomName, address).then(({ user }) => {
cy.visit(customerDetailsUrl(user.id))
.get(CUSTOMER_DETAILS.menageAddressesButton)
.click()
.get(BUTTON_SELECTORS.showMoreButton)
.should("be.enabled")
.first()
.click()
.get(CUSTOMER_DETAILS.editAddressMenuitem)
.click()
.addAliasToGraphRequest("UpdateCustomerAddress")
.fillUpAddressFormAndSubmit(secondAddress)
.waitForRequestAndCheckIfNoErrors("@UpdateCustomerAddress");
getCustomer(user.id).then(({ addresses }) => {
expect(addresses).to.have.length(2);
const addedAddress = addresses.find(
element =>
element.city.toUpperCase() === secondAddress.city.toUpperCase()
);
cy.expectCorrectFullAddress(addedAddress, secondAddress);
});
});
});
it("should delete customer", () => {
const randomName = `${startsWith}${faker.datatype.number()}`;
const email = `${randomName}@example.com`;
createCustomer(email, randomName, address).then(({ user }) => {
cy.visit(customerDetailsUrl(user.id))
.get(BUTTON_SELECTORS.deleteButton)
.click()
.addAliasToGraphRequest("RemoveCustomer")
.get(BUTTON_SELECTORS.submit)
.click()
.wait("@RemoveCustomer");
getCustomer(user.id).should("be.null");
});
});
it("should deactivate customer", () => {
const randomName = `${startsWith}${faker.datatype.number()}`;
const email = `${randomName}@example.com`;
createCustomer(email, randomName, address, true).then(({ user }) => {
cy.visit(customerDetailsUrl(user.id))
.get(CUSTOMER_DETAILS.activeCheckbox)
.click()
.addAliasToGraphRequest("UpdateCustomer")
.get(BUTTON_SELECTORS.confirm)
.click()
.wait("@UpdateCustomer");
getCustomer(user.id).then(({ isActive }) => {
expect(isActive).to.be.false;
});
});
});
it("should update customer", () => {
const randomName = `${startsWith}${faker.datatype.number()}`;
const updatedName = `${startsWith}UpdatedName`;
const email = `${randomName}@example.com`;
createCustomer(email, randomName, address, true).then(({ user }) => {
cy.visit(customerDetailsUrl(user.id))
.get(CUSTOMER_DETAILS.nameInput)
.clearAndType(updatedName)
.get(CUSTOMER_DETAILS.lastNameInput)
.clearAndType(updatedName)
.get(CUSTOMER_DETAILS.noteInput)
.clearAndType(updatedName)
.get(CUSTOMER_DETAILS.emailInput)
.clearAndType(`${updatedName}@example.com`)
.addAliasToGraphRequest("UpdateCustomer")
.get(BUTTON_SELECTORS.confirm)
.click()
.wait("@UpdateCustomer");
getCustomer(user.id).then(user => {
chai
.softExpect(user.firstName, "Expect correct first name")
.to.eq(updatedName);
chai
.softExpect(user.lastName, "Expect correct last name")
.to.eq(updatedName);
chai
.softExpect(user.email, "Expect correct email")
.to.eq(`${updatedName}@example.com`);
chai.softExpect(user.note, "Expect correct note").to.eq(updatedName);
});
});
});
});
});

32
cypress/support/api/requests/Customer.js
View file

@ -1,6 +1,15 @@
import { getDefaultAddress } from "./utils/Utils";
import {
getDefaultAddress,
getDefaultAddressWithoutType,
getValueWithDefault
} from "./utils/Utils";
export function createCustomer(email, customerName, address, isActive = false) {
const addressesLines = getValueWithDefault(
address,
`${getDefaultAddress(address, "defaultBillingAddress")}
${getDefaultAddress(address, "defaultShippingAddress")}`
);
const mutation = `
mutation{
customerCreate(input:{
@ -8,8 +17,7 @@ export function createCustomer(email, customerName, address, isActive = false) {
lastName: "${customerName}"
email: "${email}"
isActive: ${isActive}
${getDefaultAddress(address, "defaultBillingAddress")}
${getDefaultAddress(address, "defaultShippingAddress")}
${addressesLines}
}){
user{
id
@ -21,7 +29,7 @@ export function createCustomer(email, customerName, address, isActive = false) {
}
}
}`;
return cy.sendRequestWithQuery(mutation);
return cy.sendRequestWithQuery(mutation).its("body.data.customerCreate");
}
export function deleteCustomersStartsWith(startsWith) {
@ -143,8 +151,24 @@ export function getCustomer(customerId) {
}
countryArea
phone
isDefaultShippingAddress
isDefaultBillingAddress
}
}
}`;
return cy.sendRequestWithQuery(query).its("body.data.user");
}
export function addressCreate(userId, address) {
const mutation = `mutation{
addressCreate(userId:"${userId}" input:{
${getDefaultAddressWithoutType(address)}
}){
errors{
field
message
}
}
}`;
return cy.sendRequestWithQuery(mutation);
}

16
cypress/support/api/requests/utils/Utils.js
View file

@ -27,6 +27,22 @@ export function getVariantsLines(variantsList, quantity) {
);
}
export function getDefaultAddressWithoutType(address, withName = true) {
const defaultAddress = `city: "${address.city}"
country: ${address.country}
countryArea: "${address.countryArea}"
phone: "${address.phone}"
postalCode: "${address.postalCode}"
streetAddress1: "${address.streetAddress1}"
streetAddress2: "${address.streetAddress2}"`;
if (withName) {
defaultAddress.concat(`firstName: "Test"
lastName: "Test"
companyName: "${address.companyName}"`);
}
return defaultAddress;
}
export function getVariantsIdsLines(variantsList) {
return variantsList.map(variant => `${variant.id}`);
}

4
cypress/support/customCommands/softAssertions/index.js
View file

@ -98,8 +98,8 @@ Cypress.Commands.add(
"expectCorrectBasicAddress",
(responseAddress, expectedAddress) => {
chai
.softExpect(responseAddress)
.to.have.property("city", expectedAddress.city.toUpperCase());
.softExpect(responseAddress.city.toUpperCase())
.to.eq(expectedAddress.city.toUpperCase());
chai
.softExpect(responseAddress)
.to.have.property("countryArea", expectedAddress.countryArea);

12
src/customers/components/CustomerAddress/CustomerAddress.tsx
View file

@ -106,19 +106,23 @@ const CustomerAddress: React.FC<CustomerAddressProps> = props => {
menuItems={[
{
label: intl.formatMessage(messages.setDefaultShipping),
onSelect: () => onSetAsDefault(AddressTypeEnum.SHIPPING)
onSelect: () => onSetAsDefault(AddressTypeEnum.SHIPPING),
testId: "set-default-shipping-address"
},
{
label: intl.formatMessage(messages.setDefaultBilling),
onSelect: () => onSetAsDefault(AddressTypeEnum.BILLING)
onSelect: () => onSetAsDefault(AddressTypeEnum.BILLING),
testId: "set-default-billing-address"
},
{
label: intl.formatMessage(messages.editAddress),
onSelect: () => onEdit()
onSelect: () => onEdit(),
testId: "edit-address"
},
{
label: intl.formatMessage(messages.deleteAddress),
onSelect: () => onRemove()
onSelect: () => onRemove(),
testId: "delete-address"
}
]}
/>

1
src/customers/components/CustomerAddressDialog/CustomerAddressDialog.tsx
View file

@ -135,6 +135,7 @@ const CustomerAddressDialog: React.FC<CustomerAddressDialogProps> = ({
color="primary"
variant="contained"
type="submit"
data-test-id="submit"
>
<FormattedMessage {...buttonMessages.save} />
</ConfirmButton>

7
src/customers/components/CustomerAddressListPage/CustomerAddressListPage.tsx
View file

@ -110,7 +110,12 @@ const CustomerAddressListPage: React.FC<CustomerAddressListPageProps> = props =>
: intl.formatMessage(messages.noNameToShow)
}
>
<Button color="primary" variant="contained" onClick={onAdd}>
<Button
color="primary"
variant="contained"
onClick={onAdd}
data-test-id="add-address"
>
{intl.formatMessage(messages.addAddress)}
</Button>
</PageHeader>

1
src/customers/components/CustomerAddresses/CustomerAddresses.tsx
View file

@ -41,6 +41,7 @@ const CustomerAddresses: React.FC<CustomerAddressesProps> = props => {
})}
toolbar={
<Button
data-test-id="manageAddresses"
color="primary"
disabled={disabled}
variant="text"

11
src/storybook/__snapshots__/Stories.test.ts.snap
View file

@ -63615,6 +63615,7 @@ exports[`Storyshots Views / Customers / Address Book default 1`] = `
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-contained-id MuiButton-containedPrimary-id"
data-test-id="add-address"
tabindex="0"
type="button"
>
@ -63820,6 +63821,7 @@ exports[`Storyshots Views / Customers / Address Book loading 1`] = `
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-contained-id MuiButton-containedPrimary-id"
data-test-id="add-address"
tabindex="0"
type="button"
>
@ -66645,6 +66647,7 @@ exports[`Storyshots Views / Customers / Customer details default 1`] = `
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
data-test-id="manageAddresses"
tabindex="0"
type="button"
>
@ -67336,6 +67339,7 @@ exports[`Storyshots Views / Customers / Customer details different addresses 1`]
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
data-test-id="manageAddresses"
tabindex="0"
type="button"
>
@ -68082,6 +68086,7 @@ exports[`Storyshots Views / Customers / Customer details form errors 1`] = `
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
data-test-id="manageAddresses"
tabindex="0"
type="button"
>
@ -68728,6 +68733,7 @@ exports[`Storyshots Views / Customers / Customer details loading 1`] = `
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id MuiButton-disabled-id MuiButtonBase-disabled-id"
data-test-id="manageAddresses"
disabled=""
tabindex="-1"
type="button"
@ -69388,6 +69394,7 @@ exports[`Storyshots Views / Customers / Customer details never logged 1`] = `
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
data-test-id="manageAddresses"
tabindex="0"
type="button"
>
@ -70073,6 +70080,7 @@ exports[`Storyshots Views / Customers / Customer details never placed order 1`]
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
data-test-id="manageAddresses"
tabindex="0"
type="button"
>
@ -70758,6 +70766,7 @@ exports[`Storyshots Views / Customers / Customer details no address at all 1`] =
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
data-test-id="manageAddresses"
tabindex="0"
type="button"
>
@ -71421,6 +71430,7 @@ exports[`Storyshots Views / Customers / Customer details no default billing addr
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
data-test-id="manageAddresses"
tabindex="0"
type="button"
>
@ -72112,6 +72122,7 @@ exports[`Storyshots Views / Customers / Customer details no default shipping add
>
<button
class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
data-test-id="manageAddresses"
tabindex="0"
type="button"
>