Adding jest setup and basic tests.

.jest/setEnvVars.js

@@ -0,0 +1,2 @@
+process.env.PUBLIC_CLOUD_NAME='testCloudName';
+process.env.PUBLIC_FOLDER_NAME='testFolderName';

__tests__/Home.test.js

@@ -0,0 +1,8 @@
+import { render, screen } from '@testing-library/react';
+import HomePage from '../pages';
+
+describe('Index Page <HomePage />', () => {
+  it('should render', () => {
+    render(<HomePage />);
+  });
+});

__tests__/Nav.test.js

@@ -0,0 +1,15 @@
+import { render, screen } from '@testing-library/react';
+import Nav from '../components/Nav';
+
+const useRouter = jest.spyOn(require('next/router'), 'useRouter');
+
+describe('<Nav/>', () => {
+  it('Renders nav correctly and matches snapshot', () => {
+    const router = { pathname: '/' };
+    useRouter.mockReturnValue(router);
+    const { container, debug } = render(<Nav />);
+    expect(container).toMatchSnapshot();
+    const link = screen.getByText('RSVP');
+    expect(link).toHaveAttribute('href', '/rsvp');
+  });
+});

__tests__/__snapshots__/Nav.test.js.snap

@@ -0,0 +1,46 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Nav/> Renders nav correctly and matches snapshot 1`] = `
+<div>
+  <nav
+    class="NavStyles-sc-vewc8g-0 dWZdml"
+  >
+    <a
+      aria-current="page"
+      href="/"
+    >
+      Home
+    </a>
+    <a
+      href="/story"
+    >
+      Our Story
+    </a>
+    <a
+      href="/party"
+    >
+      Wedding Party
+    </a>
+    <a
+      href="/photos"
+    >
+      Photos
+    </a>
+    <a
+      href="/travelstay"
+    >
+      Travel & Stay
+    </a>
+    <a
+      href="/qanda"
+    >
+      Q + A
+    </a>
+    <a
+      href="/rsvp"
+    >
+      RSVP
+    </a>
+  </nav>
+</div>
+`;

__tests__/buildBase64Data.test.js

@@ -0,0 +1,22 @@
+import buildBase64Data from '../utils/buildBase64Data';
+
+describe('build base 64 function', () => {
+  const imageName = 'https://picsum.photos/1307/880';
+  const alt = 'test alt';
+  it('takes an image name and builds base64 image', async () => {
+    const imageData = await buildBase64Data(false, imageName, alt, {});
+    expect(imageData).toBeDefined();
+    expect(imageData.alt).toEqual(alt);
+    expect(imageData.imageProps).toBeDefined();
+    expect(imageData.imageProps.blurDataURL).toContain(
+      'data:image/jpeg;base64'
+    );
+    expect(imageData.imageProps.height).toBeGreaterThan(0);
+    expect(imageData.imageProps.width).toBeGreaterThan(0);
+    expect(imageData.imageProps.src).toContain(imageName);
+  });
+
+  it('fails if image not resolved', async () => {
+    expect(await buildBase64Data(false, 'Blah', alt, {})).toEqual({});
+  });
+});

__tests__/index.test.js

@@ -0,0 +1,8 @@
+import { render, screen } from '@testing-library/react';
+import Home from '../pages/index';
+
+describe('Home', () => {
+  it('renders home page', () => {
+    render(<Home />);
+  });
+});

jest.setup.js

@@ -0,0 +1,3 @@
+import '@testing-library/jest-dom';
+
+window.alert = console.log;

package.json

@@ -6,7 +6,8 @@
   "scripts": {
     "dev": "NODE_OPTIONS='--inspect' next dev",
     "build": "next build",
-    "start": "next start"
+    "start": "next start",
+    "test": "NODE_ENV=test jest --watch"
   },
   "dependencies": {
     "@plaiceholder/next": "^2.2.0",
@@ -67,6 +68,15 @@
       "react/prop-types": 0
     }
   },
+  "jest": {
+    "testEnvironment": "jsdom",
+    "setupFiles": [
+      "./.jest/setEnvVars.js"
+    ],
+    "setupFilesAfterEnv": [
+      "./jest.setup.js"
+    ]
+  },
   "//": "This is our babel config, I prefer this over a .babelrc file",
   "babel": {
     "plugins": [

pages/index.js

@@ -2,7 +2,6 @@ import styled from 'styled-components';
 import Head from 'next/head';
 import useUser from '../lib/useUser';
 import HomeContent from '../components/HomeContent';
-import connectDb from '../utils/db';
 import Login from '../components/Login';
 import Layout from '../components/Layout';
 import buildBase64Data from '../utils/buildBase64Data';