diff --git a/packages/e2e-tests/cypress/e2e/flow-editor/create-flow.js b/packages/e2e-tests/cypress/e2e/flow-editor/create-flow.js new file mode 100644 index 00000000..77d08af9 --- /dev/null +++ b/packages/e2e-tests/cypress/e2e/flow-editor/create-flow.js @@ -0,0 +1,229 @@ +/// + +describe('Flow editor page', () => { + before(() => { + cy.login(); + }); + + after(() => { + cy.logout(); + }); + + it('create flow', () => { + cy.og('create-flow-button').click({ force: true }); + }); + + it('has two steps by default', () => { + cy.og('flow-step').should('have.length', 2); + }); + + context('edit flow', () => { + context('arrange Scheduler trigger', () => { + context('choose app and event substep', () => { + it('choose application', () => { + cy.og('choose-app-autocomplete').click(); + + cy.get('li[role="option"]:contains("Scheduler")').click(); + }); + + it('choose an event', () => { + cy + .og('choose-event-autocomplete') + .should('be.visible') + .click(); + + cy.get('li[role="option"]:contains("Every hour")').click(); + }); + + it('continue to next step', () => { + cy.og('flow-substep-continue-button').click(); + }); + + it('collapses the substep', () => { + cy.og('choose-app-autocomplete').should('not.be.visible'); + cy.og('choose-event-autocomplete').should('not.be.visible'); + }) + }); + + context('set up a trigger', () => { + it('choose "yes" in "trigger on weekends?"', () => { + cy + .og('parameters.triggersOnWeekend-autocomplete') + .should('be.visible') + .click(); + + cy.get('li[role="option"]:contains("Yes")').click(); + }); + + it('continue to next step', () => { + cy.og('flow-substep-continue-button').click(); + }); + + it('collapses the substep', () => { + cy.og('parameters.triggersOnWeekend-autocomplete').should('not.exist'); + }); + }); + + context('test trigger', () => { + it('show sample output', () => { + cy.og('flow-test-substep-output').should('not.exist'); + + cy.og('flow-substep-continue-button').click(); + + cy.og('flow-test-substep-output').should('be.visible'); + + cy.ss('Scheduler trigger test output'); + + cy.og('flow-substep-continue-button').click(); + }); + }); + }); + + context('arrange Slack action', () => { + context('choose app and event substep', () => { + it('choose application', () => { + cy.og('choose-app-autocomplete').click(); + + cy.get('li[role="option"]:contains("Slack")').click(); + }); + + it('choose an event', () => { + cy + .og('choose-event-autocomplete') + .should('be.visible') + .click(); + + cy.get('li[role="option"]:contains("Send a message to channel")').click(); + }); + + it('continue to next step', () => { + cy.og('flow-substep-continue-button').click(); + }); + + it('collapses the substep', () => { + cy.og('choose-app-autocomplete').should('not.be.visible'); + cy.og('choose-event-autocomplete').should('not.be.visible'); + }); + }); + + context('choose connection', () => { + it('choose connection', () => { + cy.og('choose-connection-autocomplete').click(); + + cy.get('li[role="option"]').first().click(); + }); + + it('continue to next step', () => { + cy.og('flow-substep-continue-button').click(); + }); + + it('collapses the substep', () => { + cy.og('choose-connection-autocomplete').should('not.be.visible'); + }); + }); + + context('set up action', () => { + it('choose channel', () => { + cy.og('parameters.channel-autocomplete').click(); + + cy.get('li[role="option"]').last().click(); + }); + + it('arrange message text', () => { + cy + .og('power-input', ' [contenteditable]') + .click() + .type(`Hello from e2e tests! Here is the first suggested variable's value; `); + + cy + .og('power-input-suggestion-group').first() + .og('power-input-suggestion-item').first() + .click(); + + cy.clickOutside(); + + cy.ss('Slack action message text'); + }); + + it('continue to next step', () => { + cy.og('flow-substep-continue-button').click(); + }); + + it('collapses the substep', () => { + cy + .og('power-input', ' [contenteditable]') + .should('not.exist'); + }); + }); + + context('test trigger', () => { + it('show sample output', () => { + cy.og('flow-test-substep-output').should('not.exist'); + + cy.og('flow-substep-continue-button').click(); + + cy.og('flow-test-substep-output').should('be.visible'); + + cy.ss('Slack action test output'); + + cy.og('flow-substep-continue-button').click(); + }); + }); + }); + }); + + context('publish and unpublish', () => { + it('publish flow', () => { + cy.og('unpublish-flow-button').should('not.exist'); + + cy + .og('publish-flow-button') + .should('be.visible') + .click(); + + cy.og('publish-flow-button').should('not.exist'); + }); + + it('shows read-only sticky snackbar', () => { + cy.og('flow-cannot-edit-info-snackbar').should('be.visible'); + + cy.ss('Published flow'); + }); + + it('unpublish from snackbar', () => { + cy + .og('unpublish-flow-from-snackbar') + .click(); + + cy.og('flow-cannot-edit-info-snackbar').should('not.exist'); + }) + + it('publish once again', () => { + cy + .og('publish-flow-button') + .should('be.visible') + .click(); + + cy.og('publish-flow-button').should('not.exist'); + }); + + it('unpublish from layout top bar', () => { + cy + .og('unpublish-flow-button') + .should('be.visible') + .click(); + + cy.og('unpublish-flow-button').should('not.exist'); + + cy.ss('Unpublished flow'); + }); + }); + + context('in layout', () => { + it('can go back to flows page', () => { + cy.og('editor-go-back-button').click(); + + cy.location('pathname').should('equal', '/flows'); + }); + }); +});