Add react-app e2e tests

Author: javierbrea

.travis.yml

@@ -17,9 +17,15 @@ addons:
 
 script:
   - npm run lint
-  - npm run test
-  - npm run coveralls
+  #- npm run test
   - npm run build
+  - cd test-e2e/react-app
+  - npm ci
+  - npm run cypress:install
+  - npm run cypress:verify
+  - npm run test:ci
+  - cd ../..
+  - npm run coveralls
   - 'if [ -n "$SONAR_TOKEN" ]; then sonar-scanner -Dsonar.login=${SONAR_TOKEN}; fi'
 
 deploy:

test-e2e/react-app/cypress/integration/about.js

@@ -0,0 +1,13 @@
+describe("About section", () => {
+  const SELECTORS = {
+    VERSION: "about-version"
+  };
+
+  before(() => {
+    cy.visit("/");
+  });
+
+  it("should display current version", () => {
+    cy.findByTestId(SELECTORS.VERSION).should("have.text", "1.2.0");
+  });
+});

test-e2e/react-app/cypress/integration/behaviorsAndFixtures.js

@@ -0,0 +1,56 @@
+describe("behaviors and fixtures", () => {
+  const SELECTORS = {
+    BEHAVIORS_COLLECTION_ITEM: ".behaviors-collection-item",
+    FIXTURES_COLLECTION_ITEM: ".fixtures-collection-item",
+    CURRENT_BEHAVIOR: "current-behavior-name",
+    CURRENT_FIXTURE: "current-fixture-id",
+    SET_BEHAVIOR_BASE: "set-behavior-base",
+    SET_BEHAVIOR_USER2: "set-behavior-user2"
+  };
+
+  before(() => {
+    cy.visit("/");
+  });
+
+  it("should display behaviors collection", () => {
+    cy.get(SELECTORS.BEHAVIORS_COLLECTION_ITEM).should("have.length", 2);
+  });
+
+  it("should display fixtures collection", () => {
+    cy.get(SELECTORS.FIXTURES_COLLECTION_ITEM).should("have.length", 2);
+  });
+
+  describe("when behavior is base", () => {
+    before(() => {
+      cy.findByTestId(SELECTORS.SET_BEHAVIOR_BASE).click();
+    });
+
+    it("should display current behavior", () => {
+      cy.findByTestId(SELECTORS.CURRENT_BEHAVIOR).should("have.text", "base");
+    });
+
+    it("should display current fixture", () => {
+      cy.findByTestId(SELECTORS.CURRENT_FIXTURE).should(
+        "have.text",
+        "0afdbb7f0ac441e56eae9401501e4a4b"
+      );
+    });
+  });
+
+  describe("when behavior is user2", () => {
+    before(() => {
+      cy.findByTestId(SELECTORS.SET_BEHAVIOR_USER2).click();
+    });
+
+    it("should display current behavior", () => {
+      cy.findByTestId(SELECTORS.CURRENT_BEHAVIOR).should("have.text", "user2");
+    });
+
+    it("should display current fixture", () => {
+      cy.findByTestId(SELECTORS.CURRENT_FIXTURE).should(
+        "have.text",
+        "d765f4ee07c59692b6a517143f756ecd"
+      );
+    });
+  });
+});

test-e2e/react-app/cypress/integration/cookies.js

@@ -0,0 +1,18 @@
+describe("Settings section", () => {
+  const SELECTORS = {
+    PATH: "settings-path",
+    DELAY: "settings-delay"
+  };
+
+  before(() => {
+    cy.visit("/");
+  });
+
+  it("should display current path", () => {
+    cy.findByTestId(SELECTORS.PATH).should("have.text", "mocks");
+  });
+
+  it("should display current delay", () => {
+    cy.findByTestId(SELECTORS.DELAY).should("have.text", "0");
+  });
+});

test-e2e/react-app/cypress/integration/settings.js

@@ -0,0 +1 @@
+import "@testing-library/cypress/add-commands";

test-e2e/react-app/cypress/support/commands.js

@@ -1,9 +1,11 @@
 const { Behavior } = require("@mocks-server/main");
 
-const { getUser } = require("./fixtures");
+const { getUser, getUser2 } = require("./fixtures");
 
 const base = new Behavior([getUser]);
+const user2 = new Behavior([getUser2]);
 
 module.exports = {
-  base
+  base,
+  user2
 };

test-e2e/react-app/mocks/behaviors.js

@@ -7,6 +7,16 @@ const getUser = {
   }
 };
 
+const getUser2 = {
+  url: "/api/user",
+  method: "GET",
+  response: {
+    status: 200,
+    body: [{ email: "foo2@foo2.com" }]
+  }
+};
+
 module.exports = {
-  getUser
+  getUser,
+  getUser2
 };