From dd448d842eae378d645a21685ceaee93b0ba43fb Mon Sep 17 00:00:00 2001
From: Kimmo Puputti <git@kimmo.kpuputti.fi>
Date: Wed, 25 Jan 2017 15:14:21 +0200
Subject: [PATCH] Add auth form to correct pages

---
 src/Routes.js                                 |  4 +
 .../AuthenticationPage/AuthenticationPage.js  | 29 ++++--
 .../AuthenticationPage.test.js                |  6 +-
 .../AuthenticationPage.test.js.snap           | 90 ++++++++++++++-----
 .../ChangeAccountPasswordForm.js              |  2 -
 .../ChangeAccountPasswordForm.test.js         |  8 +-
 .../ChangeAccountPasswordForm.test.js.snap    | 13 ---
 .../ChangePasswordForm/ChangePasswordForm.js  |  4 -
 .../ChangePasswordForm.test.js                |  8 +-
 .../ChangePasswordForm.test.js.snap           | 26 ------
 .../CheckoutPage/CheckoutPage.test.js         |  6 +-
 .../__snapshots__/CheckoutPage.test.js.snap   |  4 -
 .../ContactDetailsPage.test.js                |  6 +-
 .../ContactDetailsPage.test.js.snap           |  4 -
 .../EditProfilePage/EditProfilePage.test.js   |  6 +-
 .../EditProfilePage.test.js.snap              |  4 -
 src/containers/InboxPage/InboxPage.test.js    |  6 +-
 .../__snapshots__/InboxPage.test.js.snap      |  4 -
 .../LandingPage/LandingPage.test.js           | 11 +--
 .../__snapshots__/LandingPage.test.js.snap    |  4 -
 .../ListingPage/ListingPage.test.js           |  6 +-
 .../__snapshots__/ListingPage.test.js.snap    |  4 -
 src/containers/LoginForm/LoginForm.test.js    |  8 +-
 .../ManageListingsPage.test.js                |  6 +-
 .../ManageListingsPage.test.js.snap           |  4 -
 .../NotFoundPage/NotFoundPage.test.js         |  6 +-
 .../__snapshots__/NotFoundPage.test.js.snap   |  4 -
 src/containers/OrderPage/OrderPage.test.js    |  6 +-
 .../__snapshots__/OrderPage.test.js.snap      |  4 -
 .../PasswordChangePage/PasswordChangePage.js  | 14 ++-
 .../PasswordChangePage.test.js                |  6 +-
 .../PasswordChangePage.test.js.snap           | 38 +++++++-
 .../PasswordForgottenPage.js                  | 14 ++-
 .../PasswordForgottenPage.test.js             |  6 +-
 .../PasswordForgottenPage.test.js.snap        | 28 +++++-
 .../PayoutPreferencesPage.test.js             |  6 +-
 .../PayoutPreferencesPage.test.js.snap        |  4 -
 .../ProfilePage/ProfilePage.test.js           |  6 +-
 .../__snapshots__/ProfilePage.test.js.snap    |  4 -
 .../SalesConversationPage.test.js             |  6 +-
 .../SalesConversationPage.test.js.snap        |  4 -
 src/containers/SearchPage/SearchPage.test.js  |  6 +-
 .../__snapshots__/SearchPage.test.js.snap     |  4 -
 src/containers/SecurityPage/SecurityPage.js   |  8 +-
 .../SecurityPage/SecurityPage.test.js         |  6 +-
 .../__snapshots__/SecurityPage.test.js.snap   | 57 ++++++++++--
 src/containers/SignUpForm/SignUpForm.test.js  |  8 +-
 src/containers/Topbar/Topbar.js               |  2 +-
 src/util/test-helpers.js                      | 18 ++++
 49 files changed, 318 insertions(+), 220 deletions(-)
 create mode 100644 src/util/test-helpers.js

diff --git a/src/Routes.js b/src/Routes.js
index 77ed92b2..3938b7c8 100644
--- a/src/Routes.js
+++ b/src/Routes.js
@@ -10,10 +10,14 @@ import routesConfiguration, { flattenRoutes, pathByRouteName } from './routesCon
 export const fakeAuth = {
   isAuthenticated: false,
   authenticate(cb) {
+    // eslint-disable-next-line no-console
+    console.log('fakeAuth: authenticate');
     this.isAuthenticated = true;
     window.setTimeout(cb, 100); // fake async
   },
   signout(cb) {
+    // eslint-disable-next-line no-console
+    console.log('fakeAuth: signout');
     this.isAuthenticated = false;
     cb();
     window.setTimeout(cb, 100); // weird bug if async?
diff --git a/src/containers/AuthenticationPage/AuthenticationPage.js b/src/containers/AuthenticationPage/AuthenticationPage.js
index 452b9faf..6ab4e8f8 100644
--- a/src/containers/AuthenticationPage/AuthenticationPage.js
+++ b/src/containers/AuthenticationPage/AuthenticationPage.js
@@ -1,6 +1,7 @@
 import React, { Component, PropTypes } from 'react';
 import { Link, Redirect } from 'react-router';
 import { PageLayout } from '../../components';
+import { LoginForm, SignUpForm } from '../../containers';
 import { fakeAuth } from '../../Routes';
 
 class AuthenticationPage extends Component {
@@ -8,10 +9,21 @@ class AuthenticationPage extends Component {
     super(props);
     this.state = { redirectToReferrer: false };
 
-    this.login = this.login.bind(this);
+    this.handleLogIn = this.handleLogIn.bind(this);
+    this.handleSignUp = this.handleSignUp.bind(this);
   }
 
-  login() {
+  handleLogIn(values) {
+    // eslint-disable-next-line no-console
+    console.log('log in with values:', values);
+    fakeAuth.authenticate(() => {
+      this.setState({ redirectToReferrer: true });
+    });
+  }
+
+  handleSignUp(values) {
+    // eslint-disable-next-line no-console
+    console.log('sign up with values:', values);
     fakeAuth.authenticate(() => {
       this.setState({ redirectToReferrer: true });
     });
@@ -20,7 +32,7 @@ class AuthenticationPage extends Component {
   render() {
     const from = this.props.location.state && this.props.location.state.from
       ? this.props.location.state.from
-      : '/';
+      : null;
     const { redirectToReferrer } = this.state;
 
     const toLogin = <Link to={{ pathname: '/login', state: { from: from || '/' } }}>Log in</Link>;
@@ -28,9 +40,12 @@ class AuthenticationPage extends Component {
       <Link to={{ pathname: '/signup', state: { from: from || '/' } }}>Sign up</Link>
     );
     const alternativeMethod = this.props.tab === 'login' ? toSignup : toLogin;
-    const currentMethod = this.props.tab === 'login' ? 'Log in' : 'Sign up';
 
-    const fromLoginMsg = from ? (
+    const form = this.props.tab === 'login'
+      ? <LoginForm onSubmit={this.handleLogIn} />
+      : <SignUpForm onSubmit={this.handleSignUp} />;
+
+    const fromLoginMsg = from && from.pathname ? (
         <p>
           You must log in to view the page at
           <code>{from.pathname}</code>
@@ -41,8 +56,8 @@ class AuthenticationPage extends Component {
       <PageLayout title={`Authentication page: ${this.props.tab} tab`}>
         {redirectToReferrer ? <Redirect to={from || '/'} /> : null}
         {fromLoginMsg}
-        <button onClick={this.login}>{currentMethod}</button>
-        <p>or {alternativeMethod}</p>
+        {form}
+        {alternativeMethod}
       </PageLayout>
     );
   }
diff --git a/src/containers/AuthenticationPage/AuthenticationPage.test.js b/src/containers/AuthenticationPage/AuthenticationPage.test.js
index c6fc46de..142ee30a 100644
--- a/src/containers/AuthenticationPage/AuthenticationPage.test.js
+++ b/src/containers/AuthenticationPage/AuthenticationPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import AuthenticationPage from './AuthenticationPage';
 
 describe('AuthenticationPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <AuthenticationPage location={{ state: { from: '/protected' } }} />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/AuthenticationPage/__snapshots__/AuthenticationPage.test.js.snap b/src/containers/AuthenticationPage/__snapshots__/AuthenticationPage.test.js.snap
index 1e36f485..15ceb7ce 100644
--- a/src/containers/AuthenticationPage/__snapshots__/AuthenticationPage.test.js.snap
+++ b/src/containers/AuthenticationPage/__snapshots__/AuthenticationPage.test.js.snap
@@ -115,31 +115,77 @@ exports[`AuthenticationPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Authentication page: signup tab
   </h1>
-  <p>
-    You must log in to view the page at
-    <code />
-  </p>
-  <button
-    onClick={[Function]}>
-    Sign up
-  </button>
-  <p>
-    or 
-    <a
-      className=""
-      href="/login"
-      onClick={[Function]}
-      style={Object {}}>
-      Log in
-    </a>
-  </p>
+  <form
+    onSubmit={[Function]}>
+    <label
+      htmlFor="email">
+      Email
+    </label>
+    <input
+      name="email"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      type="email"
+      value="" />
+    <label
+      htmlFor="firstName">
+      First name
+    </label>
+    <input
+      name="firstName"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      value="" />
+    <label
+      htmlFor="lastName">
+      Last name
+    </label>
+    <input
+      name="lastName"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      value="" />
+    <label
+      htmlFor="password">
+      Password
+    </label>
+    <input
+      name="password"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      type="password"
+      value="" />
+    <p>
+      By confirming I accept the booking terms and conditions.
+    </p>
+    <button
+      disabled={true}
+      type="submit">
+      Sign up
+    </button>
+  </form>
+  <a
+    className=""
+    href="/login"
+    onClick={[Function]}
+    style={Object {}}>
+    Log in
+  </a>
 </div>
 `;
diff --git a/src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.js b/src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.js
index 2d6a4cf5..c99af0f2 100644
--- a/src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.js
+++ b/src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.js
@@ -5,8 +5,6 @@ const ChangeAccountPasswordForm = props => {
   const { handleSubmit, pristine, submitting } = props;
   return (
     <form onSubmit={handleSubmit}>
-      <label htmlFor="email">Email</label>
-      <Field name="email" component="input" type="email" />
       <label htmlFor="newPassword1">New password</label>
       <Field name="newPassword1" component="input" type="password" />
       <label htmlFor="newPassword2">New password, again</label>
diff --git a/src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.test.js b/src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.test.js
index cd31f15d..b24da87d 100644
--- a/src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.test.js
+++ b/src/containers/ChangeAccountPasswordForm/ChangeAccountPasswordForm.test.js
@@ -1,17 +1,15 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Provider } from 'react-redux';
-import configureStore from '../../store';
+import { TestProvider } from '../../util/test-helpers';
 import ChangeAccountPasswordForm from './ChangeAccountPasswordForm';
 
 describe('ChangeAccountPasswordForm', () => {
   it('matches snapshot', () => {
-    const store = configureStore();
     const component = renderer.create(
       (
-        <Provider store={store}>
+        <TestProvider>
           <ChangeAccountPasswordForm />
-        </Provider>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/ChangeAccountPasswordForm/__snapshots__/ChangeAccountPasswordForm.test.js.snap b/src/containers/ChangeAccountPasswordForm/__snapshots__/ChangeAccountPasswordForm.test.js.snap
index 66b6a708..b38292b2 100644
--- a/src/containers/ChangeAccountPasswordForm/__snapshots__/ChangeAccountPasswordForm.test.js.snap
+++ b/src/containers/ChangeAccountPasswordForm/__snapshots__/ChangeAccountPasswordForm.test.js.snap
@@ -1,19 +1,6 @@
 exports[`ChangeAccountPasswordForm matches snapshot 1`] = `
 <form
   onSubmit={[Function]}>
-  <label
-    htmlFor="email">
-    Email
-  </label>
-  <input
-    name="email"
-    onBlur={[Function]}
-    onChange={[Function]}
-    onDragStart={[Function]}
-    onDrop={[Function]}
-    onFocus={[Function]}
-    type="email"
-    value="" />
   <label
     htmlFor="newPassword1">
     New password
diff --git a/src/containers/ChangePasswordForm/ChangePasswordForm.js b/src/containers/ChangePasswordForm/ChangePasswordForm.js
index a98e635c..8a49cfcc 100644
--- a/src/containers/ChangePasswordForm/ChangePasswordForm.js
+++ b/src/containers/ChangePasswordForm/ChangePasswordForm.js
@@ -5,14 +5,10 @@ const ChangePasswordForm = props => {
   const { handleSubmit, pristine, submitting } = props;
   return (
     <form onSubmit={handleSubmit}>
-      <label htmlFor="email">Email</label>
-      <Field name="email" component="input" type="email" />
       <label htmlFor="newPassword1">New password</label>
       <Field name="newPassword1" component="input" type="password" />
       <label htmlFor="newPassword2">New password, again</label>
       <Field name="newPassword2" component="input" type="password" />
-      <label htmlFor="password">Current password</label>
-      <Field name="password" component="input" type="password" />
       <button type="submit" disabled={pristine || submitting}>Change password</button>
     </form>
   );
diff --git a/src/containers/ChangePasswordForm/ChangePasswordForm.test.js b/src/containers/ChangePasswordForm/ChangePasswordForm.test.js
index 27917da0..91cefbb4 100644
--- a/src/containers/ChangePasswordForm/ChangePasswordForm.test.js
+++ b/src/containers/ChangePasswordForm/ChangePasswordForm.test.js
@@ -1,17 +1,15 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Provider } from 'react-redux';
-import configureStore from '../../store';
+import { TestProvider } from '../../util/test-helpers';
 import ChangePasswordForm from './ChangePasswordForm';
 
 describe('ChangePasswordForm', () => {
   it('matches snapshot', () => {
-    const store = configureStore();
     const component = renderer.create(
       (
-        <Provider store={store}>
+        <TestProvider>
           <ChangePasswordForm />
-        </Provider>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/ChangePasswordForm/__snapshots__/ChangePasswordForm.test.js.snap b/src/containers/ChangePasswordForm/__snapshots__/ChangePasswordForm.test.js.snap
index e664778d..748276e0 100644
--- a/src/containers/ChangePasswordForm/__snapshots__/ChangePasswordForm.test.js.snap
+++ b/src/containers/ChangePasswordForm/__snapshots__/ChangePasswordForm.test.js.snap
@@ -1,19 +1,6 @@
 exports[`ChangePasswordForm matches snapshot 1`] = `
 <form
   onSubmit={[Function]}>
-  <label
-    htmlFor="email">
-    Email
-  </label>
-  <input
-    name="email"
-    onBlur={[Function]}
-    onChange={[Function]}
-    onDragStart={[Function]}
-    onDrop={[Function]}
-    onFocus={[Function]}
-    type="email"
-    value="" />
   <label
     htmlFor="newPassword1">
     New password
@@ -40,19 +27,6 @@ exports[`ChangePasswordForm matches snapshot 1`] = `
     onFocus={[Function]}
     type="password"
     value="" />
-  <label
-    htmlFor="password">
-    Current password
-  </label>
-  <input
-    name="password"
-    onBlur={[Function]}
-    onChange={[Function]}
-    onDragStart={[Function]}
-    onDrop={[Function]}
-    onFocus={[Function]}
-    type="password"
-    value="" />
   <button
     disabled={true}
     type="submit">
diff --git a/src/containers/CheckoutPage/CheckoutPage.test.js b/src/containers/CheckoutPage/CheckoutPage.test.js
index 14834f2f..32f60f02 100644
--- a/src/containers/CheckoutPage/CheckoutPage.test.js
+++ b/src/containers/CheckoutPage/CheckoutPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import CheckoutPage from './CheckoutPage';
 
 describe('CheckoutPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <CheckoutPage params={{ listingId: 'some-listing-id' }} />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/CheckoutPage/__snapshots__/CheckoutPage.test.js.snap b/src/containers/CheckoutPage/__snapshots__/CheckoutPage.test.js.snap
index 7972b6dd..5c34e4aa 100644
--- a/src/containers/CheckoutPage/__snapshots__/CheckoutPage.test.js.snap
+++ b/src/containers/CheckoutPage/__snapshots__/CheckoutPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`CheckoutPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Checkout page: some-listing-id
diff --git a/src/containers/ContactDetailsPage/ContactDetailsPage.test.js b/src/containers/ContactDetailsPage/ContactDetailsPage.test.js
index ae0d096c..1a92bb20 100644
--- a/src/containers/ContactDetailsPage/ContactDetailsPage.test.js
+++ b/src/containers/ContactDetailsPage/ContactDetailsPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import ContactDetailsPage from './ContactDetailsPage';
 
 describe('ContactDetailsPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <ContactDetailsPage params={{ displayName: 'my-shop' }} />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/ContactDetailsPage/__snapshots__/ContactDetailsPage.test.js.snap b/src/containers/ContactDetailsPage/__snapshots__/ContactDetailsPage.test.js.snap
index 582cc7ee..f4ed99e7 100644
--- a/src/containers/ContactDetailsPage/__snapshots__/ContactDetailsPage.test.js.snap
+++ b/src/containers/ContactDetailsPage/__snapshots__/ContactDetailsPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`ContactDetailsPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Contact details
diff --git a/src/containers/EditProfilePage/EditProfilePage.test.js b/src/containers/EditProfilePage/EditProfilePage.test.js
index ef5c30ba..e010f4ae 100644
--- a/src/containers/EditProfilePage/EditProfilePage.test.js
+++ b/src/containers/EditProfilePage/EditProfilePage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import EditProfilePage from './EditProfilePage';
 
 describe('EditProfilePage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <EditProfilePage params={{ displayName: 'my-shop' }} />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/EditProfilePage/__snapshots__/EditProfilePage.test.js.snap b/src/containers/EditProfilePage/__snapshots__/EditProfilePage.test.js.snap
index 74c5ba49..3de10dbb 100644
--- a/src/containers/EditProfilePage/__snapshots__/EditProfilePage.test.js.snap
+++ b/src/containers/EditProfilePage/__snapshots__/EditProfilePage.test.js.snap
@@ -115,10 +115,6 @@ exports[`EditProfilePage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Edit profile page with display name: my-shop
diff --git a/src/containers/InboxPage/InboxPage.test.js b/src/containers/InboxPage/InboxPage.test.js
index 81f4669e..a79fd5ab 100644
--- a/src/containers/InboxPage/InboxPage.test.js
+++ b/src/containers/InboxPage/InboxPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import InboxPage from './InboxPage';
 
 describe('InboxPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <InboxPage filter="inbox" />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/InboxPage/__snapshots__/InboxPage.test.js.snap b/src/containers/InboxPage/__snapshots__/InboxPage.test.js.snap
index 1bab9dc0..d7f8a6ba 100644
--- a/src/containers/InboxPage/__snapshots__/InboxPage.test.js.snap
+++ b/src/containers/InboxPage/__snapshots__/InboxPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`InboxPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     inbox page
diff --git a/src/containers/LandingPage/LandingPage.test.js b/src/containers/LandingPage/LandingPage.test.js
index 632904c7..3e8b7f7f 100644
--- a/src/containers/LandingPage/LandingPage.test.js
+++ b/src/containers/LandingPage/LandingPage.test.js
@@ -1,18 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
-import { IntlProvider } from 'react-intl';
+import { TestProvider } from '../../util/test-helpers';
 import LandingPage from './LandingPage';
 
 describe('LandingPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <IntlProvider locale="en">
-          <BrowserRouter>
-            <LandingPage />
-          </BrowserRouter>
-        </IntlProvider>
+        <TestProvider>
+          <LandingPage />
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/LandingPage/__snapshots__/LandingPage.test.js.snap b/src/containers/LandingPage/__snapshots__/LandingPage.test.js.snap
index 90f926b5..2e55d7ee 100644
--- a/src/containers/LandingPage/__snapshots__/LandingPage.test.js.snap
+++ b/src/containers/LandingPage/__snapshots__/LandingPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`LandingPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Landing page
diff --git a/src/containers/ListingPage/ListingPage.test.js b/src/containers/ListingPage/ListingPage.test.js
index ba291720..7dd751fc 100644
--- a/src/containers/ListingPage/ListingPage.test.js
+++ b/src/containers/ListingPage/ListingPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import ListingPage from './ListingPage';
 
 describe('ListingPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <ListingPage params={{ slug: 'really-nice-house-1234', id: 1234 }} />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/ListingPage/__snapshots__/ListingPage.test.js.snap b/src/containers/ListingPage/__snapshots__/ListingPage.test.js.snap
index 958ec5c4..c1827e70 100644
--- a/src/containers/ListingPage/__snapshots__/ListingPage.test.js.snap
+++ b/src/containers/ListingPage/__snapshots__/ListingPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`ListingPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Listing page with listing id: #1234
diff --git a/src/containers/LoginForm/LoginForm.test.js b/src/containers/LoginForm/LoginForm.test.js
index 7f05b48f..80bd0132 100644
--- a/src/containers/LoginForm/LoginForm.test.js
+++ b/src/containers/LoginForm/LoginForm.test.js
@@ -1,17 +1,15 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Provider } from 'react-redux';
-import configureStore from '../../store';
+import { TestProvider } from '../../util/test-helpers';
 import LoginForm from './LoginForm';
 
 describe('LoginForm', () => {
   it('matches snapshot', () => {
-    const store = configureStore();
     const component = renderer.create(
       (
-        <Provider store={store}>
+        <TestProvider>
           <LoginForm />
-        </Provider>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/ManageListingsPage/ManageListingsPage.test.js b/src/containers/ManageListingsPage/ManageListingsPage.test.js
index 574dd53b..6bfdd4ed 100644
--- a/src/containers/ManageListingsPage/ManageListingsPage.test.js
+++ b/src/containers/ManageListingsPage/ManageListingsPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import ManageListingsPage from './ManageListingsPage';
 
 describe('ManageListingsPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <ManageListingsPage />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/ManageListingsPage/__snapshots__/ManageListingsPage.test.js.snap b/src/containers/ManageListingsPage/__snapshots__/ManageListingsPage.test.js.snap
index 2aada4ee..6f65f707 100644
--- a/src/containers/ManageListingsPage/__snapshots__/ManageListingsPage.test.js.snap
+++ b/src/containers/ManageListingsPage/__snapshots__/ManageListingsPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`ManageListingsPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Manage listings
diff --git a/src/containers/NotFoundPage/NotFoundPage.test.js b/src/containers/NotFoundPage/NotFoundPage.test.js
index 254c66c6..04bfe224 100644
--- a/src/containers/NotFoundPage/NotFoundPage.test.js
+++ b/src/containers/NotFoundPage/NotFoundPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import NotFoundPage from './NotFoundPage';
 
 describe('NotFoundPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <NotFoundPage />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/NotFoundPage/__snapshots__/NotFoundPage.test.js.snap b/src/containers/NotFoundPage/__snapshots__/NotFoundPage.test.js.snap
index ad2f75fd..0f0b3b9b 100644
--- a/src/containers/NotFoundPage/__snapshots__/NotFoundPage.test.js.snap
+++ b/src/containers/NotFoundPage/__snapshots__/NotFoundPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`NotFoundPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Page not found
diff --git a/src/containers/OrderPage/OrderPage.test.js b/src/containers/OrderPage/OrderPage.test.js
index ebb298d4..44ac4143 100644
--- a/src/containers/OrderPage/OrderPage.test.js
+++ b/src/containers/OrderPage/OrderPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import OrderPage from './OrderPage';
 
 describe('OrderPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <OrderPage params={{ id: 1234 }} />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/OrderPage/__snapshots__/OrderPage.test.js.snap b/src/containers/OrderPage/__snapshots__/OrderPage.test.js.snap
index 5cdc17f3..149264c0 100644
--- a/src/containers/OrderPage/__snapshots__/OrderPage.test.js.snap
+++ b/src/containers/OrderPage/__snapshots__/OrderPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`OrderPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Order page
diff --git a/src/containers/PasswordChangePage/PasswordChangePage.js b/src/containers/PasswordChangePage/PasswordChangePage.js
index a65c64cf..57cde7fb 100644
--- a/src/containers/PasswordChangePage/PasswordChangePage.js
+++ b/src/containers/PasswordChangePage/PasswordChangePage.js
@@ -1,4 +1,16 @@
 import React from 'react';
 import { PageLayout } from '../../components';
+import { ChangePasswordForm } from '../../containers';
 
-export default () => <PageLayout title="Type new password" />
+const changePassword = values => {
+  // eslint-disable-next-line no-console
+  console.log('submit with values:', values);
+};
+
+const PasswordChangePage = () => (
+  <PageLayout title="Type new password">
+    <ChangePasswordForm onSubmit={changePassword} />
+  </PageLayout>
+);
+
+export default PasswordChangePage;
diff --git a/src/containers/PasswordChangePage/PasswordChangePage.test.js b/src/containers/PasswordChangePage/PasswordChangePage.test.js
index 2680449a..01352103 100644
--- a/src/containers/PasswordChangePage/PasswordChangePage.test.js
+++ b/src/containers/PasswordChangePage/PasswordChangePage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import PasswordChangePage from './PasswordChangePage';
 
 describe('PasswordChangePage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <PasswordChangePage />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/PasswordChangePage/__snapshots__/PasswordChangePage.test.js.snap b/src/containers/PasswordChangePage/__snapshots__/PasswordChangePage.test.js.snap
index 1cd39a0c..8bd7912e 100644
--- a/src/containers/PasswordChangePage/__snapshots__/PasswordChangePage.test.js.snap
+++ b/src/containers/PasswordChangePage/__snapshots__/PasswordChangePage.test.js.snap
@@ -115,13 +115,43 @@ exports[`PasswordChangePage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Type new password
   </h1>
+  <form
+    onSubmit={[Function]}>
+    <label
+      htmlFor="newPassword1">
+      New password
+    </label>
+    <input
+      name="newPassword1"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      type="password"
+      value="" />
+    <label
+      htmlFor="newPassword2">
+      New password, again
+    </label>
+    <input
+      name="newPassword2"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      type="password"
+      value="" />
+    <button
+      disabled={true}
+      type="submit">
+      Change password
+    </button>
+  </form>
 </div>
 `;
diff --git a/src/containers/PasswordForgottenPage/PasswordForgottenPage.js b/src/containers/PasswordForgottenPage/PasswordForgottenPage.js
index 446a8c64..99d0850f 100644
--- a/src/containers/PasswordForgottenPage/PasswordForgottenPage.js
+++ b/src/containers/PasswordForgottenPage/PasswordForgottenPage.js
@@ -1,4 +1,16 @@
 import React from 'react';
 import { PageLayout } from '../../components';
+import { PasswordForgottenForm } from '../../containers';
 
-export default () => <PageLayout title="Request new password" />
+const sendPasswordResetEmail = values => {
+  // eslint-disable-next-line no-console
+  console.log('submit with values:', values);
+};
+
+const PasswordForgottenPage = () => (
+  <PageLayout title="Request new password">
+    <PasswordForgottenForm onSubmit={sendPasswordResetEmail} />
+  </PageLayout>
+);
+
+export default PasswordForgottenPage;
diff --git a/src/containers/PasswordForgottenPage/PasswordForgottenPage.test.js b/src/containers/PasswordForgottenPage/PasswordForgottenPage.test.js
index ac9caba1..2a3fa7dd 100644
--- a/src/containers/PasswordForgottenPage/PasswordForgottenPage.test.js
+++ b/src/containers/PasswordForgottenPage/PasswordForgottenPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import PasswordForgottenPage from './PasswordForgottenPage';
 
 describe('PasswordForgottenPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <PasswordForgottenPage />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/PasswordForgottenPage/__snapshots__/PasswordForgottenPage.test.js.snap b/src/containers/PasswordForgottenPage/__snapshots__/PasswordForgottenPage.test.js.snap
index fbd6a7d3..8bdfe067 100644
--- a/src/containers/PasswordForgottenPage/__snapshots__/PasswordForgottenPage.test.js.snap
+++ b/src/containers/PasswordForgottenPage/__snapshots__/PasswordForgottenPage.test.js.snap
@@ -115,13 +115,33 @@ exports[`PasswordForgottenPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Request new password
   </h1>
+  <form
+    onSubmit={[Function]}>
+    <label
+      htmlFor="email">
+      Email
+    </label>
+    <input
+      name="email"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      type="email"
+      value="" />
+    <p>
+      We will send you instructions to your email.
+    </p>
+    <button
+      disabled={true}
+      type="submit">
+      Send
+    </button>
+  </form>
 </div>
 `;
diff --git a/src/containers/PayoutPreferencesPage/PayoutPreferencesPage.test.js b/src/containers/PayoutPreferencesPage/PayoutPreferencesPage.test.js
index 2a249f99..0611bb25 100644
--- a/src/containers/PayoutPreferencesPage/PayoutPreferencesPage.test.js
+++ b/src/containers/PayoutPreferencesPage/PayoutPreferencesPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import PayoutPreferencesPage from './PayoutPreferencesPage';
 
 describe('PayoutPreferencesPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <PayoutPreferencesPage />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/PayoutPreferencesPage/__snapshots__/PayoutPreferencesPage.test.js.snap b/src/containers/PayoutPreferencesPage/__snapshots__/PayoutPreferencesPage.test.js.snap
index 1591f550..f03e30c3 100644
--- a/src/containers/PayoutPreferencesPage/__snapshots__/PayoutPreferencesPage.test.js.snap
+++ b/src/containers/PayoutPreferencesPage/__snapshots__/PayoutPreferencesPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`PayoutPreferencesPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Payout preferences
diff --git a/src/containers/ProfilePage/ProfilePage.test.js b/src/containers/ProfilePage/ProfilePage.test.js
index 2c2e6586..0d48a67c 100644
--- a/src/containers/ProfilePage/ProfilePage.test.js
+++ b/src/containers/ProfilePage/ProfilePage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import ProfilePage from './ProfilePage';
 
 describe('ProfilePage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <ProfilePage params={{ displayName: 'most-awesome-shop' }} />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/ProfilePage/__snapshots__/ProfilePage.test.js.snap b/src/containers/ProfilePage/__snapshots__/ProfilePage.test.js.snap
index 34e9fdb1..9e30960a 100644
--- a/src/containers/ProfilePage/__snapshots__/ProfilePage.test.js.snap
+++ b/src/containers/ProfilePage/__snapshots__/ProfilePage.test.js.snap
@@ -115,10 +115,6 @@ exports[`ProfilePage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Profile page with display name: most-awesome-shop
diff --git a/src/containers/SalesConversationPage/SalesConversationPage.test.js b/src/containers/SalesConversationPage/SalesConversationPage.test.js
index 6d45e10f..9644d7ef 100644
--- a/src/containers/SalesConversationPage/SalesConversationPage.test.js
+++ b/src/containers/SalesConversationPage/SalesConversationPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import SalesConversationPage from './SalesConversationPage';
 
 describe('SalesConversationPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <SalesConversationPage params={{ id: 12345 }} />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/SalesConversationPage/__snapshots__/SalesConversationPage.test.js.snap b/src/containers/SalesConversationPage/__snapshots__/SalesConversationPage.test.js.snap
index 7181b933..d3c2934a 100644
--- a/src/containers/SalesConversationPage/__snapshots__/SalesConversationPage.test.js.snap
+++ b/src/containers/SalesConversationPage/__snapshots__/SalesConversationPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`SalesConversationPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Sales conversation page
diff --git a/src/containers/SearchPage/SearchPage.test.js b/src/containers/SearchPage/SearchPage.test.js
index 62b3e1da..d14edb8b 100644
--- a/src/containers/SearchPage/SearchPage.test.js
+++ b/src/containers/SearchPage/SearchPage.test.js
@@ -1,6 +1,6 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import { SearchPageComponent } from './SearchPage';
 import reducer, { ADD_FILTER, addFilter } from './SearchPage.ducks';
 import { RoutesProvider } from '../../components';
@@ -10,11 +10,11 @@ describe('SearchPageComponent', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <RoutesProvider routes={routesConfiguration}>
             <SearchPageComponent />
           </RoutesProvider>
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/SearchPage/__snapshots__/SearchPage.test.js.snap b/src/containers/SearchPage/__snapshots__/SearchPage.test.js.snap
index 18b21df7..f3eb1c46 100644
--- a/src/containers/SearchPage/__snapshots__/SearchPage.test.js.snap
+++ b/src/containers/SearchPage/__snapshots__/SearchPage.test.js.snap
@@ -115,10 +115,6 @@ exports[`SearchPageComponent matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Search page
diff --git a/src/containers/SecurityPage/SecurityPage.js b/src/containers/SecurityPage/SecurityPage.js
index 5b039f4c..d4fe7060 100644
--- a/src/containers/SecurityPage/SecurityPage.js
+++ b/src/containers/SecurityPage/SecurityPage.js
@@ -1,8 +1,14 @@
 import React from 'react';
 import { PageLayout } from '../../components';
+import { ChangeAccountPasswordForm } from '../../containers';
+
+const changePassword = values => {
+  // eslint-disable-next-line no-console
+  console.log('change password to values:', values);
+};
 
 export default () => (
   <PageLayout title="Security">
-    <p>Change password, delete account</p>
+    <ChangeAccountPasswordForm onSubmit={changePassword} />
   </PageLayout>
 )
diff --git a/src/containers/SecurityPage/SecurityPage.test.js b/src/containers/SecurityPage/SecurityPage.test.js
index 6f371307..47795cd4 100644
--- a/src/containers/SecurityPage/SecurityPage.test.js
+++ b/src/containers/SecurityPage/SecurityPage.test.js
@@ -1,15 +1,15 @@
 import React from 'react';
-import { BrowserRouter } from 'react-router';
 import renderer from 'react-test-renderer';
+import { TestProvider } from '../../util/test-helpers';
 import SecurityPage from './SecurityPage';
 
 describe('SecurityPage', () => {
   it('matches snapshot', () => {
     const component = renderer.create(
       (
-        <BrowserRouter>
+        <TestProvider>
           <SecurityPage />
-        </BrowserRouter>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/SecurityPage/__snapshots__/SecurityPage.test.js.snap b/src/containers/SecurityPage/__snapshots__/SecurityPage.test.js.snap
index 8e968132..6ff50a60 100644
--- a/src/containers/SecurityPage/__snapshots__/SecurityPage.test.js.snap
+++ b/src/containers/SecurityPage/__snapshots__/SecurityPage.test.js.snap
@@ -115,16 +115,59 @@ exports[`SecurityPage matches snapshot 1`] = `
       style={Object {}}>
       Security
     </a>
-    <button
-      onClick={[Function]}>
-      Sign out
-    </button>
   </div>
   <h1>
     Security
   </h1>
-  <p>
-    Change password, delete account
-  </p>
+  <form
+    onSubmit={[Function]}>
+    <label
+      htmlFor="newPassword1">
+      New password
+    </label>
+    <input
+      name="newPassword1"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      type="password"
+      value="" />
+    <label
+      htmlFor="newPassword2">
+      New password, again
+    </label>
+    <input
+      name="newPassword2"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      type="password"
+      value="" />
+    <label
+      htmlFor="password">
+      Current password
+    </label>
+    <input
+      name="password"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onDragStart={[Function]}
+      onDrop={[Function]}
+      onFocus={[Function]}
+      type="password"
+      value="" />
+    <p>
+      Delete account (module)
+    </p>
+    <button
+      disabled={true}
+      type="submit">
+      Save changes
+    </button>
+  </form>
 </div>
 `;
diff --git a/src/containers/SignUpForm/SignUpForm.test.js b/src/containers/SignUpForm/SignUpForm.test.js
index b0398022..7f535d7a 100644
--- a/src/containers/SignUpForm/SignUpForm.test.js
+++ b/src/containers/SignUpForm/SignUpForm.test.js
@@ -1,17 +1,15 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Provider } from 'react-redux';
-import configureStore from '../../store';
+import { TestProvider } from '../../util/test-helpers';
 import SignUpForm from './SignUpForm';
 
 describe('SignUpForm', () => {
   it('matches snapshot', () => {
-    const store = configureStore();
     const component = renderer.create(
       (
-        <Provider store={store}>
+        <TestProvider>
           <SignUpForm />
-        </Provider>
+        </TestProvider>
       ),
     );
     const tree = component.toJSON();
diff --git a/src/containers/Topbar/Topbar.js b/src/containers/Topbar/Topbar.js
index fbc0f5d9..680a598a 100644
--- a/src/containers/Topbar/Topbar.js
+++ b/src/containers/Topbar/Topbar.js
@@ -38,7 +38,7 @@ const Topbar = (props, context) => {
       <Link to="/account/contact-details" {...linkProps}>Contact details</Link>
       <Link to="/account/payout-preferences" {...linkProps}>Payout preferences</Link>
       <Link to="/account/security" {...linkProps}>Security</Link>
-      <SignoutButton router={context.router} />
+      {fakeAuth.isAuthenticated ? <SignoutButton router={context.router} /> : null}
     </div>
   );
 };
diff --git a/src/util/test-helpers.js b/src/util/test-helpers.js
new file mode 100644
index 00000000..cb0857bb
--- /dev/null
+++ b/src/util/test-helpers.js
@@ -0,0 +1,18 @@
+import React from 'react';
+import { IntlProvider } from 'react-intl';
+import { BrowserRouter } from 'react-router';
+import { Provider } from 'react-redux';
+import configureStore from '../store';
+
+export const TestProvider = props => {
+  const store = configureStore();
+  return (
+    <IntlProvider locale="en">
+      <BrowserRouter>
+        <Provider store={store}>
+          {props.children}
+        </Provider>
+      </BrowserRouter>
+    </IntlProvider>
+  );
+};