Separate shallow and deep render for snapshot tests

src/components/BookingInfo/BookingInfo.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import BookingInfo from './BookingInfo';
 
 describe('BookingInfo', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
+    const tree = renderDeep(
       <BookingInfo
         pricePerDay="55\\u20AC"
         bookingPeriod="Jan 2nd - Jan 4th"

src/components/FilterPanel/FilterPanel.test.js

@@ -1,16 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
+import { renderShallow } from '../../util/test-helpers';
 import FilterPanel from './FilterPanel';
 
 describe('FilterPanel', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <FilterPanel />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<FilterPanel />);
     expect(tree).toMatchSnapshot();
   });
 });

src/components/HeroSection/HeroSection.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import HeroSection from './HeroSection';
 
 describe('HeroSection', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
+    const tree = renderDeep(
       <HeroSection params={{ displayName: 'most-awesome-shop' }}>
         test
       </HeroSection>,

src/components/ListingCard/ListingCard.test.js

@@ -1,7 +1,5 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
+import { renderShallow } from '../../util/test-helpers';
 import ListingCard from './ListingCard';
 
 describe('ListingCard', () => {
@@ -19,11 +17,7 @@ describe('ListingCard', () => {
         review: { rating: '4' },
       },
     };
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <ListingCard {...listing} />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<ListingCard {...listing} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/components/ListingCardSmall/ListingCardSmall.test.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import { RoutesProvider } from '../../components';
 import routesConfiguration from '../../routesConfiguration';
 import ListingCardSmall from './ListingCardSmall';
@@ -19,7 +19,7 @@ describe('ListingCardSmall', () => {
         review: { rating: '4' },
       },
     };
-    const tree = renderTree(
+    const tree = renderDeep(
       <RoutesProvider routes={routesConfiguration}>
         <ListingCardSmall {...listing} />
       </RoutesProvider>,

src/components/MapPanel/MapPanel.test.js

@@ -1,16 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
+import { renderShallow } from '../../util/test-helpers';
 import MapPanel from './MapPanel';
 
 describe('MapPanel', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <MapPanel />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<MapPanel />);
     expect(tree).toMatchSnapshot();
   });
 });

src/components/Menu/Menu.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import Menu from './Menu';
 
 describe('Menu', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<Menu />);
+    const tree = renderDeep(<Menu />);
     expect(tree).toMatchSnapshot();
   });
 });

src/components/OrderDetailsPanel/OrderDetailsPanel.test.js

@@ -1,8 +1,6 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import OrderDetailsPanel from './OrderDetailsPanel.js';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
 
 describe('OrderDetailsPanel', () => {
   it('matches snapshot', () => {
@@ -23,11 +21,7 @@ describe('OrderDetailsPanel', () => {
       },
       confirmationCode: 'some-test-confirmation-code',
     };
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <OrderDetailsPanel {...props} />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<OrderDetailsPanel {...props} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/components/OrderDiscussionPanel/OrderDiscussionPanel.test.js

@@ -1,16 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import OrderDiscussionPanel from './OrderDiscussionPanel.js';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
 
 describe('OrderDiscussionPanel', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <OrderDiscussionPanel />
-      </RoutesProvider>,
-    );
+    const tree = renderDeep(<OrderDiscussionPanel />);
     expect(tree).toMatchSnapshot();
   });
 });

src/components/SearchResultsPanel/SearchResultsPanel.test.js

@@ -1,16 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
+import { renderShallow } from '../../util/test-helpers';
 import SearchResultsPanel from './SearchResultsPanel';
 
 describe('SearchResultsPanel', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <SearchResultsPanel />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<SearchResultsPanel />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/AuthenticationPage/AuthenticationPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import AuthenticationPage from './AuthenticationPage';
 
 describe('AuthenticationPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<AuthenticationPage location={{ state: { from: '/protected' } }} />);
+    const tree = renderShallow(<AuthenticationPage location={{ state: { from: '/protected' } }} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import ChangeAccountPasswordForm from './ChangeAccountPasswordForm';
 
 describe('ChangeAccountPasswordForm', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<ChangeAccountPasswordForm />);
+    const tree = renderDeep(<ChangeAccountPasswordForm />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/ChangePasswordForm/ChangePasswordForm.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import ChangePasswordForm from './ChangePasswordForm';
 
 describe('ChangePasswordForm', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<ChangePasswordForm />);
+    const tree = renderDeep(<ChangePasswordForm />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/CheckoutPage/CheckoutPage.test.js

@@ -1,16 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import CheckoutPage from './CheckoutPage';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
 
 describe('CheckoutPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <CheckoutPage params={{ listingId: 'some-listing-id' }} />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<CheckoutPage params={{ listingId: 'some-listing-id' }} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/ContactDetailsPage/ContactDetailsPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import ContactDetailsPage from './ContactDetailsPage';
 
 describe('ContactDetailsPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<ContactDetailsPage params={{ displayName: 'my-shop' }} />);
+    const tree = renderShallow(<ContactDetailsPage params={{ displayName: 'my-shop' }} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/EditProfilePage/EditProfilePage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import EditProfilePage from './EditProfilePage';
 
 describe('EditProfilePage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<EditProfilePage params={{ displayName: 'my-shop' }} />);
+    const tree = renderShallow(<EditProfilePage params={{ displayName: 'my-shop' }} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/HeroSearchForm/HeroSearchForm.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import HeroSearchForm from './HeroSearchForm';
 
 describe('HeroSearchForm', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<HeroSearchForm />);
+    const tree = renderDeep(<HeroSearchForm />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/InboxPage/InboxPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import InboxPage from './InboxPage';
 
 describe('InboxPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<InboxPage filter="inbox" />);
+    const tree = renderShallow(<InboxPage filter="inbox" />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/LandingPage/LandingPage.test.js

@@ -1,16 +1,12 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import { LandingPageComponent } from './LandingPage';
 import { RoutesProvider } from '../../components';
 import routesConfiguration from '../../routesConfiguration';
 
 describe('LandingPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <LandingPageComponent onLocationChanged={v => v} />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<LandingPageComponent onLocationChanged={v => v} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/ListingPage/ListingPage.test.js

@@ -1,16 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
+import { renderShallow } from '../../util/test-helpers';
 import ListingPage from './ListingPage';
 
 describe('ListingPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <ListingPage params={{ slug: 'banyan-studios', id: 1234 }} />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<ListingPage params={{ slug: 'banyan-studios', id: 1234 }} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/LoginForm/LoginForm.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import LoginForm from './LoginForm';
 
 describe('LoginForm', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<LoginForm />);
+    const tree = renderDeep(<LoginForm />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/ManageListingsPage/ManageListingsPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import ManageListingsPage from './ManageListingsPage';
 
 describe('ManageListingsPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<ManageListingsPage />);
+    const tree = renderShallow(<ManageListingsPage />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/NotFoundPage/NotFoundPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import NotFoundPage from './NotFoundPage';
 
 describe('NotFoundPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<NotFoundPage />);
+    const tree = renderShallow(<NotFoundPage />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/OrderPage/OrderPage.test.js

@@ -1,16 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import OrderPage from './OrderPage';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
 
 describe('OrderPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <OrderPage params={{ id: 1234 }} tab="details" />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<OrderPage params={{ id: 1234 }} tab="details" />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/PasswordChangePage/PasswordChangePage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import PasswordChangePage from './PasswordChangePage';
 
 describe('PasswordChangePage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<PasswordChangePage />);
+    const tree = renderShallow(<PasswordChangePage />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/PasswordForgottenForm/PasswordForgottenForm.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import PasswordForgottenForm from './PasswordForgottenForm';
 
 describe('PasswordForgottenForm', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<PasswordForgottenForm />);
+    const tree = renderDeep(<PasswordForgottenForm />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/PasswordForgottenPage/PasswordForgottenPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import PasswordForgottenPage from './PasswordForgottenPage';
 
 describe('PasswordForgottenPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<PasswordForgottenPage />);
+    const tree = renderShallow(<PasswordForgottenPage />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/PayoutPreferencesPage/PayoutPreferencesPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import PayoutPreferencesPage from './PayoutPreferencesPage';
 
 describe('PayoutPreferencesPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<PayoutPreferencesPage />);
+    const tree = renderShallow(<PayoutPreferencesPage />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/ProfilePage/ProfilePage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import ProfilePage from './ProfilePage';
 
 describe('ProfilePage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<ProfilePage params={{ displayName: 'most-awesome-shop' }} />);
+    const tree = renderShallow(<ProfilePage params={{ displayName: 'most-awesome-shop' }} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/SalesConversationPage/SalesConversationPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import SalesConversationPage from './SalesConversationPage';
 
 describe('SalesConversationPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<SalesConversationPage params={{ id: 12345 }} />);
+    const tree = renderShallow(<SalesConversationPage params={{ id: 12345 }} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/SearchPage/SearchPage.test.js

@@ -1,17 +1,11 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import { SearchPageComponent } from './SearchPage';
 import reducer, { ADD_FILTER, addFilter, initialState } from './SearchPage.ducks';
-import { RoutesProvider } from '../../components';
-import routesConfiguration from '../../routesConfiguration';
 
 describe('SearchPageComponent', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(
-      <RoutesProvider routes={routesConfiguration}>
-        <SearchPageComponent onLoadListings={v => v} />
-      </RoutesProvider>,
-    );
+    const tree = renderShallow(<SearchPageComponent onLoadListings={v => v} />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/SecurityPage/SecurityPage.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderShallow } from '../../util/test-helpers';
 import SecurityPage from './SecurityPage';
 
 describe('SecurityPage', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<SecurityPage />);
+    const tree = renderShallow(<SecurityPage />);
     expect(tree).toMatchSnapshot();
   });
 });

src/containers/SignUpForm/SignUpForm.test.js

@@ -1,10 +1,10 @@
 import React from 'react';
-import { renderTree } from '../../util/test-helpers';
+import { renderDeep } from '../../util/test-helpers';
 import SignUpForm from './SignUpForm';
 
 describe('SignUpForm', () => {
   it('matches snapshot', () => {
-    const tree = renderTree(<SignUpForm />);
+    const tree = renderDeep(<SignUpForm />);
     expect(tree).toMatchSnapshot();
   });
 });

src/util/test-helpers.js

@@ -1,5 +1,7 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
+import { shallow } from 'enzyme';
+import toJson from 'enzyme-to-json';
 import { IntlProvider } from 'react-intl';
 import { BrowserRouter } from 'react-router';
 import { Provider } from 'react-redux';
@@ -18,10 +20,14 @@ export const TestProvider = props => {
   );
 };
 
-export const renderTree = children => {
+export const renderShallow = component => {
+  return toJson(shallow(component));
+};
+
+export const renderDeep = component => {
   const comp = renderer.create(
     <TestProvider>
-      {children}
+      {component}
     </TestProvider>,
   );
   return comp.toJSON();