Improved integration tests

cypress.json

@@ -1,4 +1,5 @@
 {
   "projectId": "qa7fe2",
-  "ignoreTestFiles": "*.js"
+  "ignoreTestFiles": "*.js",
+  "baseUrl": "http://localhost:3000"
 }

cypress/integration/04.AboutMeAndLocation.feature

@@ -14,14 +14,16 @@ Feature: About me and and location
     When I save "Hansi" as my new name
     Then I can see my new name "Hansi" when I click on my profile picture in the top right
 
-    When I refresh the page
-    Then I can see my new name "Hansi" when I click on my profile picture in the top right
-    Then I save "Peter Lustig" as my new name
+  Scenario: Keep changes after refresh
+    When I changed my username to "Hansi" previously
+    And I refresh the page
+    Then my new username is still there
 
   Scenario Outline: I set my location to "<location>"
     When I save "<location>" as my location
-    And I visit the "profile/peter-lustig" page
-    Then I can see "<location>" as my location
+    And my username is "Peter Lustig"
+    When people visit my profile page
+    Then they can see the location in the info box below my avatar
 
     Examples: Location
         | location               | type    |
@@ -29,10 +31,12 @@ Feature: About me and and location
         | Mecklenburg-Vorpommern | Region  |
         | Germany                | Country |
 
-  Scenario: I write about me
-    When I save "Some text about me" to about me
-    And I visit the "profile/peter-lustig" page
-    Then I can see a "Some text about me" as my about me
+  Scenario: Display a description on profile page
+    Given I have the following self-description: "Ich lebe fettlos, fleischlos, fischlos dahin, fühle mich aber ganz wohl dabei"
+    And my username is "Peter Lustig"
+    When people visit my profile page
+    Then they can see the text in the info box below my avatar
+
 
 
 

cypress/integration/common/settings.js

@@ -2,11 +2,25 @@ import { When, Then } from 'cypress-cucumber-preprocessor/steps'
 
 /* global cy */
 
-When('I save {string} as my new name', name => {
+let aboutMeText
+let myLocation
+let myName
+
+const matchNameInUserMenu = name => {
+  cy.get('.avatar-menu').click()
+  cy.get('.avatar-menu-popover').contains(name)
+}
+
+const setUserName = name => {
   cy.get('input[id=name]')
     .clear()
     .type(name)
   cy.contains('Save').click()
+  myName = name
+}
+
+When('I save {string} as my new name', name => {
+  setUserName(name)
 })
 
 When('I save {string} as my location', location => {
@@ -15,34 +29,49 @@ When('I save {string} as my location', location => {
     .contains(location)
     .click()
   cy.contains('Save').click()
+  myLocation = location
 })
 
-When('I save {string} to about me', text => {
+When('I have the following self-description: {string}', text => {
   cy.get('textarea[id=bio]')
     .clear()
     .type(text)
   cy.contains('Save').click()
+  aboutMeText = text
+})
+
+When('my username is {string}', name => {
+  if (myName !== name) {
+    setUserName(name)
+  }
+  matchNameInUserMenu(name)
+})
+
+When('people visit my profile page', url => {
+  cy.visitMyProfile()
+})
+
+When('they can see the text in the info box below my avatar', () => {
+  cy.contains(aboutMeText)
+})
+
+When('I changed my username to {string} previously', name => {
+  myName = name
+})
+
+Then('they can see the location in the info box below my avatar', () => {
+  matchNameInUserMenu(myName)
+})
+
+Then('my new username is still there', () => {
+  matchNameInUserMenu(myName)
 })
 
 Then(
   'I can see my new name {string} when I click on my profile picture in the top right',
-  name => {
-    cy.get('input[id=name]')
-      .clear()
-      .type(name)
-    cy.contains('Save').click()
-  }
+  name => matchNameInUserMenu(name)
 )
 
-Then('I can see {string} as my location', location => {
-  cy.contains(location)
-})
-
-Then('I can see a {string} as my about me', about => {
-  cy.contains(about)
-})
-
 Then('I can see a {string} as my name', name => {
-  cy.get('.avatar-menu-popover').contains(name)
+  matchNameInUserMenu(name)
 })
-

cypress/integration/common/steps.js

@@ -1,22 +1,15 @@
 import { Given, When, Then } from 'cypress-cucumber-preprocessor/steps'
-import find from 'lodash/find'
-import { baseUrl } from '../../support/config'
+import { getLangByName } from '../../support/helpers'
 
 /* global cy  */
 
 const username = 'Peter Lustig'
 
-const locales = require('../../../locales')
-
-const getLangByName = function(name) {
-  return find(locales, { name })
-}
-
-const openPage = function(page) {
+const openPage = page => {
   if (page === 'landing') {
     page = ''
   }
-  cy.visit(`${baseUrl}/${page}`)
+  cy.visit(`/${page}`)
 }
 
 Given('I am logged in', () => {
@@ -80,10 +73,10 @@ Then('I am still logged in', () => {
 })
 
 When('I select {string} in the language menu', name => {
-  cy.switchLanguage(name)
+  cy.switchLanguage(name, true)
 })
 Given('I previously switched the language to {string}', name => {
-  cy.switchLanguage(name)
+  cy.switchLanguage(name, true)
 })
 Then('the whole user interface appears in {string}', name => {
   const lang = getLangByName(name)

cypress/support/commands.js

@@ -14,15 +14,31 @@
 
 /* globals Cypress cy */
 
-import { baseUrl } from './config'
+import { getLangByName } from './helpers'
 
-Cypress.Commands.add('switchLanguage', lang => {
+const switchLang = name => {
   cy.get('.login-locale-switch a').click()
-  cy.contains('.locale-menu-popover a', lang).click()
+  cy.contains('.locale-menu-popover a', name).click()
+}
+
+Cypress.Commands.add('switchLanguage', (name, force) => {
+  const code = getLangByName(name).code
+  if (force || !cy.get(`html[lang=${code}]`)) {
+    switchLang(name)
+  }
+})
+
+Cypress.Commands.add('visitMyProfile', () => {
+  if (!cy.get('.avatar-menu-popover')) {
+    cy.get('.avatar-menu').click()
+  }
+  cy.get('.avatar-menu-popover')
+    .find('a[href^="/profile/"]')
+    .click()
 })
 
 Cypress.Commands.add('login', (email, password) => {
-  cy.visit(`${baseUrl}/login`)
+  cy.visit(`/login`)
   cy.switchLanguage('English')
   cy.get('input[name=email]')
     .trigger('focus')
@@ -36,7 +52,7 @@ Cypress.Commands.add('login', (email, password) => {
   cy.location('pathname').should('eq', '/') // we're in!
 })
 Cypress.Commands.add('logout', (email, password) => {
-  cy.visit(`${baseUrl}/logout`)
+  cy.visit(`/logout`)
   cy.location('pathname').should('contain', '/login') // we're out
 })
 

cypress/support/config.js

@@ -1,5 +1,4 @@
 export default {
-  baseUrl: 'http://localhost:3000',
   users: {
     admin: {
       email: 'admin@example.org',

cypress/support/helpers.js

@@ -0,0 +1,11 @@
+
+import find from 'lodash/find'
+
+const helpers = {
+  locales: require('../../locales'),
+  getLangByName: name => {
+    return find(helpers.locales, { name })
+  }
+}
+
+export default helpers