Add auth form to correct pages

This commit is contained in:
Kimmo Puputti 2017-01-25 15:14:21 +02:00
parent 98030f0aaa
commit dd448d842e
49 changed files with 318 additions and 220 deletions

View file

@ -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?

View file

@ -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>
);
}

View file

@ -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();

View file

@ -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>
`;

View file

@ -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>

View file

@ -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();

View file

@ -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

View file

@ -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>
);

View file

@ -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();

View file

@ -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">

View file

@ -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();

View file

@ -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

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`ContactDetailsPage matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
Contact details

View file

@ -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();

View file

@ -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

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`InboxPage matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
inbox page

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`LandingPage matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
Landing page

View file

@ -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();

View file

@ -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

View file

@ -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();

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`ManageListingsPage matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
Manage listings

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`NotFoundPage matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
Page not found

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`OrderPage matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
Order page

View file

@ -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;

View file

@ -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();

View file

@ -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>
`;

View file

@ -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;

View file

@ -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();

View file

@ -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>
`;

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`PayoutPreferencesPage matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
Payout preferences

View file

@ -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();

View file

@ -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

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`SalesConversationPage matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
Sales conversation page

View file

@ -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();

View file

@ -115,10 +115,6 @@ exports[`SearchPageComponent matches snapshot 1`] = `
style={Object {}}>
Security
</a>
<button
onClick={[Function]}>
Sign out
</button>
</div>
<h1>
Search page

View file

@ -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>
)

View file

@ -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();

View file

@ -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>
`;

View file

@ -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();

View file

@ -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>
);
};

18
src/util/test-helpers.js Normal file
View file

@ -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>
);
};