feat(network-status): add tests to NetworkStatus component

src/__tests__/components/network-status/NetworkStatusMessage.test.tsx

@@ -0,0 +1,23 @@
+import { render, shallow } from 'enzyme'
+import React from 'react'
+
+import {
+  NetworkStatusMessage,
+  OFFLINE_MESSAGE,
+  ONLINE_MESSAGE,
+} from '../../../components/network-status/NetworkStatusMessage'
+
+describe('NetworkStatusMessage', () => {
+  it('returns null if the app has always been online', () => {
+    const wrapper = shallow(<NetworkStatusMessage online wasOffline={false} />)
+    expect(wrapper.equals(null as any)).toBe(true)
+  })
+  it(`shows the message "${OFFLINE_MESSAGE}" if the app goes offline`, () => {
+    const wrapper = render(<NetworkStatusMessage online={false} wasOffline={false} />)
+    expect(wrapper.text()).toContain(OFFLINE_MESSAGE)
+  })
+  it(`shows the message "${ONLINE_MESSAGE}" if the app goes back online after it was offline`, () => {
+    const wrapper = render(<NetworkStatusMessage online wasOffline />)
+    expect(wrapper.text()).toContain(ONLINE_MESSAGE)
+  })
+})

src/components/network-status/NetworkStatusMessage.tsx

@@ -1,14 +1,14 @@
 import React, { useState } from 'react'
 
-import './styles.css'
+// import './styles.css'
 
 interface Props {
   online: boolean
   wasOffline: boolean
 }
 
-const OFFLINE_MESSAGE = 'you are working in offline mode'
-const ONLINE_MESSAGE = 'you are back online'
+export const OFFLINE_MESSAGE = 'you are working in offline mode'
+export const ONLINE_MESSAGE = 'you are back online'
 const OPACITY_TRANSITION_TIME = 4000
 
 export const NetworkStatusMessage = (props: Props) => {