Updating Layout to use react-testing-library

src/components/Layout/__snapshots__/test.js.snap

@@ -1,26 +1,30 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Layout rendering 1`] = `
-<SentryBoundary>
+<DocumentFragment>
-  <noscript>
+  <span
-    <style
+    data-component="SentryBoundary"
-      type="text/css"
+    data-props="{}"
   >
-      
+    <noscript />
-  [data-requires-js] {
+    <span
-    display: none !important;
+      data-component="withI18nextTranslation(Header)"
-  }
+      data-props="{
-
+  \\"banner\\": \\"Test Banner\\"
-    </style>
+}"
-  </noscript>
-  <withI18nextTranslation(Header)
-    banner="Test Banner"
     />
-  <SentryBoundary>
+    <span
+      data-component="SentryBoundary"
+      data-props="{}"
+    >
       Example content
-  </SentryBoundary>
+    </span>
-  <withI18nextTranslation(Footer)
+    <span
-    buildId="test-buildid"
+      data-component="withI18nextTranslation(Footer)"
+      data-props="{
+  \\"buildId\\": \\"test-buildid\\"
+}"
     />
-</SentryBoundary>
+  </span>
+</DocumentFragment>
 `;

src/components/Layout/test.js

@@ -1,15 +1,22 @@
+jest.mock('components/SentryBoundary', () =>
+  require('__mocks__/component-mock')('components/SentryBoundary'));
+jest.mock('components/Header', () =>
+  require('__mocks__/component-mock')('components/Header'));
+jest.mock('components/Footer', () =>
+  require('__mocks__/component-mock')('components/Footer'));
+
 import React from 'react';
-import { shallow } from 'enzyme';
+import { render } from 'react-testing-library';
 
 import { Layout } from 'components/Layout';
 
 describe('Layout', () => {
   test('rendering', () => {
-    const component = shallow(
+    const { asFragment } = render(
       <Layout banner="Test Banner" buildId="test-buildid">
         Example content
       </Layout>
     );
-    expect(component).toMatchSnapshot();
+    expect(asFragment()).toMatchSnapshot();
   });
 });