diff --git a/cypress/apiRequests/giftCards.js b/cypress/apiRequests/giftCards.js
new file mode 100644
index 000000000..188c90439
--- /dev/null
+++ b/cypress/apiRequests/giftCards.js
@@ -0,0 +1,31 @@
+export function getGiftCardWithTag(tag) {
+ return getGiftCardsWithTag(1, tag)
+ .its("body.data.giftCards.edges")
+ .its(0)
+ .its("node");
+}
+
+export function getGiftCardsWithTag(first, tag) {
+ const query = `query{
+ giftCards(first: ${first}, filter: { tag: "${tag}"}){
+ edges{
+ node{
+ id
+ code
+ isActive
+ expiryType
+ expiryDate
+ expiryPeriod{
+ amount
+ type
+ }
+ initialBalance{
+ currency
+ amount
+ }
+ }
+ }
+ }
+ }`;
+ return cy.sendRequestWithQuery(query);
+}
diff --git a/cypress/elements/giftCard/giftCardDialog.js b/cypress/elements/giftCard/giftCardDialog.js
new file mode 100644
index 000000000..095ef76ae
--- /dev/null
+++ b/cypress/elements/giftCard/giftCardDialog.js
@@ -0,0 +1,17 @@
+export const GIFT_CARD_DIALOG = {
+ amountInput: '[name="balanceAmount"]',
+ currencySelectButton: '[id="mui-component-select-balanceCurrency"]',
+ currenciesOptions: '[data-test="selectFieldOption"]',
+ expirationOptions: {
+ neverExpireRadioButton: '[value="NEVER_EXPIRE"]',
+ expiryPeriodRadioButton: '[value="EXPIRY_PERIOD"]',
+ expiryDateRadioButton: '[value="EXPIRY_DATE"]',
+ expiryPeriodAmount: '[name="expiryPeriodAmount"]',
+ expiryPeriodTypeButton: '[id*="select-expiryPeriodType"]',
+ expiryPeriodMonthType: '[data-test-id="MONTH"]',
+ expiryDateInput: '[name="expiryDate"]'
+ },
+ noteInput: '[name="note"]',
+ cardCodeText: '[data-test-id="cardCode"]',
+ tagInput: '[data-test-id="gift-card-tag-select-field"]'
+};
diff --git a/cypress/elements/giftCard/giftCardList.js b/cypress/elements/giftCard/giftCardList.js
new file mode 100644
index 000000000..16a2ece5e
--- /dev/null
+++ b/cypress/elements/giftCard/giftCardList.js
@@ -0,0 +1,3 @@
+export const GIFT_CARD_LIST = {
+ issueCardButton: '[data-test-id="issueCardButton"]'
+};
diff --git a/cypress/integration/giftCards.js b/cypress/integration/giftCards.js
new file mode 100644
index 000000000..3a9c5ff48
--- /dev/null
+++ b/cypress/integration/giftCards.js
@@ -0,0 +1,103 @@
+//
+import faker from "faker";
+
+import { getGiftCardWithTag } from "../apiRequests/giftCards";
+import {
+ expiryPeriods,
+ openAndFillUpCreateGiftCardDialog,
+ saveGiftCard,
+ setExpiryDate,
+ setExpiryPeriod,
+ setNeverExpire
+} from "../steps/giftCardSteps";
+import filterTests from "../support/filterTests";
+import { formatDate } from "../support/format/formatDate";
+
+filterTests(["all"], () => {
+ describe("Tests for gift cards", () => {
+ const startsWith = "GiftCards";
+ const amount = 50;
+ const currency = "USD";
+
+ before(() => {
+ cy.clearSessionData().loginUserViaRequest();
+ });
+
+ beforeEach(() => {
+ cy.clearSessionData().loginUserViaRequest();
+ });
+
+ it("should create never expire gift card", () => {
+ const name = `${startsWith}${faker.datatype.number()}`;
+ let giftCardCode;
+
+ openAndFillUpCreateGiftCardDialog({
+ note: name,
+ tag: name,
+ amount,
+ currency
+ });
+ setNeverExpire();
+ saveGiftCard()
+ .then(createdGiftCardCode => {
+ giftCardCode = createdGiftCardCode;
+ getGiftCardWithTag(name);
+ })
+ .then(giftCard => {
+ expect(giftCard.code).to.eq(giftCardCode);
+ expect(giftCard.initialBalance.amount).to.eq(amount);
+ expect(giftCard.initialBalance.currency).to.eq(currency);
+ });
+ });
+
+ it("should create gift card with two moths expiry", () => {
+ const name = `${startsWith}${faker.datatype.number()}`;
+ let giftCardCode;
+
+ openAndFillUpCreateGiftCardDialog({
+ note: name,
+ tag: name,
+ amount,
+ currency
+ });
+ setExpiryPeriod(2, expiryPeriods.MONTH);
+ saveGiftCard()
+ .then(createdGiftCardCode => {
+ giftCardCode = createdGiftCardCode;
+ getGiftCardWithTag(name);
+ })
+ .then(giftCard => {
+ expect(giftCard.code).to.eq(giftCardCode);
+ expect(giftCard.initialBalance.amount).to.eq(amount);
+ expect(giftCard.initialBalance.currency).to.eq(currency);
+ expect(giftCard.expiryPeriod.amount).to.eq(2);
+ expect(giftCard.expiryPeriod.type).to.eq("MONTH");
+ });
+ });
+
+ it("should create gift card with date expiry", () => {
+ const name = `${startsWith}${faker.datatype.number()}`;
+ let giftCardCode;
+ const date = formatDate(new Date(new Date().getFullYear() + 2, 1, 1));
+
+ openAndFillUpCreateGiftCardDialog({
+ note: name,
+ tag: name,
+ amount,
+ currency
+ });
+ setExpiryDate(date);
+ saveGiftCard()
+ .then(createdGiftCardCode => {
+ giftCardCode = createdGiftCardCode;
+ getGiftCardWithTag(name);
+ })
+ .then(giftCard => {
+ expect(giftCard.code).to.eq(giftCardCode);
+ expect(giftCard.initialBalance.amount).to.eq(amount);
+ expect(giftCard.initialBalance.currency).to.eq(currency);
+ expect(giftCard.expiryDate).to.eq(date);
+ });
+ });
+ });
+});
diff --git a/cypress/steps/giftCardSteps.js b/cypress/steps/giftCardSteps.js
new file mode 100644
index 000000000..0a1fa8363
--- /dev/null
+++ b/cypress/steps/giftCardSteps.js
@@ -0,0 +1,63 @@
+import { GIFT_CARD_DIALOG } from "../elements/giftCard/giftCardDialog";
+import { GIFT_CARD_LIST } from "../elements/giftCard/giftCardList";
+import { BUTTON_SELECTORS } from "../elements/shared/button-selectors";
+import { urlList } from "../url/urlList";
+import { createNewOption } from "./shared/selects";
+
+export function openAndFillUpCreateGiftCardDialog({
+ note,
+ tag,
+ amount,
+ currency
+}) {
+ cy.visit(urlList.giftCards)
+ .get(GIFT_CARD_LIST.issueCardButton)
+ .click()
+ .get(GIFT_CARD_DIALOG.currencySelectButton)
+ .click();
+ cy.contains(GIFT_CARD_DIALOG.currenciesOptions, currency)
+ .click()
+ .get(GIFT_CARD_DIALOG.amountInput)
+ .clearAndType(amount);
+ createNewOption(GIFT_CARD_DIALOG.tagInput, tag);
+ cy.get(GIFT_CARD_DIALOG.noteInput).type(note);
+}
+
+export function saveGiftCard() {
+ return cy
+ .get(BUTTON_SELECTORS.submit)
+ .click()
+ .get(GIFT_CARD_DIALOG.cardCodeText)
+ .invoke("text")
+ .then(text => {
+ const giftCardCode = text;
+ cy.get(BUTTON_SELECTORS.submit).click();
+ return cy.wrap(giftCardCode);
+ });
+}
+
+export function setNeverExpire() {
+ cy.get(GIFT_CARD_DIALOG.expirationOptions.neverExpireRadioButton).click();
+}
+
+export const expiryPeriods = {
+ MONTH: GIFT_CARD_DIALOG.expirationOptions.expiryPeriodMonthType
+};
+
+export function setExpiryPeriod(amount, period) {
+ cy.get(GIFT_CARD_DIALOG.expirationOptions.expiryPeriodRadioButton)
+ .click()
+ .get(GIFT_CARD_DIALOG.expirationOptions.expiryPeriodAmount)
+ .clearAndType(amount)
+ .get(GIFT_CARD_DIALOG.expirationOptions.expiryPeriodTypeButton)
+ .click()
+ .get(period)
+ .click();
+}
+
+export function setExpiryDate(date) {
+ cy.get(GIFT_CARD_DIALOG.expirationOptions.expiryDateRadioButton)
+ .click()
+ .get(GIFT_CARD_DIALOG.expirationOptions.expiryDateInput)
+ .type(date);
+}
diff --git a/cypress/steps/shared/selects.js b/cypress/steps/shared/selects.js
index 4c1c5cfb4..2c7a1e35e 100644
--- a/cypress/steps/shared/selects.js
+++ b/cypress/steps/shared/selects.js
@@ -28,3 +28,10 @@ export function fillBaseSelect(selectSelector, value) {
.get(selectorWithDataValue(value))
.click();
}
+
+export function createNewOption(selectSelector, newOption) {
+ cy.get(selectSelector).type(newOption);
+ cy.contains(BUTTON_SELECTORS.selectOption, newOption)
+ .should("be.visible")
+ .click();
+}
diff --git a/cypress/url/urlList.js b/cypress/url/urlList.js
index ad57d8fcd..d820d57ec 100644
--- a/cypress/url/urlList.js
+++ b/cypress/url/urlList.js
@@ -9,6 +9,7 @@ export const urlList = {
configuration: "configuration/",
customers: "customers/",
draftOrders: "orders/drafts/",
+ giftCards: "gift-cards/",
homePage: "/",
newPassword: "new-password/",
navigation: "navigation/",
diff --git a/src/giftCards/GiftCardCreateDialog/GiftCardCreateDialogCodeContent.tsx b/src/giftCards/GiftCardCreateDialog/GiftCardCreateDialogCodeContent.tsx
index a917aa746..54274cfc3 100644
--- a/src/giftCards/GiftCardCreateDialog/GiftCardCreateDialogCodeContent.tsx
+++ b/src/giftCards/GiftCardCreateDialog/GiftCardCreateDialogCodeContent.tsx
@@ -38,7 +38,7 @@ const GiftCardCreateDialogCodeContent: React.FC
-
+
{cardCode}
@@ -47,7 +47,12 @@ const GiftCardCreateDialogCodeContent: React.FC
-