more updates

.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"
+    }
+}

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"
     }
 }

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')
     })
-})
+})

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')
     })
-})
+})

cypress/plugins/index.js

@@ -1,20 +1,3 @@
-/// <reference types="cypress" />
-// ***********************************************************
-// 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)

cypress/selectors/article.sel.js

@@ -0,0 +1,3 @@
+module.exports = {
+    title: '[ng-bind="::$ctrl.article.title"]'
+}

cypress/selectors/editor.sel.js

@@ -1,3 +1,7 @@
 module.exports = {
-    
-}
+    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()"]'
+}

cypress/selectors/login.sel.js

@@ -1,6 +1,6 @@
 module.exports = {
-    emailField = '[placeholder=Email]',
-    passwordField = '[placeholder=Password]',
-    signInButton = '.btn',
-    errorMessages = '.error-messages li'
-}
+    emailField: '[placeholder=Email]',
+    passwordField: '[placeholder=Password]',
+    signInButton: '.btn',
+    errorMessages: '.error-messages li'
+}

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()
+})

cypress/support/login.cmd.js

@@ -1,3 +1,17 @@
-Cypress.Commands.add('login', (email = 'email', password = 'pass') => {
-    //todo
-})
+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)
+    })
+})

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
+        })
+})