Updating 404 page to use react-testing-library

src/pages/404.test.js

@@ -1,14 +1,19 @@
+jest.mock('components/Metadata', () =>
+  require('__mocks__/component-mock')('components/Metadata'));
+jest.mock('components/Message', () =>
+  require('__mocks__/component-mock')('components/Message'));
+
 import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
 
 import { mockT } from 'i18n';
 import { ErrorPage } from 'pages/404';
 
 describe('Error Page', () => {
   test('rendering', () => {
-    const component = shallow(
+    const { asFragment } = render(
       <ErrorPage t={ mockT } />
     );
-    expect(component).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
 });

src/pages/__snapshots__/404.test.js.snap

@@ -1,19 +1,28 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Error Page rendering 1`] = `
-<Fragment>
-  <withI18nextTranslation(Metadata)
-    title="TRANSLATE(Page Not Found)"
+<DocumentFragment>
+  <span
+    data-component="withI18nextTranslation(Metadata)"
+    data-props="{
+  \\"title\\": \\"TRANSLATE(Page Not Found)\\"
+}"
   />
-  <Message
-    heading="TRANSLATE(404 Page Not Found)"
-    type="error"
+  <span
+    data-component="Message"
+    data-props="{
+  \\"type\\": \\"error\\",
+  \\"heading\\": \\"TRANSLATE(404 Page Not Found)\\"
+}"
   >
     <p>
-      <Trans>
+      <span
+        data-component="Trans"
+        data-props="{}"
+      >
         The page you have requested could not be found.
-      </Trans>
+      </span>
     </p>
-  </Message>
-</Fragment>
+  </span>
+</DocumentFragment>
 `;