Skip to content

Commit

Permalink
[CLD-385]Install cypress and add login test cases (#226)
Browse files Browse the repository at this point in the history
  • Loading branch information
NghiaPham authored Dec 27, 2019
1 parent 7f99fe6 commit c822aad
Show file tree
Hide file tree
Showing 21 changed files with 1,550 additions and 271 deletions.
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
node_modules
cypress/screenshots
public/dist
src/tests/coverage
src/constants/.env
cypress/videos
.vscode
.DS_Store
yarn-error.log
Expand Down
4 changes: 4 additions & 0 deletions cypress.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"supportFile": "./cypress/support/index.ts",
"video": false
}
70 changes: 70 additions & 0 deletions cypress/integration/login-flow.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
import loginPage from '../pages/loginPage'
import clientAppsPage from '../pages/clientAppsPage'
import developerAppsPage from '../pages/developerAppsPage'
import adminApprovalsPage from '../pages/adminApprovalsPage'

describe('Login flow', () => {
describe('works when testing the happycase flow', () => {
const {
selectors: { inputEmail, inputPassword, buttonLogin },
loginAsAdminUrl,
loginAsClientUrl,
loginAsDeveloperUrl
} = loginPage

const {
url: pageClientAppsUrl,
selectors: { container: clientAppsPageContainer }
} = clientAppsPage

const {
url: developerPageUrl,
selectors: { container: developerPageContainer }
} = developerAppsPage

const {
url: adminPageUrl,
selectors: { container: adminPageContainer }
} = adminApprovalsPage

const testCases = [
{
testCaseName: 'login successfully using DEVELOPER account',
email: Cypress.env('DEVELOPER_ACCOUNT_EMAIL'),
password: Cypress.env('DEVELOPER_ACCOUNT_PASSWORD'),
container: developerPageContainer,
url: developerPageUrl,
loginUrl: loginAsDeveloperUrl
},
{
testCaseName: 'login successfully using CLIENT account',
email: Cypress.env('CLIENT_ACCOUNT_EMAIL'),
password: Cypress.env('CLIENT_ACCOUNT_PASSWORD'),
container: clientAppsPageContainer,
url: pageClientAppsUrl,
loginUrl: loginAsClientUrl
},
{
testCaseName: 'login successfully using ADMIN account',
email: Cypress.env('ADMIN_ACCOUNT_EMAIL'),
password: Cypress.env('ADMIN_ACCOUNT_PASSWORD'),
container: adminPageContainer,
url: adminPageUrl,
loginUrl: loginAsAdminUrl
}
]
for (const { container, email, password, testCaseName, loginUrl } of testCases) {
it(testCaseName, done => {
cy.visit(loginUrl)
cy.get(inputEmail).type(email)
cy.get(inputPassword).type(password)
cy.get(buttonLogin).click()
cy.get(container).should('have.length', 1)
cy.window().then(window => {
window.localStorage.clear()
done()
})
})
}
})
})
6 changes: 6 additions & 0 deletions cypress/pages/adminApprovalsPage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export default {
url: '/admin/approvals',
selectors: {
container: '#page-admin-approvals-container'
}
}
6 changes: 6 additions & 0 deletions cypress/pages/clientAppsPage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export default {
url: '/client/apps',
selectors: {
container: '#page-client-apps-container'
}
}
6 changes: 6 additions & 0 deletions cypress/pages/developerAppsPage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
export default {
url: '/developer/apps',
selectors: {
container: '#page-developer-apps-container'
}
}
10 changes: 10 additions & 0 deletions cypress/pages/loginPage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
export default {
loginAsClientUrl: '/client/login',
loginAsDeveloperUrl: '/developer/login',
loginAsAdminUrl: '/admin/login',
selectors: {
inputEmail: 'input#userName',
inputPassword: 'input#password',
buttonLogin: "button[type='submit']"
}
}
38 changes: 38 additions & 0 deletions cypress/plugins/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
const path = require('path')
const wp = require('@cypress/webpack-preprocessor')

module.exports = (on, config) => {
// https://basarat.gitbooks.io/typescript/docs/testing/cypress.html
const options = {
webpackOptions: {
resolve: {
extensions: ['.ts', '.tsx', '.js'],
modules: [
/* assuming that one up is where your node_modules sit,
relative to the currently executing script
*/
path.join(__dirname, '../../node_modules')
]
},
module: {
rules: [
{
test: /\.tsx?$/,
loader: 'ts-loader',
options: { transpileOnly: true }
}
]
}
}
}
on('file:preprocessor', wp(options))


// Retries plugin
require('cypress-plugin-retries/lib/plugin')(on)

// Config ENV
require('dotenv').config({ path: path.resolve(__dirname, '../../src/constants/.env') })
const baseUrl = process.env.APPLICATION_URL
return { ...config, baseUrl, env: { ...process.env } }
}
1 change: 1 addition & 0 deletions cypress/support/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
import 'cypress-plugin-retries'
12 changes: 12 additions & 0 deletions cypress/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
{
"compilerOptions": {
"strict": true,
"baseUrl": "../node_modules",
"target": "es5",
"lib": ["es5", "dom"],
"types": ["cypress"]
},
"include": [
"**/*.ts"
]
}
2 changes: 1 addition & 1 deletion jest.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ const { compilerOptions } = require('./tsconfig')

module.exports = {
preset: 'ts-jest',
testPathIgnorePatterns: ['<rootDir>/src/tests/'],
testPathIgnorePatterns: ['<rootDir>/src/tests/', '<rootDir>/cypress'],
setupFiles: ['<rootDir>/src/scripts/jest-setup.js'],
collectCoverageFrom: ['<rootDir>/src/**/*.ts', '<rootDir>/src/**/*.tsx'],
coverageDirectory: './src/tests/coverage',
Expand Down
29 changes: 22 additions & 7 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,14 @@
"dev": "yarn fetch-config && REAPIT_ENV=LOCAL webpack-dev-server --hot --progress --color --mode development --config ./src/scripts/webpack-dev.js",
"bundle-analyse": "node ./src/scripts/bundle-phobia.js && yarn build && webpack-bundle-analyzer ./public/dist/stats.json",
"fetch-config": "yarn config-manager getSecret reapit-marketplace-app-config",
"lint": "tslint --fix --project tsconfig.json --format stylish",
"lint:src": "tslint --fix --project tsconfig.json --format stylish",
"lint:cypress": "tslint --fix --project './cypress/tsconfig.json' --format stylish",
"lint": "yarn lint:src && yarn lint:cypress",
"test": "jest --coverage --silent",
"test-dev": "jest --watch --verbose",
"test:ci": "jest --ci --reporters=default --reporters=jest-junit",
"test-e2e": "wdio ./src/scripts/wdio.conf.js",
"test-e2e:dev": "cypress open",
"test-e2e": "cypress run --headless",
"test-dev-e2e": "wdio ./src/scripts/wdio.conf.js --watch",
"test-e2e:ci": "concurrently --success=\"first\" \"yarn start\" \"yarn test-e2e\" -k",
"test-e2e:bstack": "wdio ./src/scripts/browserstack.conf.js",
Expand All @@ -45,6 +48,9 @@
"swagger-ui-react": "^3.24.3"
},
"devDependencies": {
"@babel/core": "^7.7.7",
"@babel/preset-env": "^7.7.7",
"@cypress/webpack-preprocessor": "^4.1.1",
"@reapit/config-manager": "^1.1.0",
"@reapit/foundations-ts-definitions": "latest",
"@redux-saga/testing-utils": "^1.0.5",
Expand All @@ -61,11 +67,16 @@
"@types/react-router-dom": "^5.1.3",
"@types/react-slick": "^0.23.4",
"@types/webdriverio": "~4.13.3",
"babel-loader": "^8.0.6",
"browserstack-capabilities": "^0.7.0",
"bundle-phobia-cli": "~0.13.0",
"chromedriver": "~2.43.1",
"concurrently": "~4.1.1",
"css-loader": "~3.0.0",
"cypress": "^3.8.0",
"cypress-plugin-retries": "^1.5.2",
"dotenv": "^8.2.0",
"dotenv-webpack": "^1.7.0",
"enzyme": "^3.10.0",
"enzyme-adapter-react-16": "^1.15.1",
"enzyme-to-json": "^3.4.3",
Expand All @@ -92,7 +103,7 @@
"style-loader": "~0.23.1",
"sw2dts": "~2.6.2",
"ts-jest": "~24.0.2",
"ts-loader": "~6.0.1",
"ts-loader": "^6.2.1",
"ts-node": "~8.3.0",
"ts-paths-to-webpack-alias": "~0.3.1",
"tslint": "^5.20.1",
Expand All @@ -105,7 +116,7 @@
"wdio-jasmine-framework": "~0.3.8",
"wdio-spec-reporter": "~0.1.5",
"webdriverio": "~4.14.4",
"webpack": "4.41.3",
"webpack": "^4.41.4",
"webpack-bundle-analyzer": "~3.3.2",
"webpack-cli": "~3.3.2",
"webpack-dev-server": "~3.4.1"
Expand All @@ -117,10 +128,14 @@
}
},
"lint-staged": {
"*.{ts,tsx}": [
"yarn lint",
"./src/**/*.{ts,tsx}": [
"yarn lint:src",
"git add"
]
],
"./cypress/*.{ts,tsx}": [
"yarn lint:cypress",
"git add"
]
},
"browserslist": [
"> 1%",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,39 +2,14 @@

exports[`AdminApproval should match a snapshot when LOADING false 1`] = `
<Connect(ErrorBoundary)>
<FlexContainerResponsive
data-test="revision-list-container"
<div
id="page-admin-approvals-container"
>
<div>
<Table
columns={
Array [
Object {
"Cell": [Function],
"Header": "#",
"id": "id",
},
Object {
"Header": "AppId",
"accessor": "appId",
},
Object {
"Header": "Type",
"accessor": "type",
},
Object {
"Header": "Description",
"accessor": "description",
},
Object {
"Cell": [Function],
"Header": "",
"id": "buttonColumn",
},
]
}
data={
<FlexContainerResponsive
data-test="revision-list-container"
>
<Component
list={
Array [
Object {
"appId": "ddc8b25e-42a2-468e-aa8f-4091eee6958f",
Expand Down Expand Up @@ -269,19 +244,45 @@ exports[`AdminApproval should match a snapshot when LOADING false 1`] = `
]
}
loading={false}
tableColumns={
Array [
Object {
"Cell": [Function],
"Header": "#",
"id": "id",
},
Object {
"Header": "AppId",
"accessor": "appId",
},
Object {
"Header": "Type",
"accessor": "type",
},
Object {
"Header": "Description",
"accessor": "description",
},
Object {
"Cell": [Function],
"Header": "",
"id": "buttonColumn",
},
]
}
/>
<Pagination
onChange={[Function]}
pageNumber={2}
pageSize={10}
totalCount={69}
/>
</div>
<Pagination
onChange={[Function]}
pageNumber={2}
pageSize={10}
totalCount={69}
</FlexContainerResponsive>
<Component
afterClose={[Function]}
visible={false}
/>
</FlexContainerResponsive>
<Component
afterClose={[Function]}
visible={false}
/>
</div>
</Connect(ErrorBoundary)>
`;

Expand Down
Loading

0 comments on commit c822aad

Please sign in to comment.