📦 v0.2.0

README.md

@@ -5,7 +5,9 @@
 
 <div align="center">
 
+[![NPM Version][npm-image]][npm-url]
 [![Build Status][travis]][travis]
+[![Coverage Status][coverage-badge]][coverage-link]
 
 </div>
 
@@ -44,6 +46,6 @@ A game about space and junk.
 [npm-downloads]: https://img.shields.io/npm/dt/hermes-gaame.svg
 [npm-url]: https://www.npmjs.com/package/hermes-gaame
 [size-image]: https://img.shields.io/bundlephobia/minzip/hermes-game.svg
-[coverage-badge]: https://coveralls.io/repos/github/alexlee-dev/hermes/badge.svg?branch=master
+[coverage-badge]: https://coveralls.io/repos/github/alexlee-dev/hermes/badge.svg?branch=develop
 [coverage-link]: https://coveralls.io/github/alexlee-dev/hermes?branch=master
 [travis]: https://travis-ci.org/alexlee-dev/hermes.svg?branch=master

package.json

@@ -34,16 +34,22 @@
     "uuid": "^3.3.3"
   },
   "devDependencies": {
+    "@testing-library/dom": "^6.1.0",
+    "@testing-library/react": "^9.1.3",
     "coveralls": "^3.0.6",
     "enzyme": "^3.10.0",
-    "enzyme-adapter-react-16": "^1.14.0"
+    "enzyme-adapter-react-16": "^1.14.0",
+    "jsdom": "^15.1.1",
+    "jsdom-global": "^3.0.2",
+    "redux-mock-store": "^1.5.3"
   },
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
     "eject": "react-scripts eject",
     "test": "react-scripts test",
-    "test:coveralls": "jest --coverage --collectCoverageFrom=src/**/* --coverageReporters=text-lcov | coveralls"
+    "test:coverage": "yarn test --coverage --watchAll=false --collectCoverageFrom=src/components/**/* --collectCoverageFrom=src/views/**/*",
+    "test:coveralls": "yarn test --coverage --watchAll=false --collectCoverageFrom=src/components/**/* --collectCoverageFrom=src/views/**/* --coverageReporters=text-lcov | coveralls"
   },
   "eslintConfig": {
     "extends": "react-app"

src/__tests__/App.test.js

@@ -1,5 +1,14 @@
-describe('Fake Test', () => {
-  it('Should pass.', () => {
-    expect(1 + 1).toBe(2)
+import React from 'react'
+import { customRender } from '../test-utils'
+import App from '../App'
+
+jest.mock('../components/ItemTimer', () => {
+  return () => <span>MockedTime</span>
+})
+
+describe('<App />', () => {
+  it('Should render the <App /> component.', () => {
+    const container = customRender({ component: App })
+    expect(container.asFragment()).toMatchSnapshot()
   })
 })

src/__tests__/__snapshots__/App.test.js.snap

@@ -0,0 +1,100 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<App /> Should render the <App /> component. 1`] = `
+<DocumentFragment>
+  <div
+    class="StyledBox-sc-13pk1d4-0 cXRmiT"
+  >
+    <h1
+      class="StyledHeading-sc-1rdh4aw-0 rfVJR"
+    >
+      Hermes
+    </h1>
+    <span>
+      MockedTime
+    </span>
+    <div
+      class="StyledBox-sc-13pk1d4-0 CAsMy"
+    >
+      <h2
+        class="StyledHeading-sc-1rdh4aw-0 gBloPj"
+      >
+        Cash:
+      </h2>
+      <span
+        class="StyledText-sc-1sadyjn-0 fWSbXS"
+      >
+        100
+      </span>
+    </div>
+    <div
+      class="StyledBox-sc-13pk1d4-0 dfMVfp"
+    >
+      <select
+        data-testid="view-selector"
+      >
+        <option>
+          Ship
+        </option>
+        <option>
+          Planets
+        </option>
+      </select>
+    </div>
+    <div>
+      <h2>
+        Your Ship
+      </h2>
+      <h3>
+        Cargo
+      </h3>
+      <div
+        class="StyledBox-sc-13pk1d4-0 IRSNj"
+      >
+        <span
+          class="StyledText-sc-1sadyjn-0 bnqisW"
+        >
+          Volume Remaining:
+        </span>
+        <span
+          class="StyledText-sc-1sadyjn-0 fWSbXS"
+        >
+          5
+        </span>
+      </div>
+      <h3>
+        Location:
+      </h3>
+      <div
+        class="StyledBox-sc-13pk1d4-0 MmWcm"
+      >
+        <span
+          class="StyledText-sc-1sadyjn-0 isVaoK"
+        >
+          Value:
+        </span>
+        <div
+          class="StyledBox__StyledBoxGap-sc-13pk1d4-1 hPsznL"
+        />
+        <span
+          class="StyledText-sc-1sadyjn-0 gNZQxf"
+        />
+        <div
+          class="StyledBox__StyledBoxGap-sc-13pk1d4-1 hPsznL"
+        />
+        <span
+          class="StyledText-sc-1sadyjn-0 isVaoK"
+        >
+          Name:
+        </span>
+        <div
+          class="StyledBox__StyledBoxGap-sc-13pk1d4-1 hPsznL"
+        />
+        <span
+          class="StyledText-sc-1sadyjn-0 gNZQxf"
+        />
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;

src/__tests__/components/CashDisplay.test.js

@@ -0,0 +1,9 @@
+import { customRender } from '../../test-utils'
+import CashDisplay from '../../components/CashDisplay'
+
+describe('<CashDisplay />', () => {
+  it('Should render the <CashDisplay /> component.', () => {
+    const container = customRender({ component: CashDisplay })
+    expect(container.asFragment()).toMatchSnapshot()
+  })
+})

src/__tests__/components/ItemTimer.test.js

@@ -0,0 +1,17 @@
+import { customRender } from '../../test-utils'
+import ItemTimer from '../../components/ItemTimer'
+
+jest.mock('../../util', () => {
+  const moment = require('moment')
+  const mockCreateDuration = () => moment.duration({ minutes: 60, seconds: 0 })
+  return {
+    createDuration: mockCreateDuration
+  }
+})
+
+describe('<ItemTimer />', () => {
+  it('Should render the <ItemTimer /> component.', () => {
+    const container = customRender({ component: ItemTimer })
+    expect(container.asFragment()).toMatchSnapshot()
+  })
+})

src/__tests__/components/Title.test.js

@@ -0,0 +1,9 @@
+import Title from '../../components/Title'
+import { customRender } from '../../test-utils'
+
+describe('<Title />', () => {
+  it('Should render the <Title /> component.', () => {
+    const container = customRender({ component: Title })
+    expect(container.asFragment()).toMatchSnapshot()
+  })
+})

src/__tests__/components/ViewSelector.test.js

@@ -0,0 +1,20 @@
+import { fireEvent, waitForElement } from '@testing-library/react'
+import { customRender } from '../../test-utils'
+import ViewSelector from '../../components/ViewSelector'
+
+describe('<ViewSelector />', () => {
+  it('Should render the <ViewSelector /> component.', () => {
+    const container = customRender({ component: ViewSelector })
+    expect(container.asFragment()).toMatchSnapshot()
+  })
+
+  it('Should handle changing the ViewSelector.', async () => {
+    const { getByTestId } = customRender({ component: ViewSelector })
+
+    const selector = await waitForElement(() => getByTestId('view-selector'))
+
+    expect(getByTestId('view-selector').value).toBe('Ship')
+    fireEvent.change(selector, { target: { value: 'Planets' } })
+    expect(getByTestId('view-selector').value).toBe('Planets')
+  })
+})

src/__tests__/components/__snapshots__/CashDisplay.test.js.snap

@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<CashDisplay /> Should render the <CashDisplay /> component. 1`] = `
+<DocumentFragment>
+  <div
+    class="StyledBox-sc-13pk1d4-0 CAsMy"
+  >
+    <h2
+      class="StyledHeading-sc-1rdh4aw-0 gBloPj"
+    >
+      Cash:
+    </h2>
+    <span
+      class="StyledText-sc-1sadyjn-0 fWSbXS"
+    >
+      100
+    </span>
+  </div>
+</DocumentFragment>
+`;

src/__tests__/components/__snapshots__/ItemTimer.test.js.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<ItemTimer /> Should render the <ItemTimer /> component. 1`] = `
+<DocumentFragment>
+  <span>
+    0 minutes 0 seconds
+  </span>
+</DocumentFragment>
+`;

src/__tests__/components/__snapshots__/Title.test.js.snap

@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Title /> Should render the <Title /> component. 1`] = `
+<DocumentFragment>
+  <h1
+    class="StyledHeading-sc-1rdh4aw-0 rfVJR"
+  >
+    Hermes
+  </h1>
+</DocumentFragment>
+`;

src/__tests__/components/__snapshots__/ViewSelector.test.js.snap

@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<ViewSelector /> Should render the <ViewSelector /> component. 1`] = `
+<DocumentFragment>
+  <div
+    class="StyledBox-sc-13pk1d4-0 dfMVfp"
+  >
+    <select
+      data-testid="view-selector"
+    >
+      <option>
+        Ship
+      </option>
+      <option>
+        Planets
+      </option>
+    </select>
+  </div>
+</DocumentFragment>
+`;