From 6bd59e7f8fd593d0abc929bdcf3cb30d20cbb1e1 Mon Sep 17 00:00:00 2001 From: Dean Date: Thu, 21 Apr 2022 11:59:59 +0100 Subject: [PATCH] Minor test enhancements and publish workflow test spec added --- packages/bbui/src/Modal/ModalContent.svelte | 2 + .../integration/appPublishWorkflow.spec.js | 109 ++++++++++++++++++ .../components/common/ConfirmDialog.svelte | 2 + .../components/common/inputs/CopyInput.svelte | 3 +- .../src/components/deploy/DeployModal.svelte | 14 ++- .../builder/app/[application]/_layout.svelte | 6 +- .../pages/builder/portal/apps/index.svelte | 1 + 7 files changed, 132 insertions(+), 5 deletions(-) create mode 100644 packages/builder/cypress/integration/appPublishWorkflow.spec.js diff --git a/packages/bbui/src/Modal/ModalContent.svelte b/packages/bbui/src/Modal/ModalContent.svelte index 9cdaaa83d2..830f2004ef 100644 --- a/packages/bbui/src/Modal/ModalContent.svelte +++ b/packages/bbui/src/Modal/ModalContent.svelte @@ -23,6 +23,7 @@ export let secondaryButtonText = undefined export let secondaryAction = undefined export let secondaryButtonWarning = false + export let dataCy = null const { hide, cancel } = getContext(Context.Modal) let loading = false @@ -63,6 +64,7 @@ role="dialog" tabindex="-1" aria-modal="true" + data-cy={dataCy} >

{ + context("Publish Application Workflow", () => { + before(() => { + cy.login() + cy.createTestApp() + }) + + it("Should reflect the unpublished status correctly", () => { + cy.visit(`${Cypress.config().baseUrl}/builder`) + cy.wait(1000) + + cy.get(".appTable") + let appStatusEle = cy.get(".app-status").eq(0) + appStatusEle.contains("Unpublished") + appStatusEle.get("svg[aria-label='GlobeStrike']").should("exist") + appStatusEle.get(".app-row-actions .spectrum-Button").contains("Preview") + + appStatusEle.get(".app-row-actions .spectrum-Button").contains("Edit").click({ force: true }) + + cy.get(".app-status-icon svg[aria-label='GlobeStrike']").should("exist") + cy.get(".app-status-icon svg[aria-label='Globe']").should("not.exist") + }) + + it("Should publish an application and correctly reflect that", () => { + //Assuming the previous test was run and the unpublished app is open in edit mode. + + cy.get(".toprightnav button.spectrum-Button").contains("Publish").click({ force : true }) + + let deployModal = cy.get(".spectrum-Modal [data-cy='deploy-app-modal']").should("be.visible") + deployModal.within(() => { + cy.get(".spectrum-Button").contains("Publish").click({ force : true }) + cy.wait(1000) + }); + + let deployModalSuccess = cy.get(".spectrum-Modal [data-cy='deploy-app-success-modal']") + deployModalSuccess.should("be.visible") + + deployModalSuccess.within(() => { + cy.get("[data-cy='deployed-app-url'] input").should('have.value', Cypress.config().baseUrl + '/app/cypress-tests') + cy.get(".spectrum-Button").contains("Done").click({ force: true }) + }); + + deployModalSuccess.should("exist") + + cy.visit(`${Cypress.config().baseUrl}/builder`) + cy.wait(1000) + + cy.get(".appTable") + let appStatusEle = cy.get(".app-status").eq(0) + appStatusEle.contains("Published") + appStatusEle.get("svg[aria-label='Globe']").should("exist") + appStatusEle.get(".app-row-actions .spectrum-Button").contains("View app") + + appStatusEle.get(".app-row-actions .spectrum-Button").contains("Edit").click({ force: true }) + + const publishStatusIcon = cy.get(".app-status-icon svg[aria-label='Globe']").should("exist") + publishStatusIcon.click({ force: true }) + + const publishingMenu = cy.get("[data-cy='publish-popover-action']") + publishingMenu.should("be.visible") + + publishingMenu.get("button[data-cy='publish-popover-action']").should("exist") + publishingMenu.get("button").contains("View App").should("exist") + + publishingMenu.get(".publish-popover-message").should("have.text", "Last Published: a few seconds ago") + + }) + + it("Should unpublish an application from the top navigation and reflect the status change", () => { + //Assuming the previous test app exists and is published + + cy.visit(`${Cypress.config().baseUrl}/builder`) + + cy.get(".appTable") + let appStatusEle = cy.get(".app-status").eq(0) + appStatusEle.contains("Published") + appStatusEle.get("svg[aria-label='Globe']").should("exist") + appStatusEle.get(".app-row-actions .spectrum-Button").contains("View app") + + appStatusEle.get(".app-row-actions .spectrum-Button").contains("Edit").click({ force: true }) + + //The published status + const publishStatusIcon = cy.get(".app-status-icon svg[aria-label='Globe']").should("exist") + publishStatusIcon.click({ force: true }) + + const publishingMenu = cy.get("[data-cy='publish-popover-action']") + publishingMenu.should("be.visible") + + const unpublishButton = publishingMenu.get("button[data-cy='publish-popover-action']") + unpublishButton.should("exist") + + unpublishButton.click({ force : true }) + + const unpublishModal = cy.get("[data-cy='unpublish-modal']") + unpublishModal.should("be.visible") + unpublishModal.get(".confirm-wrap button").click({ force: true }) + + cy.get(".app-status-icon svg[aria-label='GlobeStrike']").should("exist") + + cy.visit(`${Cypress.config().baseUrl}/builder`) + + appStatusEle = cy.get(".appTable") + appStatusEle.get(".app-status").eq(0).contains("Unpublished") + + }) + }) +}) diff --git a/packages/builder/src/components/common/ConfirmDialog.svelte b/packages/builder/src/components/common/ConfirmDialog.svelte index ece20fe102..352b97da59 100644 --- a/packages/builder/src/components/common/ConfirmDialog.svelte +++ b/packages/builder/src/components/common/ConfirmDialog.svelte @@ -9,6 +9,7 @@ export let onCancel = undefined export let warning = true export let disabled + export let dataCy = null let modal @@ -28,6 +29,7 @@ {cancelText} {warning} {disabled} + {dataCy} > {body} diff --git a/packages/builder/src/components/common/inputs/CopyInput.svelte b/packages/builder/src/components/common/inputs/CopyInput.svelte index 68974fb63a..102fd5682a 100644 --- a/packages/builder/src/components/common/inputs/CopyInput.svelte +++ b/packages/builder/src/components/common/inputs/CopyInput.svelte @@ -4,6 +4,7 @@ export let label = null export let value export let copyValue + export let dataCy = null const copyToClipboard = val => { const dummy = document.createElement("textarea") @@ -16,7 +17,7 @@ } -
+
copyToClipboard(value || copyValue)}> diff --git a/packages/builder/src/components/deploy/DeployModal.svelte b/packages/builder/src/components/deploy/DeployModal.svelte index 233c6862ab..ffda399440 100644 --- a/packages/builder/src/components/deploy/DeployModal.svelte +++ b/packages/builder/src/components/deploy/DeployModal.svelte @@ -73,6 +73,7 @@ title="Publish to Production" confirmText="Publish" onConfirm={deployApp} + dataCy={"deploy-app-modal"} > The changes you have made will be published to the production version of @@ -97,7 +98,12 @@ - +
App Published!
- + diff --git a/packages/builder/src/pages/builder/app/[application]/_layout.svelte b/packages/builder/src/pages/builder/app/[application]/_layout.svelte index 5547b2c6aa..645a2f621a 100644 --- a/packages/builder/src/pages/builder/app/[application]/_layout.svelte +++ b/packages/builder/src/pages/builder/app/[application]/_layout.svelte @@ -229,8 +229,9 @@ bind:this={publishPopover} align="right" disabled={!isPublished} + dataCy="publish-popover-menu" > -
+
{ notPublishedPopover.show() }} @@ -297,6 +298,7 @@ title="Confirm unpublish" okText="Unpublish app" onOk={confirmUnpublishApp} + dataCy={"unpublish-modal"} > Are you sure you want to unpublish the app {selectedApp?.name}? diff --git a/packages/builder/src/pages/builder/portal/apps/index.svelte b/packages/builder/src/pages/builder/portal/apps/index.svelte index ad82869c21..a25e7e2c6a 100644 --- a/packages/builder/src/pages/builder/portal/apps/index.svelte +++ b/packages/builder/src/pages/builder/portal/apps/index.svelte @@ -456,6 +456,7 @@ title="Confirm unpublish" okText="Unpublish app" onOk={confirmUnpublishApp} + dataCy={"unpublish-modal"} > Are you sure you want to unpublish the app {selectedApp?.name}?