From ea9cc1082d75ea23cc59cf55db4c10b4ba4d1acf Mon Sep 17 00:00:00 2001 From: Andrew Snaith Date: Wed, 27 Oct 2021 07:57:11 -0700 Subject: [PATCH] add ui test coverage for the sharing explainer (#1659) * update nav identifiers * add header button identifiers * add identifiers for sharing explainer * fix mistake in identifiers * add spec file for sharing explainer tests * Apply suggestions from code review Co-authored-by: Thibaut Sardan <33178835+Tbaut@users.noreply.github.com> * Update test spec after pr feedback * lingui extract Co-authored-by: Thibaut Sardan <33178835+Tbaut@users.noreply.github.com> Co-authored-by: GitHub Actions --- .../modals/sharingExplainerModal.ts | 5 ++ .../support/page-objects/navigationMenu.ts | 9 +-- .../cypress/tests/sharing-explainer-spec.ts | 57 +++++++++++++++++++ .../src/Components/Layouts/AppHeader.tsx | 4 +- .../src/Components/Layouts/AppNav.tsx | 7 ++- .../src/Components/SharingExplainerModal.tsx | 2 + packages/files-ui/src/locales/fr/messages.po | 3 +- 7 files changed, 76 insertions(+), 11 deletions(-) create mode 100644 packages/files-ui/cypress/support/page-objects/modals/sharingExplainerModal.ts create mode 100644 packages/files-ui/cypress/tests/sharing-explainer-spec.ts diff --git a/packages/files-ui/cypress/support/page-objects/modals/sharingExplainerModal.ts b/packages/files-ui/cypress/support/page-objects/modals/sharingExplainerModal.ts new file mode 100644 index 0000000000..ee9af0ba93 --- /dev/null +++ b/packages/files-ui/cypress/support/page-objects/modals/sharingExplainerModal.ts @@ -0,0 +1,5 @@ +export const sharingExplainerModal = { + body: () => cy.get("[data-testId=modal-container-sharing-explainer]"), + gotItButton: () => cy.get("[data-cy=button-got-it]"), + nextButton: () => cy.get("[data-cy=button-next]") +} diff --git a/packages/files-ui/cypress/support/page-objects/navigationMenu.ts b/packages/files-ui/cypress/support/page-objects/navigationMenu.ts index a19842843e..6e332e44dc 100644 --- a/packages/files-ui/cypress/support/page-objects/navigationMenu.ts +++ b/packages/files-ui/cypress/support/page-objects/navigationMenu.ts @@ -2,12 +2,13 @@ import { basePage } from "./basePage" export const navigationMenu = { ...basePage, - homeNavButton: () => cy.get("[data-cy=home-nav]"), - binNavButton: () => cy.get("[data-cy=bin-nav]"), - settingsNavButton: () => cy.get("[data-cy=settings-nav]"), + homeNavButton: () => cy.get("[data-cy=link-home]"), + binNavButton: () => cy.get("[data-cy=link-bin]"), + settingsNavButton: () => cy.get("[data-cy=link-settings]"), + sharedNavButton: () => cy.get("[data-cy=link-shared]"), spaceUsedLabel: () => cy.get("[data-cy=label-space-used]", { timeout: 10000 }), spaceUsedProgressBar: () => cy.get("[data-cy=progress-bar-space-used]"), - sendFeedbackNavButton: () => cy.get("[data-cy=send-feedback-nav]"), + reportABugButton: () => cy.get("[data-cy=button-report-bug]"), // mobile view only signOutButton: () => cy.get("[data-cy=signout-nav]") } diff --git a/packages/files-ui/cypress/tests/sharing-explainer-spec.ts b/packages/files-ui/cypress/tests/sharing-explainer-spec.ts new file mode 100644 index 0000000000..0103251ab8 --- /dev/null +++ b/packages/files-ui/cypress/tests/sharing-explainer-spec.ts @@ -0,0 +1,57 @@ +import { navigationMenu } from "../support/page-objects/navigationMenu" +import { sharingExplainerModal } from "../support/page-objects/modals/sharingExplainerModal" + +describe("Sharing Explainer", () => { + + context("desktop", () => { + + const sharingKey = "csf.dismissedSharingExplainer" + + it("User can view and dismiss the sharing explainer", () => { + // intercept and stub the response to ensure the explainer is displayed + cy.intercept("GET", "**/user/store", { + body: { [sharingKey]: "false" } + }) + + cy.web3Login() + navigationMenu.sharedNavButton().click() + sharingExplainerModal.body().should("be.visible") + + // set up a spy for the POST response + cy.intercept("POST", "**/user/store").as("storePost").then(() => { + + // dismiss the sharing explainer + sharingExplainerModal.nextButton().click() + sharingExplainerModal.nextButton().click() + sharingExplainerModal.gotItButton().click() + sharingExplainerModal.body().should("not.exist") + + // intercept POST to ensure the key was updated after the explainer is dismissed + cy.wait("@storePost").its("request.body").should("contain", { + [sharingKey]: "true" + }) + }) + }) + + it("User should not see sharing explainer if previously dismissed", () => { + cy.intercept("GET", "**/user/store", { + body: { [sharingKey]: "true" } + }) + + cy.web3Login() + + navigationMenu.sharedNavButton().click() + sharingExplainerModal.body().should("not.exist") + }) + + it("User should see the sharing explainer if api response is empty", () => { + cy.intercept("GET", "**/user/store", { + body: {} + }) + + cy.web3Login() + navigationMenu.sharedNavButton().click() + sharingExplainerModal.body().should("be.visible") + }) + }) +}) \ No newline at end of file diff --git a/packages/files-ui/src/Components/Layouts/AppHeader.tsx b/packages/files-ui/src/Components/Layouts/AppHeader.tsx index 0a58868e50..e0e6ae2521 100644 --- a/packages/files-ui/src/Components/Layouts/AppHeader.tsx +++ b/packages/files-ui/src/Components/Layouts/AppHeader.tsx @@ -222,7 +222,7 @@ const AppHeader = ({ navOpen, setNavOpen }: IAppHeader) => {
diff --git a/packages/files-ui/src/locales/fr/messages.po b/packages/files-ui/src/locales/fr/messages.po index fc007186ca..ede666ebf2 100644 --- a/packages/files-ui/src/locales/fr/messages.po +++ b/packages/files-ui/src/locales/fr/messages.po @@ -5,8 +5,7 @@ msgstr "" "POT-Creation-Date: 2021-04-23 11:05+0200\n" "PO-Revision-Date: 2021-10-27 02:40+0000\n" "Last-Translator: J. Lavoie \n" -"Language-Team: French \n" +"Language-Team: French \n" "Language: fr\n" "MIME-Version: 1.0\n" "Content-Type: text/plain; charset=utf-8\n"