test cleanups

.github/workflows/test.yml

@@ -29,7 +29,7 @@ jobs:
         uses: actions/cache@v1
         with:
           path: public
-          key: ${{ runner.os }}-public
+          key: ${{ runner.os }}-${{ matrix.node-version }}-public
 
       - run: npm ci
       - run: npm test

src/components/Layout.jsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import posed, { PoseGroup } from 'react-pose'
+import shortid from 'shortid'
 import { fadeIn } from './atoms/Transitions'
 import Typekit from './atoms/Typekit'
 import HostnameCheck from './atoms/HostnameCheck'
@@ -36,9 +37,9 @@ export default function Layout({ children, location }) {
       <Typekit />
       <HostnameCheck allowedHosts={allowedHosts} />
 
-      <PoseGroup animateOnMount={true}>
+      <PoseGroup animateOnMount={process.env.NODE_ENV !== 'test' && true}>
         <RoutesContainer
-          key={location.pathname}
+          key={shortid.generate()}
           delay={timeout}
           delayChildren={timeout}
         >

src/components/Layout.test.jsx

@@ -0,0 +1,15 @@
+import React from 'react'
+import { render } from '@testing-library/react'
+import { createHistory, createMemorySource } from '@reach/router'
+import Layout from './Layout'
+
+describe('Layout', () => {
+  const history = createHistory(createMemorySource('/oceanprotocol'))
+
+  it('renders correctly', () => {
+    const { container } = render(
+      <Layout location={history.location}>Hello</Layout>
+    )
+    expect(container.firstChild).toBeInTheDocument()
+  })
+})

src/components/atoms/Button.test.jsx

@@ -1,21 +0,0 @@
-import React from 'react'
-import { render } from '@testing-library/react'
-
-import Button from './Button'
-
-describe('Button', () => {
-  it('renders correctly', () => {
-    const { container } = render(<Button href="/somewhere">Hello</Button>)
-
-    expect(container.firstChild.nodeName).toBe('A')
-    expect(container.firstChild).toBeInTheDocument()
-  })
-
-  it('renders children', () => {
-    const children = <span>Hello World</span>
-    const { container } = render(<Button href="/children">{children}</Button>)
-
-    expect(container.firstChild.nodeName).toBe('A')
-    expect(container.firstChild).toBeInTheDocument()
-  })
-})

src/components/atoms/ProjectImage.test.jsx

@@ -1,17 +0,0 @@
-import React from 'react'
-import { render } from '@testing-library/react'
-import ProjectImage from './ProjectImage'
-import data from '../../../jest/__fixtures__/projects.json'
-
-describe('ProjectImage', () => {
-  it('renders correctly', () => {
-    const { node } = data.allProjectsYaml.edges[0]
-    const { fluid } = node.img.childImageSharp
-
-    const { container } = render(
-      <ProjectImage fluid={fluid} alt={node.title} />
-    )
-
-    expect(container.firstChild).toBeInTheDocument()
-  })
-})

src/components/atoms/Typekit.jsx

@@ -20,7 +20,7 @@ const TypekitScript = typekitID => (
 const Typekit = () => {
   const { typekitID } = useMeta()
 
-  return typekitID ? (
+  return (
     <Helmet>
       <link rel="preconnect" href="https://typekit.com" />
       <link rel="preconnect" href="https://use.typekit.net" />
@@ -28,7 +28,7 @@ const Typekit = () => {
 
       {TypekitScript(typekitID)}
     </Helmet>
-  ) : null
+  )
 }
 
 export default Typekit

src/components/molecules/ProjectLinks.test.jsx

@@ -1,28 +0,0 @@
-import React from 'react'
-import { render } from '@testing-library/react'
-import ProjectLinks from './ProjectLinks'
-
-describe('ProjectLinks', () => {
-  const links = [
-    {
-      title: 'my project',
-      icon: 'website',
-      url: 'https://hello.com'
-    },
-    {
-      title: 'GitHub',
-      url: 'https://github.com'
-    }
-  ]
-
-  it('renders correctly', () => {
-    const { container, getAllByTestId } = render(<ProjectLinks links={links} />)
-
-    expect(container.firstChild).toBeInTheDocument()
-    expect(getAllByTestId('link')[0].nodeName).toBe('A')
-    expect(getAllByTestId('link')[0].textContent).toBe('my project')
-    expect(getAllByTestId('link')[0].attributes.href.textContent).toBe(
-      'https://hello.com'
-    )
-  })
-})

src/components/molecules/ProjectTechstack.test.jsx

@@ -1,14 +0,0 @@
-import React from 'react'
-import { render } from '@testing-library/react'
-import ProjectTechstack from './ProjectTechstack'
-
-describe('ProjectTechstack', () => {
-  const techstack = ['CSS']
-
-  it('renders correctly', () => {
-    const { container } = render(<ProjectTechstack techstack={techstack} />)
-
-    expect(container.firstChild).toBeInTheDocument()
-    expect(container.querySelector('li').textContent).toBe('CSS')
-  })
-})

src/components/organisms/Footer.test.jsx

@@ -1,10 +0,0 @@
-import React from 'react'
-import { render } from '@testing-library/react'
-import Footer from './Footer'
-
-describe('Footer', () => {
-  it('renders correctly', () => {
-    const { container } = render(<Footer />)
-    expect(container.firstChild).toBeInTheDocument()
-  })
-})