From 10692a2131d76320ba7f5033042dc5876abc3973 Mon Sep 17 00:00:00 2001 From: Jackson Harper Date: Wed, 30 Mar 2022 21:22:43 -0700 Subject: [PATCH] Add cypress tests --- packages/cypress/README.md | 2 + packages/cypress/cypress.json | 8 ++++ .../cypress/cypress/fixtures/example.json | 5 +++ .../authentication/register-w-email.js | 42 +++++++++++++++++++ .../cypress/integration/library/add-item.js | 30 +++++++++++++ .../integration/unauthenticated/redirects.js | 8 ++++ packages/cypress/cypress/plugins/index.js | 22 ++++++++++ packages/cypress/cypress/support/commands.js | 16 +++++++ packages/cypress/cypress/support/index.js | 20 +++++++++ packages/cypress/package.json | 14 +++++++ packages/cypress/tsconfig.json | 21 ++++++++++ 11 files changed, 188 insertions(+) create mode 100644 packages/cypress/README.md create mode 100644 packages/cypress/cypress.json create mode 100644 packages/cypress/cypress/fixtures/example.json create mode 100644 packages/cypress/cypress/integration/authentication/register-w-email.js create mode 100644 packages/cypress/cypress/integration/library/add-item.js create mode 100644 packages/cypress/cypress/integration/unauthenticated/redirects.js create mode 100644 packages/cypress/cypress/plugins/index.js create mode 100644 packages/cypress/cypress/support/commands.js create mode 100644 packages/cypress/cypress/support/index.js create mode 100644 packages/cypress/package.json create mode 100644 packages/cypress/tsconfig.json diff --git a/packages/cypress/README.md b/packages/cypress/README.md new file mode 100644 index 000000000..204f5077f --- /dev/null +++ b/packages/cypress/README.md @@ -0,0 +1,2 @@ + +Run `yarn && yarn cypress open` diff --git a/packages/cypress/cypress.json b/packages/cypress/cypress.json new file mode 100644 index 000000000..19d7ae51f --- /dev/null +++ b/packages/cypress/cypress.json @@ -0,0 +1,8 @@ +{ + "baseUrl": "http://localhost:3000", + "experimentalSessionSupport": true, + "fixturesFolder": false, + "supportFile": false, + "pluginsFile": false, + "video": false +} diff --git a/packages/cypress/cypress/fixtures/example.json b/packages/cypress/cypress/fixtures/example.json new file mode 100644 index 000000000..02e425437 --- /dev/null +++ b/packages/cypress/cypress/fixtures/example.json @@ -0,0 +1,5 @@ +{ + "name": "Using fixtures to represent data", + "email": "hello@cypress.io", + "body": "Fixtures are a great way to mock data for responses to routes" +} diff --git a/packages/cypress/cypress/integration/authentication/register-w-email.js b/packages/cypress/cypress/integration/authentication/register-w-email.js new file mode 100644 index 000000000..7f6391d8c --- /dev/null +++ b/packages/cypress/cypress/integration/authentication/register-w-email.js @@ -0,0 +1,42 @@ +const email = 'tester@omnivore.app' +const username = 'testuser' +const password = 'testpassword' +const fullName = 'Test User' + +describe('Register with email', () => { + it('creates a new user', function () { + cy.visit('/email-registration') + + cy.get('input[name=email]').type(email) + cy.get('input[name=username]').type(username) + cy.get('input[name=password]').type(password) + cy.get('input[name=name]').type(fullName) + + cy.get('form').submit() + + // we should be redirected to /dashboard + cy.location('pathname').should('include', '/email-login') + }) +}) + +describe('Login with email', () => { + it('sets auth token and redirects', function () { + cy.visit('/email-login') + + cy.get('input[name=email]').type(email) + cy.get('input[name=password]').type(password) + + cy.get('form').submit() + + cy.getCookie('auth').should('exist') + cy.location('pathname').should('include', '/home') + }) +}) +/* + + // our auth cookie should be present + + + // UI should reflect this user being logged in + cy.get('h1').should('contain', 'jane.lane') + */ \ No newline at end of file diff --git a/packages/cypress/cypress/integration/library/add-item.js b/packages/cypress/cypress/integration/library/add-item.js new file mode 100644 index 000000000..404f85f5e --- /dev/null +++ b/packages/cypress/cypress/integration/library/add-item.js @@ -0,0 +1,30 @@ + +describe('add link button', () => { + before(() => { + const email = 'tester@omnivore.app' +// const username = 'testuser' +const password = 'testpassword' + + cy.login(email, password) + cy.visit('/home'); + }); + + it('should add a link', () => { + // Use keyboard command to open add link modal + cy.get('body').type('a') + + cy.focused().type('https://jacksonh.org/{enter}') + + // wait for the link to be added + cy.wait(2000) + + cy.reload() + // cy.get('[data-testid="add-link-button"]').click(); + // cy.get('[data-testid="link-input"]').type('https://www.google.com'); + // cy.get('[data-testid="link-input"]').type('{enter}'); + // cy.get('[data-testid="link-input"]').should('have.value', ''); + // cy.get('[data-testid="link-input"]').type('https://www.google.com'); + // cy.get('[data-testid="link-input"]').type('{enter}'); + // cy.get('[data-testid="link-input"]').should('have.value', ''); + }); +}); diff --git a/packages/cypress/cypress/integration/unauthenticated/redirects.js b/packages/cypress/cypress/integration/unauthenticated/redirects.js new file mode 100644 index 000000000..f68749899 --- /dev/null +++ b/packages/cypress/cypress/integration/unauthenticated/redirects.js @@ -0,0 +1,8 @@ + +describe('pages that require auth', () => { + it('should add a link', () => { + cy.visit('/home') + cy.location('pathname') + .should('be.equal', '/login') + }); +}); diff --git a/packages/cypress/cypress/plugins/index.js b/packages/cypress/cypress/plugins/index.js new file mode 100644 index 000000000..59b2bab6e --- /dev/null +++ b/packages/cypress/cypress/plugins/index.js @@ -0,0 +1,22 @@ +/// +// *********************************************************** +// 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 +} diff --git a/packages/cypress/cypress/support/commands.js b/packages/cypress/cypress/support/commands.js new file mode 100644 index 000000000..3e0d1e5e4 --- /dev/null +++ b/packages/cypress/cypress/support/commands.js @@ -0,0 +1,16 @@ + +import '@testing-library/cypress/add-commands'; + +Cypress.Commands.add('login', (email, password) => { + cy.session([email, password], () => { + cy.visit('/email-login') + + cy.get('input[name=email]').type(email) + cy.get('input[name=password]').type(password) + + cy.get('form').submit() + + cy.getCookie('auth').should('exist') + cy.location('pathname').should('include', '/home') + }) +}) \ No newline at end of file diff --git a/packages/cypress/cypress/support/index.js b/packages/cypress/cypress/support/index.js new file mode 100644 index 000000000..d68db96df --- /dev/null +++ b/packages/cypress/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') diff --git a/packages/cypress/package.json b/packages/cypress/package.json new file mode 100644 index 000000000..bf9984da8 --- /dev/null +++ b/packages/cypress/package.json @@ -0,0 +1,14 @@ +{ + "name": "@omnivore/cypress", + "version": "1.0.0", + "private": true, + "scripts": {}, + "dependencies": { + "cypress": "^9.5.3" + }, + "devDependencies": {}, + "volta": { + "node": "14.18.0", + "yarn": "1.22.10" + } +} diff --git a/packages/cypress/tsconfig.json b/packages/cypress/tsconfig.json new file mode 100644 index 000000000..64d5521e0 --- /dev/null +++ b/packages/cypress/tsconfig.json @@ -0,0 +1,21 @@ +{ + "compilerOptions": { + "target": "es5", + "lib": ["dom", "dom.iterable", "esnext"], + "allowJs": true, + "skipLibCheck": true, + "strict": true, + "forceConsistentCasingInFileNames": true, + "noEmit": true, + "esModuleInterop": true, + "module": "esnext", + "moduleResolution": "node", + "resolveJsonModule": true, + "isolatedModules": true, + "jsx": "preserve", + "types": ["node", "jest", "@testing-library/jest-dom"], + "incremental": true + }, + "include": ["additional.d.ts", "next-env.d.ts", "**/*.ts", "**/*.tsx"], + "exclude": ["node_modules"] +}