more tests

src/components/atoms/Exif.test.tsx

@@ -1,6 +1,5 @@
 import React from 'react'
-// import { render } from '@testing-library/react'
+import { render } from '@testing-library/react'
-import testRender from '../../../jest/testRender'
 
 import Exif from './Exif'
 
@@ -12,9 +11,13 @@ const exif = {
   focalLength: '200',
   lensModel: 'Hello',
   exposure: '200',
-  gps: { latitude: '52.4792516', longitude: '13.431609' }
+  gps: { latitude: '41.89007222222222', longitude: '12.491516666666666' }
 }
 
 describe('Exif', () => {
-  testRender(<Exif exif={exif} />)
+  it('renders without crashing', () => {
+    const { container } = render(<Exif exif={exif} />)
+
+    expect(container.firstChild).toBeInTheDocument()
+  })
 })

src/components/atoms/Exif.tsx

@@ -19,8 +19,6 @@ interface ExifProps {
 export default function Exif({ exif }: { exif: ExifProps }) {
   const { iso, model, fstop, shutterspeed, focalLength, exposure, gps } = exif
 
-  // iPhone lenses
-
   return (
     <aside className={styles.exif}>
       <div className={styles.data}>
@@ -32,7 +30,9 @@ export default function Exif({ exif }: { exif: ExifProps }) {
         {iso && <span title="ISO">{iso}</span>}
       </div>
       {gps.latitude && (
-        <div className={styles.map}>{gps && <ExifMap gps={gps} />}</div>
+        <div className={styles.map}>
+          <ExifMap gps={gps} />
+        </div>
       )}
     </aside>
   )

src/components/atoms/ExifMap.tsx

@@ -25,7 +25,7 @@ const providers = {
   // },
   // wikimedia: (x, y, z) =>
   //   `https://maps.wikimedia.org/osm-intl/${z}/${x}/${y}${retina}.png`,
-  // stamen: (x, y, z) =>
+  // stamen: (x: string, y: string, z: string) =>
   //   `https://stamen-tiles.a.ssl.fastly.net/terrain/${z}/${x}/${y}${retina}.jpg`,
   // streets: mapbox('streets-v10', MAPBOX_ACCESS_TOKEN),
   // satellite: mapbox('satellite-streets-v10', MAPBOX_ACCESS_TOKEN),

src/components/atoms/Modal.test.tsx

@@ -0,0 +1,23 @@
+import React from 'react'
+import { render } from '@testing-library/react'
+import Modal from './Modal'
+import ReactModal from 'react-modal'
+
+describe('Modal', () => {
+  it('renders without crashing', () => {
+    ReactModal.setAppElement(document.createElement('div'))
+
+    const { rerender } = render(
+      <Modal title="Hello" isOpen handleCloseModal={() => null}>
+        Hello
+      </Modal>
+    )
+    expect(document.querySelector('.ReactModalPortal')).toBeInTheDocument()
+
+    rerender(
+      <Modal isOpen={false} handleCloseModal={() => null}>
+        Hello
+      </Modal>
+    )
+  })
+})

src/components/atoms/Modal.tsx

@@ -1,9 +1,9 @@
-import React, { ReactChildren } from 'react'
+import React from 'react'
 import ReactModal from 'react-modal'
 
 import styles from './Modal.module.scss'
 
-ReactModal.setAppElement('#___gatsby')
+if (process.env.NODE_ENV !== 'test') ReactModal.setAppElement('#___gatsby')
 
 export default function Modal({
   title,
@@ -14,8 +14,8 @@ export default function Modal({
 }: {
   title?: string
   isOpen?: boolean
-  handleCloseModal: any
+  handleCloseModal(): void
-  children: ReactChildren
+  children: any
 }) {
   if (!isOpen) return null
 

src/components/atoms/Qr.test.tsx

@@ -0,0 +1,12 @@
+import React from 'react'
+import { render, fireEvent, wait } from '@testing-library/react'
+
+import Qr from './Qr'
+
+describe('Qr', () => {
+  it('renders without crashing', async () => {
+    const { container } = render(<Qr address="xxx" />)
+    expect(container.firstChild).toBeInTheDocument()
+    fireEvent.click(container.querySelector('button'))
+  })
+})