diff --git a/client/coral-admin/src/routes/Install/components/Steps/FinalStep.js b/client/coral-admin/src/routes/Install/components/Steps/FinalStep.js index dbfd33461..242230294 100644 --- a/client/coral-admin/src/routes/Install/components/Steps/FinalStep.js +++ b/client/coral-admin/src/routes/Install/components/Steps/FinalStep.js @@ -2,12 +2,13 @@ import React from 'react'; import styles from './style.css'; import {Button} from 'coral-ui'; import {Link} from 'react-router'; +import cn from 'classnames'; import t from 'coral-framework/services/i18n'; const InitialStep = () => { return ( -
+

{t('install.final.description')}

diff --git a/client/coral-admin/src/routes/Install/components/Steps/InitialStep.js b/client/coral-admin/src/routes/Install/components/Steps/InitialStep.js index 8e6105533..72d9fdd54 100644 --- a/client/coral-admin/src/routes/Install/components/Steps/InitialStep.js +++ b/client/coral-admin/src/routes/Install/components/Steps/InitialStep.js @@ -3,11 +3,12 @@ import styles from './style.css'; import {Button} from 'coral-ui'; import PropTypes from 'prop-types'; import t from 'coral-framework/services/i18n'; +import cn from 'classnames'; const InitialStep = (props) => { const {nextStep} = props; return ( -
+

{t('install.initial.description')}

diff --git a/test/e2e/page_objects/install.js b/test/e2e/page_objects/install.js index df28f051d..cb2c27abe 100644 --- a/test/e2e/page_objects/install.js +++ b/test/e2e/page_objects/install.js @@ -8,19 +8,39 @@ module.exports = { .waitForElementVisible('body'); } }], - elements: { - 'getStartedButton': '.talk-install-get-started-button', - 'step2': '.talk-install-step-2', - 'step2organizationNameInput': '.talk-install-step-2 #organizationName', - 'step2saveButton': '.talk-install-step-2-save-button', - 'step3': '.talk-install-step-3', - 'step3EmailInput': '.talk-install-step-3 #email', - 'step3UsernameInput': '.talk-install-step-3 #username', - 'step3PasswordInput': '.talk-install-step-3 #password', - 'step3ConfirmPasswordInput': '.talk-install-step-3 #confirmPassword', - 'step3saveButton': '.talk-install-step-3-save-button', - 'step4': '.talk-install-step-4', - 'step4DomainInput': '.talk-install-step-4-permited-domains-input input', - 'step4saveButton': '.talk-install-step-4-save-button', - } + sections: { + step1: { + selector: '.talk-install-step-1', + elements: { + getStartedButton: '.talk-install-get-started-button', + }, + }, + step2: { + selector: '.talk-install-step-2', + elements: { + organizationNameInput: '.talk-install-step-2 #organizationName', + saveButton: '.talk-install-step-2-save-button', + }, + }, + step3: { + selector: '.talk-install-step-3', + elements: { + emailInput: '.talk-install-step-3 #email', + usernameInput: '.talk-install-step-3 #username', + passwordInput: '.talk-install-step-3 #password', + confirmPasswordInput: '.talk-install-step-3 #confirmPassword', + saveButton: '.talk-install-step-3-save-button', + }, + }, + step4: { + selector: '.talk-install-step-4', + elements: { + domainInput: '.talk-install-step-4-permited-domains-input input', + saveButton: '.talk-install-step-4-save-button', + }, + }, + step5: { + selector: '.talk-install-step-5', + }, + }, }; diff --git a/test/e2e/specs/01_install.js b/test/e2e/specs/01_install.js index caafdb4e0..950eed461 100644 --- a/test/e2e/specs/01_install.js +++ b/test/e2e/specs/01_install.js @@ -5,13 +5,13 @@ module.exports = { install .navigate() - .ready(); + .expect.section('@step1').to.be.present; }, 'User clicks get started button': (client) => { - const install = client.page.install(); + const step1 = client.page.install().section.step1; - install + step1 .waitForElementVisible('@getStartedButton') .click('@getStartedButton'); }, @@ -19,54 +19,60 @@ module.exports = { const install = client.page.install(); install - .waitForElementVisible('@step2'); + .expect.section('@step2').to.be.present; }, 'User fills step 2': (client) => { - const install = client.page.install(); + const step2 = client.page.install().section.step2; const {testData} = client.globals; - install - .waitForElementVisible('@step2organizationNameInput') - .setValue('@step2organizationNameInput', testData.organizationName) - .waitForElementVisible('@step2saveButton') - .click('@step2saveButton'); + step2 + .waitForElementVisible('@organizationNameInput') + .setValue('@organizationNameInput', testData.organizationName) + .waitForElementVisible('@saveButton') + .click('@saveButton'); }, 'User should see step 3 - Create your account': (client) => { const install = client.page.install(); install - .waitForElementVisible('@step3'); + .expect.section('@step3').to.be.present; }, 'User fills step 3': (client) => { - const install = client.page.install(); + const step3 = client.page.install().section.step3; const {testData: {admin}} = client.globals; - install - .setValue('@step3EmailInput', admin.email) - .setValue('@step3UsernameInput', admin.username) - .setValue('@step3PasswordInput', admin.password) - .setValue('@step3ConfirmPasswordInput', admin.password) - .waitForElementVisible('@step3saveButton') - .click('@step3saveButton'); + step3 + .setValue('@emailInput', admin.email) + .setValue('@usernameInput', admin.username) + .setValue('@passwordInput', admin.password) + .setValue('@confirmPasswordInput', admin.password) + .waitForElementVisible('@saveButton') + .click('@saveButton'); }, 'User should see step 4 - Domain Whitelist': (client) => { const install = client.page.install(); install - .waitForElementVisible('@step4'); + .expect.section('@step4').to.be.present; }, 'User fills step 4': (client) => { - const install = client.page.install(); + const step4 = client.page.install().section.step4; - install - .waitForElementVisible('@step4DomainInput') - .setValue('@step4DomainInput', client.launchUrl); + step4 + .waitForElementVisible('@domainInput') + .setValue('@domainInput', client.launchUrl); client.keys(client.Keys.ENTER); + step4 + .waitForElementVisible('@saveButton') + .click('@saveButton'); + }, + 'User should see step 5 - Final Step': (client) => { + const install = client.page.install(); + install - .waitForElementVisible('@step4saveButton') - .click('@step4saveButton'); + .expect.section('@step5').to.be.present; }, after: (client) => { client.end();