feat: integrate e2e tests

.env.e2e

@@ -0,0 +1,6 @@
+TYPEORM_CONNECTION=sqlite
+TYPEORM_SYNCHRONIZE=true
+SERVER_PORT=4000
+ADMIN_PORT=4001
+IFRAME_BASE_URL=http://localhost:3000
+BURDY_HOST=http://localhost:4000

.github/workflows/e2e.yml

@@ -0,0 +1,20 @@
+name: E2E Tests
+
+on: [push]
+
+jobs:
+  cypress-run:
+    runs-on: ubuntu-18.04
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+
+      - name: E2E Tests
+        uses: cypress-io/github-action@v2
+        with:
+          record: true
+          build: npm run build
+          start: npm run e2e
+        env:
+          CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -2,6 +2,7 @@
 .env.*
 !.env.defaults
 !.env.sample
+!.env.e2e
 node_modules
 .idea
 dist
@@ -15,3 +16,7 @@ project/
 .next
 next.config.js
 next-env.d.ts
+
+# Cypress / E2E
+e2e/videos
+e2e/screenshots

cypress.json

@@ -0,0 +1,20 @@
+{
+  "projectId": "1wyx8f",
+  "chromeWebSecurity": false,
+  "baseUrl": "http://localhost:4000/admin",
+  "env": {
+    "apiUrl": "http://localhost:4000/api",
+    "firstName": "John",
+    "lastName": "Doe",
+    "email": "john.doe@burdy.io",
+    "password": "test1234@"
+  },
+  "fileServerFolder": "e2e",
+  "downloadsFolder": "e2e/downloads",
+  "fixturesFolder": "e2e/fixtures",
+  "integrationFolder": "e2e/integration",
+  "screenshotsFolder": "e2e/screenshots",
+  "videosFolder": "e2e/videos",
+  "supportFile": "e2e/support/index.ts",
+  "pluginsFile": "e2e/plugins/index.ts"
+}

cypress/plugins/index.js

@@ -0,0 +1,22 @@
+/// <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}
+ */
+// eslint-disable-next-line no-unused-vars
+module.exports = (on, config) => {
+  // `on` is used to hook into various events Cypress emits
+  // `config` is the resolved Cypress config
+}

cypress/support/commands.js

@@ -0,0 +1,25 @@
+// ***********************************************
+// This example commands.js shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })

cypress/support/index.js

@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/index.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')

e2e/helpers/asset.helper.js

@@ -0,0 +1,27 @@
+
+export const AssetHelper = {
+  createFolder: (name = '') => {
+    cy.get('[data-cy="assets-commandBar-new"]').click();
+    cy.get('[data-cy="assets-commandBar-new-folder"]').click();
+    cy.get('[data-cy=assets-createFolder-name]').click();
+    cy.get('[data-cy=assets-createFolder-name]').type(name);
+    cy.get('[data-cy=assets-createFolder-submit]').click();
+  },
+  deleteAction: () => {
+    cy.get('[data-cy="assets-commandBar-delete"]').click();
+    cy.get('[data-cy="assets-deleteConfirm"]').click();
+  },
+  renameAction: (name = '') => {
+    cy.get('[data-cy="assets-commandBar-rename"]').click();
+    cy.get('[data-cy="assets-rename-name"]').clear().type(name);
+    cy.get('[data-cy="assets-rename-submit"]').click();
+  },
+  selectors: {
+    assetTileSelect: '[data-automationid="ListCell"] .ms-Tile-check',
+    assetTile: '[data-automationid="ListCell"] .ms-Tile',
+    listItem: '[data-automationid="DetailsRowCell"][data-automation-key="column2"]',
+    listItemSelect: '[data-automationid="ListCell"] .ms-Check',
+    dropzone: '[data-name="dropzone"]'
+  }
+}
+

e2e/helpers/content-types.helper.js

@@ -0,0 +1,43 @@
+
+export const ContentTypesHelper = {
+  create: (name, fields, option = 0) => {
+    cy.get('[data-cy="contentTypes-commandBar-new"]').click();
+
+    cy.get('[data-cy="contentTypes-add-name"]').type(name);
+    cy.get('[data-cy="contentTypes-add-type"]').click();
+
+    cy.get('.ms-Dropdown-item[data-index]').should('have.length', 4);
+    cy.get(`.ms-Dropdown-item[data-index="${option}"]`).click();
+
+    fields.forEach(({name, label, type}) => {
+      cy.get('[data-cy="contentTypes-fieldsList-addField"]').click();
+
+      cy.get('[data-cy="contentTypes-fieldsSelect"]')
+        .find(ContentTypesHelper.selectors.fieldListItem)
+        .contains(type)
+        .click();
+
+      cy.get('[data-cy="contentTypes-fieldsSelect-config"]').click();
+      cy.get('[data-cy="contentTypes-fieldsConfig-name"]').type(name);
+      cy.get('[data-cy="contentTypes-fieldsConfig-label"]').type(label);
+      cy.get('[data-cy="contentTypes-fieldsConfig-confirm"]').click();
+
+      cy.get('[data-cy="contentTypes-fieldsList-item-title"]').should('exist');
+    })
+
+    cy.get('[data-cy="contentTypes-add-confirm"]').click();
+
+    cy.get(ContentTypesHelper.selectors.contentTypesListItem)
+      .contains(name)
+      .should('exist');
+  },
+  deleteSelected: () => {
+    cy.get('[data-cy="contentTypes-commandBar-delete"]').click();
+    cy.get('[data-cy="dialog-confirm"]').click();
+  },
+  selectors: {
+    fieldListItem: '[data-automationid="ListCell"]',
+    contentTypesListItem: '[data-automationid="ListCell"]'
+  }
+}
+

e2e/helpers/group.helper.js

@@ -0,0 +1,25 @@
+
+export const GroupHelper = {
+  createGroup: (name, description) => {
+    cy.get('[data-cy="groups-commandBar-add"]').click();
+    cy.get('[data-cy="groups-add-name"]').type(name);
+    cy.get('[data-cy="groups-add-description"]').type(description);
+    cy.get('[data-cy="groups-add-submit"]').click();
+  },
+  editGroup: (name, description) => {
+    cy.get('[data-cy="groups-commandBar-edit"]').click();
+    cy.get('[data-cy="groups-edit-name"]').clear().type(name);
+    cy.get('[data-cy="groups-edit-description"]').clear().type(description);
+    cy.get('[data-cy="groups-edit-submit"]').click();
+  },
+  deleteSelected: () => {
+    cy.get('[data-cy="groups-commandBar-delete"]').click();
+    cy.get('[data-cy="dialog-confirm"]').click();
+  },
+  selectors: {
+    listItemSelect: '[data-automationid="ListCell"] .ms-Check',
+    listItem: '[data-automationid="ListCell"]',
+    permissionItem: '[data-automationid="ListCell"]'
+  }
+}
+

e2e/helpers/settings.helper.js

@@ -0,0 +1,7 @@
+
+export const SettingsHelper = {
+  selectors: {
+    adminEmail: '[data-cy="settings-adminEmail"]',
+    submit: '[data-cy="settings-submit"]'
+  }
+}

e2e/helpers/tags.helper.js

@@ -0,0 +1,24 @@
+
+export const TagsHelper = {
+  createTag: (name, slug) => {
+    cy.get('[data-cy="tags-commandBar-new"]').click();
+    cy.get('[data-cy="tags-create-name"]').clear().type(name);
+    cy.get('[data-cy="tags-create-slug"]').clear().type(slug);
+    cy.get('[data-cy="tags-create-submit"]').click();
+  },
+  updateTag: (name, slug) => {
+    cy.get('[data-cy="tags-commandBar-update"]').click();
+    cy.get('[data-cy="tags-update-name"]').clear().type(name);
+    cy.get('[data-cy="tags-update-slug"]').clear().type(slug);
+    cy.get('[data-cy="tags-update-submit"]').click();
+  },
+  deleteSelected: () => {
+    cy.get('[data-cy="tags-commandBar-delete"]').click();
+    cy.get('[data-cy="dialog-confirm"]').click();
+  },
+  selectors: {
+    item: '[data-cy="columns-view-item"]',
+    column: '[data-cy="columns-view-column"]',
+    container: '[data-cy="columns-view"]',
+  }
+}

e2e/helpers/user.helper.js

@@ -0,0 +1,34 @@
+
+export const UserHelper = {
+  createUser: (email, firstName, lastName) => {
+    cy.get('[data-cy="users-commandBar-add"]').click();
+    cy.get('[data-cy="users-add-email"]').type(email);
+    cy.get('[data-cy="users-add-password"]').type('test-password');
+    cy.get('[data-cy="users-add-firstName"]').type(firstName);
+    cy.get('[data-cy="users-add-lastName"]').type(lastName);
+    cy.get('[data-cy="users-add-submit"]').click();
+  },
+  editUser: (firstName, lastName) => {
+    cy.get('[data-cy="users-commandBar-edit"]').click();
+    cy.get('[data-cy="users-edit-firstName"]').clear().type(firstName);
+    cy.get('[data-cy="users-edit-lastName"]').clear().type(lastName);
+    cy.get('[data-cy="users-edit-submit"]').click();
+  },
+  deleteSelected: () => {
+    cy.get('[data-cy="users-commandBar-delete"]').click();
+    cy.get('[data-cy="dialog-confirm"]').click();
+  },
+  deactivateSelected: () => {
+    cy.get('[data-cy="users-commandBar-deactivate"]').click();
+    cy.get('[data-cy="dialog-confirm"]').click();
+  },
+  activateSelected: () => {
+    cy.get('[data-cy="users-commandBar-activate"]').click();
+    cy.get('[data-cy="dialog-confirm"]').click();
+  },
+  selectors: {
+    listItemSelect: '[data-automationid="ListCell"] .ms-Check',
+    listItem: '[data-automationid="ListCell"]',
+    groupRow: '[data-automationid="DetailsRow"]',
+  }
+}

e2e/integration/1-authentication/1-initial.spec.ts

@@ -0,0 +1,17 @@
+
+
+describe('Initialization Test', () => {
+  it('creates first account', () => {
+    cy.visit('/');
+
+    cy.location('pathname').should('eq', '/admin/init');
+
+    cy.get('[data-cy="welcome-firstName"]').type(Cypress.env('firstName'));
+    cy.get('[data-cy="welcome-lastName"]').type(Cypress.env('lastName'));
+    cy.get('[data-cy="welcome-email"]').type(Cypress.env('email'));
+    cy.get('[data-cy="welcome-password"]').type(Cypress.env('password'));
+    cy.get('[data-cy="welcome-submit"]').click();
+
+    cy.location('pathname').should('eq', '/admin/');
+  })
+})

e2e/integration/1-authentication/2-login.spec.ts

@@ -0,0 +1,25 @@
+
+
+describe('Login test', () => {
+  it('logs in', () => {
+    cy.clearCookie('token');
+    cy.visit('/');
+    cy.location('pathname').should('eq', '/admin/login');
+
+    cy.get('[data-cy="login-email"]').type(Cypress.env('email'));
+    cy.get('[data-cy="login-password"]').type(Cypress.env('password'));
+    cy.get('[data-cy="login-submit"]').click();
+
+    cy.location('pathname').should('eq', '/admin/');
+  })
+
+  it('logs out', () => {
+    cy.visit('/');
+
+    cy.get('.ms-Persona-initials').click();
+    cy.get('.ms-ContextualMenu-item:nth-child(2) .ms-ContextualMenu-itemText').click();
+    cy.wait(500);
+    cy.getCookie('token').should('be.null');
+    cy.location('pathname').should('eq', '/admin/login');
+  });
+})

e2e/integration/2-dashboard/1-navigation.spec.ts

@@ -0,0 +1,43 @@
+
+
+describe('Dashboard Navigation', () => {
+  before(() => {
+    cy.login();
+  });
+
+  it('navigates to assets', () => {
+    cy.visit('/');
+    cy.get('[data-cy=dashboard-assets]').click();
+    cy.location('pathname').should('eq', '/admin/assets');
+  })
+
+  it('navigates to sites', () => {
+    cy.visit('/');
+    cy.get('[data-cy=dashboard-sites]').click();
+    cy.location('pathname').should('eq', '/admin/sites');
+  })
+
+  it('navigates to content types', () => {
+    cy.visit('/');
+    cy.get('[data-cy=dashboard-content-types]').click();
+    cy.location('pathname').should('eq', '/admin/content-types');
+  })
+
+  it('navigates to tags', () => {
+    cy.visit('/');
+    cy.get('[data-cy=dashboard-tags]').click();
+    cy.location('pathname').should('eq', '/admin/tags');
+  })
+
+  it('navigates to users', () => {
+    cy.visit('/');
+    cy.get('[data-cy=dashboard-users]').click();
+    cy.location('pathname').should('eq', '/admin/users');
+  })
+
+  it('navigates to settings', () => {
+    cy.visit('/');
+    cy.get('[data-cy=dashboard-settings]').click();
+    cy.location('pathname').should('eq', '/admin/settings');
+  })
+})