Public release test refactoring (#259)

* update test ctx type * completely refactor transaction-vew testing - more iterations remain here * only expose testData routes in test and dev envs * refactor transaction seed data generation * update latest seed generations * remove gitignore for .env files; add .env * disable import first * include scripts folder in typescript checks * fix import for bcryptjs * remove temporary transactions.json * refactor transaction test seed generation * update transaction seed generation types * remove code-coverage while refactoring * add fetch:data task for getting remote seeds * update all data seeds with latest faker generation * latest test data initialization refactoring * move all backend, data, models and utils out of /src since CRA has issues with filesystem bundling * convert database methods to use single lowdb FileSync init * move backend tests under /src so that jest sees them * update transaction view tests * update to seed database via endpoint * update to cypress 4.4.1 * update transaction seed generation * update data seeds * add types for fetch:testData task * refactor and fix transaction-view tests * spy on routes before visitations * Generate complete database seed; cleanup unused scripts (#277) * remove transactions.json * initial generateSeedData * wip - update seed script * wip - begin generating overall database; setup test and database type * wip - save generate contacts progress * smaller user set for testing * set contacts in over * wip - iterate on generating contacts * wip - iterate on generating contacts * wip - iterate on generating contacts * wip - iterate on generating contacts * fix generate seed tests * add bank accounts to generated seed * add full shape of database object * remove old transaction code * wip - add recent transaction code and update * wip - add recent transaction code and update * transaction code and updates * finalize generating transactions with tests and calcualtions with updates to env * implement and test seed likes * implement and test seed comments * implement and test notifications * add type * cleanup * add db:seed to refresh all seeds and databases * generate fresh databases and seeds * migrate fetch:testData to find:testData and filter:testData * update transaction view spec to use find:testData and filter:testData * remove scripts no longer needed * search contacts by first and last name as well * add Transaction typing to task return * use filter:testData task instead of users fixtures * refactor new payment test to use dyanamic data * refactor contact search list tests * update comment * refactor new transaction tests * refactor auth spec * update but skip notification view tests * fix user settings tests * fix bank accounts view tests * pushing up wip * Test refactors fix unit tests (#278) * break out generation functions into seedDataUtils for use in tests * update to use generate variables * wip - updating transaction tests * wip - updating transaction tests * fix remaining unit tests * refactor api-bankaccounts spec * update cypress orb * upgrade to cypress/base:13.6.0 image * use proper orb executor name and tag * use a documented orb executor * revert back executor * enable parallelism on 2 machines * revert circle config * add default password as a env var * add data test tag to signup link in signin page * refactor authentication custom commands * try out new ui login command in auth tests * expose transaction xstate services to cypress * disable typescript cypress preprocessor * add pagination and default password env vars * give cypress access to necessary env vars * use env var for pagination limit * update commentary on bankaccount empty state test * refactor ui login command * add nextTransactionFeedPage command * improve authentication tests * expose date range handler to cypress * refactor transaction feeds tests * use custom pickDateRange command * assert transaction results after clearing date filter * add dom snapshot logging to custom commands * remove stale test * try out chai-datetime plugin * update transaction feed test organization * add custom message to date range within assertion * Api and notifications seed updates (#283) * break out generation functions into seedDataUtils for use in tests * update to use generate variables * wip - updating transaction tests * wip - updating transaction tests * fix remaining unit tests * refactor api-bankaccounts spec * fix bank transfers api tests; skip temporarily * update api comment tests * update contacts api tests * update likes api tests * refactor api notifications tests * fix * generate and test seed bank transfers * update api transactions tests * wip - update api users specs * update notification generation * unskip tests * generate new seeds and databases * wip - update notification specs * improve loginByXstate command to await authService intialization * upgrade to cypress 4.5.0 * disable no-unused-expressions eslint rule * add custom message to auth service assertion * add initial types for services added to window * update bank account data seed isDeleted to not be randomized * update data seed * latest review of the transaction feed with new seed * fix current notifications tests * fix current bank account tests * install date-fns 2.x * update to use date-fns 2.x functions * add custom startOfDayUTC and endOfDayUTC functions to correctly adjust range to fix date range test * remove only * fix failing api users specs * update count expectations; skip failing tests for now * update spec to trigger amount range slider * update fake amount to be min of $10 and max of $1000 * generate new database for updated transaction amounts * finalize amount range filter test adding filtered transactions route * remove only * fix transaction feeds spec * add custom waitForXstateSerice command * push wip * update logic to create correct comment and like notifications * Test refactors CI updates (#284) * update circleci for multiple builds * update with cypress install and post step commands * use yarn * comment out unit test run * update name of ci job * update payment and request variations count in totalTransactions calculation * skip incomplete tests since no longer generating those in seed data * uncomment CI unit test run * remove only * skip test dealing with incomplete transactions since not generating those in seed * fix likes and comments routes and tests * fix seed data likes and comments to remove undefines * skip unit tests temporarly * enable parallelism * reorganize tests under cypress/tests directory * change integrationfolder to be cypress/tests * update ci config for cross-browser testing * quote group names in ci config * fix ci config indentation * parallelize firefox over 4 machines * improve dynamic generation of tests for transaction feed * add temporary wait for xstate service * improve loginByXstate logging and snapshotting * use custom executor for cypress/install step * update CI config * refactor custom command logging * 🐻 only you can prevent flake 🌳 * remove unused handler * add data-test tag to transaction amount element * add component and setTransactionAmountRange commands * remove assertion log for waitForXstateService * improve snapshotting of custom commands * refactor ancillary tests for improved mobile testing * improve pagination testing under mobile viewport * fix and refactor transaction amount range filtering tests * improve command log snapshotting * add dedicated mobile cypress config * add error checking to component command for testing CI * disable autoEnd for pickDateRange command log * test returning domFiber over domFiber._debugOwner * cleanup; return stateNode in production * update domFiber return * cleanup * refactor component command * Test refactors form permutations (#285) * implement and test bank account form errors * implement and test user settings form errors * update bank account form error display * reorder field in test * implement and test new transaction errors * temporarily skip notifications tests * add more granular data-test tags to transaction item elements * add minimum mobile viewport width as env var * clean up support file * change getTest and getTestLike arg to “selector” * latest refactoring of transaction-feeds * improve transaction item within feeds testing * refactor getTest to getBySel * add create transaction button to all feed views * reduce transaction fake amount max to $500 * clean up transaction view spec * update set amount range command to scroll date picker into view * add more tests to transaction feed specs * make random contacts unique in seed * update data seeds * fix transaction feed tests * implement notification scenarios between users * update seed notifications; generate new database seed * update notification wait * increase random user contacts list then slice what is needed; generate new database seed * enable unit tests in ci * generate new seed; update test to be greater than or equal * enable code coverage again * increase like sample size; generate new seed * updates to use latest start-server-and-test api * update dependencies * set prettier line length (width) to 120 characters and ignore data directory for formatting * run codebase through prettier (npx prettier --write .) * additional dependency updates * remove stale fixtures * add public transaction fixture * add api url to dotenv * refactor testData tasks to accept an array of attrs * update prettier print width * refactor transaction feed tests * prettier rewrite * fix api testdata spec * fix new transaction test * add temporary fix for awaiting auth service * renable new transaction suite * refactoring notifications spec * skip generate seed tests * disable code coverage * fix notification test * initialize user balance to 0 if not provided * add wait to spec * update seeds to give first user higher balance * set minimum balance for user to $100 in seed * fix notifications spec * investigating flake 🕵🏻‍♂️ * await new user profile data after creating new transaction * only request/set userProfile for refresh action * add cy.switchUser command * add more test cases to notification spec * refactor more tests to use cy.switchUser * re-enable new transaction suite * add findTestData and filterTestData commands * fix failing new transaction test * investigating only-ci failing test * add cy.database command remove stale commands * cleanup custom command logging * update before each data fetching in new transaction * clean up route spying in user settings spec * update dependencies * install json package and add list:dev:users command * test out refreshUser and create transaction race condition issue * remove setTimeout; use xstate delay for refresh * increase refresh user delay * refactor authMachine to be initialized after declaration vs in component tree * add cy.wait and wait for xstate service to logout command * expose authService outside of component * send user after login * refactors to authMachine and xstate commands * fix auth spec * add mobile testing npm scripts * add mobile testing ci job * update logout button data-test tag * reset user on unauthorized * fix auth guard issues * add isMobileViewport as config env var * update tests for better mobile support * add data-test tag to alertbar * failure redirect to public url / signin; remove redirect * cleanup * test for alert bar success * update authMachine to throw error on signin error * validate success message * update /login not to redirect on failure * set error message in authMachine * add error alert to signin form and test * make server unit tests a distinct ci job * change unit test job name * add circle config comments and firefox mobile job * name cypress/install job "setup" * update requires job name * fix firefox mobile tests * add codesandbox config for testing * trying to fix mobile flakiness * fixing firefox mobile flake Co-authored-by: Kevin Old <[email protected]> Co-authored-by: Kevin Old <[email protected]>
cypress-io · May 8, 2020 · 32f1442 · 32f1442
1 parent d59de0c
commit 32f1442
Show file tree

Hide file tree

Showing 159 changed files with 48,111 additions and 14,062 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -1,16 +1,105 @@
 version: 2.1
 orbs:
-  cypress: cypress-io/cypress@1.19.1
+  cypress: cypress-io/cypress@1.20.0
 workflows:
   build:
     jobs:
+      # Setup
+      #  1. Install Cypress
+      #  2. Build application
+      #  3. Validate types
+      #  4. Run server unit-tests
+      - cypress/install:
+          name: "Setup"
+          yarn: true
+          executor: cypress/browsers-chrome78-ff70
+          build: "npm run build"
+          post-steps:
+            - run:
+                name: Check Types
+                command: yarn types
+            - run:
+                name: Unit Tests
+                command: yarn test:unit
+
+      # Run API tests against backend server
       - cypress/run:
-          build: yarn build
-          executor: cypress/base-12-14-0
+          name: "API Tests"
+          requires:
+            - Setup
+          executor: cypress/browsers-chrome78-ff70
+          browser: chrome
           yarn: true
           start: yarn test:ci
           wait-on: "http://localhost:3000"
           record: true
-          post-steps:
-            # run jest tests
-            - run: yarn test:unit
+          spec: cypress/tests/api/*
+          parallel: true
+          parallelism: 4
+          group: API
+
+      # Run E2E tests in Chrome
+      - cypress/run:
+          name: "UI Tests - Chrome"
+          requires:
+            - Setup
+          executor: cypress/browsers-chrome78-ff70
+          browser: chrome
+          yarn: true
+          start: yarn test:ci
+          wait-on: "http://localhost:3000"
+          record: true
+          parallel: true
+          parallelism: 4
+          spec: cypress/tests/ui/*
+          group: "UI - Chrome"
+
+      # Run E2E tests in Chrome with mobile device viewport
+      - cypress/run:
+          name: "UI Tests - Chrome - Mobile"
+          requires:
+            - Setup
+          executor: cypress/browsers-chrome78-ff70
+          browser: chrome
+          yarn: true
+          start: yarn test:ci
+          wait-on: "http://localhost:3000"
+          record: true
+          parallel: true
+          parallelism: 4
+          spec: cypress/tests/ui/*
+          config-file: mobile-cypress.json
+          group: "UI - Chrome - Mobile"
+
+      # Run E2E tests in Firefox
+      - cypress/run:
+          name: "UI Tests - Firefox"
+          requires:
+            - Setup
+          executor: cypress/browsers-chrome78-ff70
+          browser: firefox
+          yarn: true
+          start: yarn test:ci
+          wait-on: "http://localhost:3000"
+          record: true
+          parallel: true
+          parallelism: 4
+          spec: cypress/tests/ui/*
+          group: "UI - Firefox"
+
+      # Run E2E tests in Firefox with mobile device viewport
+      - cypress/run:
+          name: "UI Tests - Firefox - Mobile"
+          requires:
+            - Setup
+          executor: cypress/browsers-chrome78-ff70
+          browser: firefox
+          yarn: true
+          start: yarn test:ci
+          wait-on: "http://localhost:3000"
+          record: true
+          parallel: true
+          parallelism: 4
+          spec: cypress/tests/ui/*
+          config-file: mobile-cypress.json
+          group: "UI - Firefox - Mobile"
diff --git a/.env b/.env
@@ -0,0 +1,14 @@
+SEED_USERBASE_SIZE=5
+SEED_CONTACTS_PER_USER=3
+SEED_PAYMENTS_PER_USER=15
+SEED_REQUESTS_PER_USER=10
+SEED_BANK_ACCOUNTS_PER_USER=1
+SEED_LIKES_PER_USER=2
+SEED_COMMENTS_PER_USER=2
+SEED_NOTIFICATIONS_PER_USER=5
+SEED_BANK_TRANSFERS_PER_USER=5
+SEED_DEFAULT_USER_PASSWORD=s3cret
+PAGINATION_PAGE_SIZE=10
+MOBILE_VIEWPORT_WIDTH=414
+BASE_API_URL=http://localhost:3001
+
diff --git a/.gitignore b/.gitignore
@@ -14,11 +14,6 @@
 # misc
 .DS_Store
 .idea
-.env*
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
 
 npm-debug.log*
 yarn-debug.log*

diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1,3 @@
+data
+build
+coverage
diff --git a/.prettierrc b/.prettierrc
@@ -1,3 +1,4 @@
 {
-  "trailingComma": "es5"
+  "trailingComma": "es5",
+  "printWidth": 100
 }
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,3 +1,3 @@
 {
-    "typescript.tsdk": "node_modules/typescript/lib"
-}
+  "typescript.tsdk": "node_modules/typescript/lib"
+}
diff --git a/README.md b/README.md
@@ -33,7 +33,7 @@ yarn dev
 
 ### Database
 
-The database is located in [src/data/database.json](./src/data/database.json) and is [reseeded](./src/data/dev-seed.json) each time the application is started.
+The database is located in [data/database.json](./data/database.json) and is [reseeded](./data/dev-seed.json) each time the application is started.
 
 It provides several existing users with the password of `s3cret`.
 
@@ -44,4 +44,3 @@ It provides several existing users with the password of `s3cret`.
 <p style='color: "#3f51b5"' align="center">
   <img width="100" style='color: "#3f51b5"' alt="Cypress Logo" src="./src/svgs/cypress-logo.svg" />
 </p>
-
diff --git a/src/app.ts → backend/app.ts b/src/app.ts → backend/app.ts
@@ -1,5 +1,3 @@
-//require("dotenv").config();
-
 import express from "express";
 import path from "path";
 import logger from "morgan";
@@ -9,16 +7,18 @@ import bodyParser from "body-parser";
 import cors from "cors";
 import paginate from "express-paginate";
 
-import auth from "./backend/auth";
-import userRoutes from "./backend/user-routes";
-import contactRoutes from "./backend/contact-routes";
-import bankAccountRoutes from "./backend/bankaccount-routes";
-import transactionRoutes from "./backend/transaction-routes";
-import likeRoutes from "./backend/like-routes";
-import commentRoutes from "./backend/comment-routes";
-import notificationRoutes from "./backend/notification-routes";
-import bankTransferRoutes from "./backend/banktransfer-routes";
-import testDataRoutes from "./backend/testdata-routes";
+import auth from "./auth";
+import userRoutes from "./user-routes";
+import contactRoutes from "./contact-routes";
+import bankAccountRoutes from "./bankaccount-routes";
+import transactionRoutes from "./transaction-routes";
+import likeRoutes from "./like-routes";
+import commentRoutes from "./comment-routes";
+import notificationRoutes from "./notification-routes";
+import bankTransferRoutes from "./banktransfer-routes";
+import testDataRoutes from "./testdata-routes";
+
+require("dotenv").config();
 
 const corsOption = {
   origin: "http://localhost:3000",
@@ -43,7 +43,7 @@ app.use(
 app.use(passport.initialize());
 app.use(passport.session());
 
-app.use(paginate.middleware(10, 50));
+app.use(paginate.middleware(+process.env.PAGINATION_PAGE_SIZE!));
 
 app.use(auth);
 app.use("/users", userRoutes);
@@ -54,7 +54,10 @@ app.use("/likes", likeRoutes);
 app.use("/comments", commentRoutes);
 app.use("/notifications", notificationRoutes);
 app.use("/bankTransfers", bankTransferRoutes);
-app.use("/testData", testDataRoutes);
+
+if (process.env.NODE_ENV === "test" || process.env.NODE_ENV === "development") {
+  app.use("/testData", testDataRoutes);
+}
 
 app.use(express.static(path.join(__dirname, "../public")));
 

diff --git a/src/backend/auth.ts → backend/auth.ts b/src/backend/auth.ts → backend/auth.ts
@@ -1,18 +1,15 @@
+import bcrypt from "bcryptjs";
 import passport from "passport";
 import express, { Request, Response } from "express";
-import bcrypt from "bcryptjs";
+import { User } from "../src/models/user";
 import { getUserBy, getUserById } from "./database";
-import { User } from "../models/user";
+
 const LocalStrategy = require("passport-local").Strategy;
 const router = express.Router();
 
 // configure passport for local strategy
 passport.use(
-  new LocalStrategy(function (
-    username: string,
-    password: string,
-    done: Function
-  ) {
+  new LocalStrategy(function (username: string, password: string, done: Function) {
     const user = getUserBy("username", username);
 
     const failureMessage = "Incorrect username or password.";
@@ -35,27 +32,19 @@ passport.serializeUser(function (user: User, done) {
 
 passport.deserializeUser(function (id: string, done) {
   const user = getUserById(id);
-  // TODO: Limit fields returned in deserialized user object?
-  //.pick(["id", "firstName", "lastName"])
-
   done(null, user);
 });
 
 // authentication routes
-router.post(
-  "/login",
-  passport.authenticate("local", {
-    failureRedirect: "/",
-  }),
-  (req: Request, res: Response): void => {
-    if (req.body.remember) {
-      req.session!.cookie.maxAge = 24 * 60 * 60 * 1000 * 30; // Expire in 30 days
-    } else {
-      req.session!.cookie.expires = false;
-    }
-    res.redirect(200, "/");
+router.post("/login", passport.authenticate("local"), (req: Request, res: Response): void => {
+  if (req.body.remember) {
+    req.session!.cookie.maxAge = 24 * 60 * 60 * 1000 * 30; // Expire in 30 days
+  } else {
+    req.session!.cookie.expires = false;
   }
-);
+
+  res.send({ user: req.user });
+});
 
 router.post("/logout", (req: Request, res: Response): void => {
   res.clearCookie("connect.sid");
@@ -68,7 +57,7 @@ router.post("/logout", (req: Request, res: Response): void => {
 
 router.get("/checkAuth", (req, res) => {
   if (!req.user) {
-    res.status(401).json({ error: "User is unauthorised" });
+    res.status(401).json({ error: "User is unauthorized" });
   } else {
     res.status(200).json({ user: req.user });
   }

diff --git a/src/backend/bankaccount-routes.ts → backend/bankaccount-routes.ts b/src/backend/bankaccount-routes.ts → backend/bankaccount-routes.ts
@@ -38,17 +38,12 @@ router.get(
 );
 
 //POST /bankAccounts (scoped-user)
-router.post(
-  "/",
-  ensureAuthenticated,
-  validateMiddleware(isBankAccountValidator),
-  (req, res) => {
-    const account = createBankAccountForUser(req.user?.id!, req.body);
+router.post("/", ensureAuthenticated, validateMiddleware(isBankAccountValidator), (req, res) => {
+  const account = createBankAccountForUser(req.user?.id!, req.body);
 
-    res.status(200);
-    res.json({ account });
-  }
-);
+  res.status(200);
+  res.json({ account });
+});
 
 //DELETE (soft) /bankAccounts (scoped-user)
 router.delete(

diff --git a/src/backend/banktransfer-routes.ts → backend/banktransfer-routes.ts b/src/backend/banktransfer-routes.ts → backend/banktransfer-routes.ts
diff --git a/src/backend/comment-routes.ts → backend/comment-routes.ts b/src/backend/comment-routes.ts → backend/comment-routes.ts
@@ -1,7 +1,7 @@
 ///<reference path="types.ts" />
 
 import express from "express";
-import { getCommentsByTransactionId, createComment } from "./database";
+import { getCommentsByTransactionId, createComments } from "./database";
 import { ensureAuthenticated, validateMiddleware } from "./helpers";
 import { shortIdValidation, isCommentValidator } from "./validators";
 const router = express.Router();
@@ -31,10 +31,9 @@ router.post(
     const { transactionId } = req.params;
     const { content } = req.body;
 
-    const comment = createComment(req.user?.id!, transactionId, content);
+    createComments(req.user?.id!, transactionId, content);
 
-    res.status(200);
-    res.json({ comment });
+    res.sendStatus(200);
   }
 );
 

diff --git a/src/backend/contact-routes.ts → backend/contact-routes.ts b/src/backend/contact-routes.ts → backend/contact-routes.ts
@@ -2,11 +2,7 @@
 
 import express from "express";
 
-import {
-  getContactsByUsername,
-  removeContactById,
-  createContactForUser,
-} from "./database";
+import { getContactsByUsername, removeContactById, createContactForUser } from "./database";
 import { ensureAuthenticated, validateMiddleware } from "./helpers";
 import { shortIdValidation } from "./validators";
 const router = express.Router();