Merge pull request #6008 from Ocelot-Social-Community/cypress-migrate…

…-to-v10

test(other): migrate cypress to v12

backend/src/models/index.js

@@ -1,20 +1,37 @@
 // NOTE: We cannot use `fs` here to clean up the code. Cypress breaks on any npm
 // module that is not browser-compatible. Node's `fs` module is server-side only
 export default {
-  Image: require('./Image.js').default,
-  Badge: require('./Badge.js').default,
-  User: require('./User.js').default,
-  Group: require('./Group.js').default,
-  EmailAddress: require('./EmailAddress.js').default,
-  UnverifiedEmailAddress: require('./UnverifiedEmailAddress.js').default,
-  SocialMedia: require('./SocialMedia.js').default,
-  Post: require('./Post.js').default,
-  Comment: require('./Comment.js').default,
-  Category: require('./Category.js').default,
-  Tag: require('./Tag.js').default,
-  Location: require('./Location.js').default,
-  Donations: require('./Donations.js').default,
-  Report: require('./Report.js').default,
-  Migration: require('./Migration.js').default,
-  InviteCode: require('./InviteCode.js').default,
+  Image: typeof Cypress !== 'undefined' ? require('./Image.js') : require('./Image.js').default,
+  Badge: typeof Cypress !== 'undefined' ? require('./Badge.js') : require('./Badge.js').default,
+  User: typeof Cypress !== 'undefined' ? require('./User.js') : require('./User.js').default,
+  Group: typeof Cypress !== 'undefined' ? require('./Group.js') : require('./Group.js').default,
+  EmailAddress:
+    typeof Cypress !== 'undefined'
+      ? require('./EmailAddress.js')
+      : require('./EmailAddress.js').default,
+  UnverifiedEmailAddress:
+    typeof Cypress !== 'undefined'
+      ? require('./UnverifiedEmailAddress.js')
+      : require('./UnverifiedEmailAddress.js').default,
+  SocialMedia:
+    typeof Cypress !== 'undefined'
+      ? require('./SocialMedia.js')
+      : require('./SocialMedia.js').default,
+  Post: typeof Cypress !== 'undefined' ? require('./Post.js') : require('./Post.js').default,
+  Comment:
+    typeof Cypress !== 'undefined' ? require('./Comment.js') : require('./Comment.js').default,
+  Category:
+    typeof Cypress !== 'undefined' ? require('./Category.js') : require('./Category.js').default,
+  Tag: typeof Cypress !== 'undefined' ? require('./Tag.js') : require('./Tag.js').default,
+  Location:
+    typeof Cypress !== 'undefined' ? require('./Location.js') : require('./Location.js').default,
+  Donations:
+    typeof Cypress !== 'undefined' ? require('./Donations.js') : require('./Donations.js').default,
+  Report: typeof Cypress !== 'undefined' ? require('./Report.js') : require('./Report.js').default,
+  Migration:
+    typeof Cypress !== 'undefined' ? require('./Migration.js') : require('./Migration.js').default,
+  InviteCode:
+    typeof Cypress !== 'undefined'
+      ? require('./InviteCode.js')
+      : require('./InviteCode.js').default,
 }

cypress/cypress.config.js

@@ -0,0 +1,53 @@
+const dotenv = require('dotenv')
+const { defineConfig } = require("cypress");
+const browserify = require("@badeball/cypress-cucumber-preprocessor/browserify");
+const { addCucumberPreprocessorPlugin } = require("@badeball/cypress-cucumber-preprocessor");
+
+// Test persistent(between commands) store
+const testStore = {}
+
+async function setupNodeEvents(on, config) {
+  await addCucumberPreprocessorPlugin(on, config);
+
+  on("file:preprocessor", browserify.default(config));
+
+  on("task", {
+    pushValue({ name, value }) {
+      testStore[name] = value
+      return true
+    },
+    getValue(name) {
+      console.log("getValue",name,testStore)
+      return testStore[name]
+    },
+  });
+
+  on("after:run", (results) => {
+    if (results) {
+      console.log(results.status);
+    }
+  });
+
+  return config;
+}
+
+// Import backend .env (smart)?
+const { parsed } = dotenv.config({ path: '../backend/.env' })
+
+module.exports = defineConfig({
+  e2e: {
+    projectId: "qa7fe2",
+    defaultCommandTimeout: 10000,
+    chromeWebSecurity: false,
+    baseUrl: "http://localhost:3000",
+    specPattern: "cypress/e2e/**/*.feature",
+    supportFile: "cypress/support/e2e.js",
+    retries: {
+      runMode: 2,
+      openMode: 0,
+    },
+    video: false,
+    setupNodeEvents,
+  },
+  env: parsed
+});

cypress/integration/User.Authentication.feature → cypress/e2e/User.Authentication.feature

@@ -22,5 +22,6 @@ Feature: User authentication
 
   Scenario: Log out
     Given I am logged in as "peter-pan"
-    When I log out
+    When I navigate to page "/"
+    And I log out
     Then I am on page "login"

cypress/parallel-features.sh

@@ -8,10 +8,10 @@ CUR_JOB=$(expr $1 - 1)
 MAX_JOBS=$2
 
 # Features
-FEATURE_LIST=( $(find cypress/integration/ -maxdepth 1 -name "*.feature") )
+FEATURE_LIST=( $(find cypress/e2e/ -maxdepth 1 -name "*.feature") )
 
 # Calculation
-MAX_FEATURES=$(find cypress/integration/ -maxdepth 1 -name "*.feature" -print | wc -l)
+MAX_FEATURES=$(find cypress/e2e/ -maxdepth 1 -name "*.feature" -print | wc -l)
 # adds overhead features to the first jobs
 if [[ $CUR_JOB -lt $(expr ${MAX_FEATURES} % ${MAX_JOBS}) ]]
 then

cypress/support/commands.js

@@ -15,7 +15,7 @@
 /* globals Cypress cy */
 import "cypress-file-upload";
 import { GraphQLClient, request } from 'graphql-request'
-import config from '../../backend/src/config'
+import CONFIG from '../../backend/src/config'
 
 const authenticatedHeaders = (variables) => {
   const mutation = `
@@ -24,7 +24,7 @@ const authenticatedHeaders = (variables) => {
     }
   `
   return new Cypress.Promise((resolve, reject) => {
-    request(config.GRAPHQL_URI, mutation, variables).then((response) => {
+    request(CONFIG.GRAPHQL_URI, mutation, variables).then((response) => {
       resolve({ authorization: `Bearer ${response.login}` })
     })
   })
@@ -40,7 +40,7 @@ Cypress.Commands.add(
   ({email, password}) => {
     return new Cypress.Promise((resolve, reject) => {
       authenticatedHeaders({ email, password }).then((headers) => {
-        resolve(new GraphQLClient(config.GRAPHQL_URI, { headers }))
+        resolve(new GraphQLClient(CONFIG.GRAPHQL_URI, { headers }))
       })
     })
   })

cypress/support/factories.js

@@ -1,13 +1,7 @@
 import Factory from '../../backend/src/db/factories'
 import { getNeode } from '../../backend/src/db/neo4j'
 
-
-const neo4jConfigs = {
-  uri: Cypress.env('NEO4J_URI'),
-  username: Cypress.env('NEO4J_USERNAME'),
-  password: Cypress.env('NEO4J_PASSWORD')
-}
-const neodeInstance = getNeode(neo4jConfigs)
+const neodeInstance = getNeode()
 
 beforeEach(() => cy.then(() => neodeInstance.cypher('MATCH (everything) DETACH DELETE everything;')))
 
@@ -16,7 +10,7 @@ Cypress.Commands.add('neode', () => {
 })
 
 Cypress.Commands.add(
-  'first',
+  'firstOf',
   { prevSubject: true },
   (neode, model, properties) => {
     return neode.first(model, properties)

cypress/integration/Admin.DonationInfo/the_donation_info_contains_goal_{string}_and_progress_{string}.js → cypress/support/step_definitions/Admin.DonationInfo/the_donation_info_contains_goal_{string}_and_progress_{string}.js

@@ -1,8 +1,8 @@
-import { When } from "cypress-cucumber-preprocessor/steps";
+import { When } from "@badeball/cypress-cucumber-preprocessor";
 
 When("the donation info contains goal {string} and progress {string}", (goal, progress) => {
   cy.get('.top-info-bar')
     .should('contain', goal)
   cy.get('.top-info-bar')
     .should('contain', progress)
-});
+});

cypress/integration/Admin.DonationInfo/the_donation_info_is_{string}.js → cypress/support/step_definitions/Admin.DonationInfo/the_donation_info_is_{string}.js

@@ -1,6 +1,6 @@
-import { Then } from "cypress-cucumber-preprocessor/steps";
+import { Then } from "@badeball/cypress-cucumber-preprocessor";
 
 Then("the donation info is {string}", (visibility) => {
   cy.get('.top-info-bar')
     .should(visibility === 'visible' ? 'exist' : 'not.exist')
-})
+})

cypress/integration/Admin.PinPost/I_open_the_content_menu_of_post_{string}.js → cypress/support/step_definitions/Admin.PinPost/I_open_the_content_menu_of_post_{string}.js

@@ -1,7 +1,7 @@
-import { When } from "cypress-cucumber-preprocessor/steps";
+import { When } from "@badeball/cypress-cucumber-preprocessor";
 
 When("I open the content menu of post {string}", (title) => {
   cy.contains('.post-teaser', title)
     .find('.content-menu .base-button')
     .click()
-})
+})

cypress/integration/Admin.PinPost/the_post_with_title_{string}_has_a_ribbon_for_pinned_posts.js → cypress/support/step_definitions/Admin.PinPost/the_post_with_title_{string}_has_a_ribbon_for_pinned_posts.js

@@ -1,9 +1,9 @@
-import { Then } from "cypress-cucumber-preprocessor/steps";
+import { Then } from "@badeball/cypress-cucumber-preprocessor";
 
 Then("the post with title {string} has a ribbon for pinned posts", (title) => {
   cy.get(".post-teaser").contains(title)
     .parent()
     .parent()
     .find(".ribbon.--pinned")
     .should("contain", "Announcement")
-})
+})

cypress/integration/Admin.PinPost/there_is_no_button_to_pin_a_post.js → cypress/support/step_definitions/Admin.PinPost/there_is_no_button_to_pin_a_post.js

@@ -1,7 +1,7 @@
-import { Then } from "cypress-cucumber-preprocessor/steps";
+import { Then } from "@badeball/cypress-cucumber-preprocessor";
 
 Then("there is no button to pin a post", () => {
   cy.get("a.ds-menu-item-link")
     .should('contain', "Report Post") // sanity check
     .should('not.contain', "Pin post")
-})
+})

cypress/integration/Internationalization/I_see_a_button_with_the_label_{string}.js → cypress/support/step_definitions/Internationalization/I_see_a_button_with_the_label_{string}.js

@@ -1,5 +1,5 @@
-import { Then } from "cypress-cucumber-preprocessor/steps";
+import { Then } from "@badeball/cypress-cucumber-preprocessor";
 
 Then("I see a button with the label {string}", label => {
   cy.contains("button", label);
-});
+});

cypress/integration/Internationalization/I_select_{string}_in_the_language_menu.js → cypress/support/step_definitions/Internationalization/I_select_{string}_in_the_language_menu.js

@@ -1,8 +1,8 @@
-import { When } from "cypress-cucumber-preprocessor/steps";
+import { When } from "@badeball/cypress-cucumber-preprocessor";
 
 When("I select {string} in the language menu", language => {
     cy.get(".locale-menu")
       .click();
     cy.contains(".locale-menu-popover a", language)
       .click();
-});
+});

cypress/integration/Internationalization/the_whole_user_interface_appears_in_{string}.js → cypress/support/step_definitions/Internationalization/the_whole_user_interface_appears_in_{string}.js

@@ -1,8 +1,8 @@
-import { Then } from "cypress-cucumber-preprocessor/steps";
-import locales from '../../../webapp/locales'
+import { Then } from "@badeball/cypress-cucumber-preprocessor";
+import locales from '../../../../webapp/locales'
 
 Then("the whole user interface appears in {string}", language => {
   const { code } = locales.find((entry) => entry.name === language);
   cy.get(`html[lang=${code}]`);
   cy.getCookie("locale").should("have.property", "value", code);
-});
+});

cypress/integration/Moderation.HidePost/I_should_see_only_{int}_posts_on_the_newsfeed.js → cypress/support/step_definitions/Moderation.HidePost/I_should_see_only_{int}_posts_on_the_newsfeed.js

@@ -1,7 +1,7 @@
-import { Then } from "cypress-cucumber-preprocessor/steps";
+import { Then } from "@badeball/cypress-cucumber-preprocessor";
 
 Then("I should see only {int} posts on the newsfeed", posts => {
   cy.get(".post-teaser")
     .should("have.length", posts);
 });
-
+

cypress/integration/Moderation.HidePost/the_page_{string}_returns_a_404_error_with_a_message.js → cypress/support/step_definitions/Moderation.HidePost/the_page_{string}_returns_a_404_error_with_a_message.js

@@ -1,4 +1,4 @@
-import { Then } from "cypress-cucumber-preprocessor/steps";
+import { Then } from "@badeball/cypress-cucumber-preprocessor";
 
 Then("the page {string} returns a 404 error with a message:", (route, message) => {
   cy.request({
@@ -11,4 +11,4 @@ Then("the page {string} returns a 404 error with a message:", (route, message) =
     failOnStatusCode: false
     });
   cy.get(".error-message").should("contain", message);
-});
+});