diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..d2144dd --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,47 @@ +{ + "plugins": [ + "cypress", + "chai-friendly" + ], + "env": { + "browser": true, + "cypress/globals": true + }, + "extends": "airbnb", + "rules": { + "no-param-reassign": "off", + "prefer-destructuring": "off", + "no-use-before-define": [ 2, { "functions": false } ], + "object-shorthand": [ + "error", + "never" + ], + "comma-dangle": [ + "error", + "never" + ], + "no-unused-expressions": 0, + "func-names": 0, + "chai-friendly/no-unused-expressions": 2, + "indent": [ + "error", + 4 + ], + "linebreak-style": 0, + "quotes": [ + "error", + "single" + ], + "semi": [ + "error", + "never" + ] + }, + "parserOptions": { + "ecmaFeatures": { + "experimentalObjectRestSpread": true, + "jsx": true + }, + "sourceType": "module" + } +} \ No newline at end of file diff --git a/cypress.json b/cypress.json index 23397c8..7f0efbf 100644 --- a/cypress.json +++ b/cypress.json @@ -1,9 +1,11 @@ { - "baseUrl": "https://angular.realworld.io", + "baseUrl": "http://angularjs.realworld.io/#", "numTestsKeptInMemory": 5, "defaultCommandTimeout": 10000, "experimentalFetchPolyfill": true, "env": { - "device": "desktop" + "device": "desktop", + "email": "test@test.com", + "password": "Testtest1" } } diff --git a/cypress/integration/login.spec.js b/cypress/integration/login.spec.js index edac1f4..d02e829 100644 --- a/cypress/integration/login.spec.js +++ b/cypress/integration/login.spec.js @@ -4,7 +4,7 @@ describe('Login', () => { beforeEach(() => { // visit ('/login') -> will visit baseUrl + /login // baseUrl is set in config - cypress.json file - visit('/login') + cy.visit('/login') }) it('can see error message when username/password incorrect', () => { @@ -12,13 +12,13 @@ describe('Login', () => { cy.get(login.passwordField).type('random_pass') cy.get(login.signInButton).should('have.text', 'Sign in').click() cy.get(login.errorMessages).should('be.visible') - .and('have.text', 'email or password is invalid') + .and('contain', 'email or password is invalid') }) it('can press enter to log in', () => { cy.get(login.emailField).type('random2@test.com') cy.get(login.passwordField).type('random_pass{enter}') cy.get(login.errorMessages).should('be.visible') - .and('have.text', 'email or password is invalid') + .and('contain', 'email or password is invalid') }) -}) \ No newline at end of file +}) diff --git a/cypress/integration/settings.spec.js b/cypress/integration/settings.spec.js index e5d12df..0e2de88 100644 --- a/cypress/integration/settings.spec.js +++ b/cypress/integration/settings.spec.js @@ -1,11 +1,19 @@ import editor from '../selectors/editor.sel' +import article from '../selectors/article.sel' -describe.skip('Article', () => { +describe('Article', () => { beforeEach(() => { - login() - visit('/editor') + cy.login() + cy.visit('/editor/') }) it('can create a new article', () => { + cy.get(editor.titleField).type('My post title') + cy.get(editor.aboutField).type('Cypress') + cy.get(editor.bodyField).type('Cypress is so cool awyeah') + cy.get(editor.tagsField).type('cypress, automation') + cy.get(editor.publishButton).click() + cy.get(article.title).should('be.visible') + .and('have.text', 'My post title') }) -}) \ No newline at end of file +}) diff --git a/cypress/plugins/index.js b/cypress/plugins/index.js index 07c1a0a..8dc0406 100644 --- a/cypress/plugins/index.js +++ b/cypress/plugins/index.js @@ -1,20 +1,3 @@ -/// -// *********************************************************** -// This example plugins/index.js can be used to load plugins -// -// You can change the location of this file or turn off loading -// the plugins file with the 'pluginsFile' configuration option. -// -// You can read more here: -// https://on.cypress.io/plugins-guide -// *********************************************************** - -// This function is called when a project is opened or re-opened (e.g. due to -// the project's config changing) - -/** - * @type {Cypress.PluginConfig} - */ function setViewPortsAndUserAgent(device) { if (device === 'mob' || device === 'mobile') { return { @@ -31,7 +14,7 @@ function setViewPortsAndUserAgent(device) { } } - throw new Error("device not supported - [please set device to mob or web]") + throw new Error('device not supported - [please set device to mob or web]') } module.exports = (on, config) => { const viewportConfig = setViewPortsAndUserAgent(config.env.device) diff --git a/cypress/selectors/article.sel.js b/cypress/selectors/article.sel.js new file mode 100644 index 0000000..c27d976 --- /dev/null +++ b/cypress/selectors/article.sel.js @@ -0,0 +1,3 @@ +module.exports = { + title: '[ng-bind="::$ctrl.article.title"]' +} diff --git a/cypress/selectors/editor.sel.js b/cypress/selectors/editor.sel.js index 51f92fb..f0d0919 100644 --- a/cypress/selectors/editor.sel.js +++ b/cypress/selectors/editor.sel.js @@ -1,3 +1,7 @@ module.exports = { - -} \ No newline at end of file + titleField: '[ng-model="$ctrl.article.title"]', + aboutField: '[ng-model="$ctrl.article.description"]', + bodyField: '[ng-model="$ctrl.article.body"]', + tagsField: '[ng-model="$ctrl.tagField"]', + publishButton: '[ng-click="$ctrl.submit()"]' +} diff --git a/cypress/selectors/login.sel.js b/cypress/selectors/login.sel.js index 16d77b3..569bf2f 100644 --- a/cypress/selectors/login.sel.js +++ b/cypress/selectors/login.sel.js @@ -1,6 +1,6 @@ module.exports = { - emailField = '[placeholder=Email]', - passwordField = '[placeholder=Password]', - signInButton = '.btn', - errorMessages = '.error-messages li' -} \ No newline at end of file + emailField: '[placeholder=Email]', + passwordField: '[placeholder=Password]', + signInButton: '.btn', + errorMessages: '.error-messages li' +} diff --git a/cypress/support/index.js b/cypress/support/index.js index d68db96..2886cf2 100644 --- a/cypress/support/index.js +++ b/cypress/support/index.js @@ -14,7 +14,11 @@ // *********************************************************** // Import commands.js using ES2015 syntax: -import './commands' +import './login.cmd' +import './register.cmd' // Alternatively you can use CommonJS syntax: // require('./commands') +before(() => { + cy.register() +}) diff --git a/cypress/support/login.cmd.js b/cypress/support/login.cmd.js index 10cd7a6..de388bd 100644 --- a/cypress/support/login.cmd.js +++ b/cypress/support/login.cmd.js @@ -1,3 +1,17 @@ -Cypress.Commands.add('login', (email = 'email', password = 'pass') => { - //todo -}) \ No newline at end of file +Cypress.Commands.add('login', (email = Cypress.env('email'), password = Cypress.env('password')) => { + cy.request({ + // here we can't use just '/api/users/login' because baseUrl is different than API url + // if they are the same, then we can just use url: '/api/users/login' like in visit() + url: 'https://conduit.productionready.io/api/users/login', + method: 'POST', + body: { + user: { + email: email, + password: password + } + } + }).then((response) => { + expect(response.status).to.eq(200) + window.localStorage.setItem('jwtToken', response.body.user.token) + }) +}) diff --git a/cypress/support/register.cmd.js b/cypress/support/register.cmd.js new file mode 100644 index 0000000..97d3007 --- /dev/null +++ b/cypress/support/register.cmd.js @@ -0,0 +1,20 @@ +Cypress.Commands.add('register', () => { + const username = `cy${Math.random().toString().slice(2, 11)}` + const email = `${username}@mailinator.com` + cy.request({ + url: 'https://conduit.productionready.io/api/users', + method: 'POST', + body: { + user: { + username: username, + email: email, + password: 'Testtest1' + } + } + }) + .then((response) => { + expect(response.status).to.eq(200) + Cypress.env('email', email) + return email + }) +})