wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-20 12:40:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

Make each test independent

Browse Source
This commit is contained in:
Chi Vinh Le
2018-08-29 16:02:31 +02:00
parent fbb194cdac
commit 885a724876
5 changed files with 390 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/client/auth/containers/SignUpContainer.tsx
+2 -2
View File
@@ -17,8 +17,8 @@ interface SignUpContainerProps {
class SignUpContainer extends Component<SignUpContainerProps> {
private onSubmit: SignUpForm["onSubmit"] = async (input, form) => {
try {
return await this.props.signUp(input);
form.reset();
await this.props.signUp(input);
return form.reset();
} catch (error) {
return { [FORM_ERROR]: error.message };
}
src/core/client/auth/test/__snapshots__/signIn.spec.tsx.snap
+20 -7
View File
@@ -25,14 +25,27 @@ exports[`accepts correct password 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -155,6 +168,7 @@ exports[`accepts valid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -249,6 +263,7 @@ exports[`checks for invalid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -279,6 +294,7 @@ exports[`checks for invalid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -473,6 +489,7 @@ exports[`shows error when submitting empty form 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -503,6 +520,7 @@ exports[`shows error when submitting empty form 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -781,11 +799,6 @@ exports[`submits form successfully 1`] = `
>
Sign in to join the conversation
</h1>
<div
className="CallOut-root CallOut-colorError CallOut-fullWidth"
>
Server Error
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
>
src/core/client/auth/test/__snapshots__/signUp.spec.tsx.snap
+254 -38
View File
@@ -25,14 +25,27 @@ exports[`accepts correct password 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -48,14 +61,27 @@ exports[`accepts correct password 1`] = `
A unique identifier displayed on your comments. You may use “_” and “.”
</p>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="username"
onChange={[Function]}
placeholder="Username"
type="text"
value="hans"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -101,6 +127,7 @@ exports[`accepts correct password 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -164,14 +191,27 @@ exports[`accepts correct password confirmation 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -187,14 +227,27 @@ exports[`accepts correct password confirmation 1`] = `
A unique identifier displayed on your comments. You may use “_” and “.”
</p>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="username"
onChange={[Function]}
placeholder="Username"
type="text"
value="hans"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -210,14 +263,27 @@ exports[`accepts correct password confirmation 1`] = `
Must be at least {$minLength} characters
</p>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="password"
onChange={[Function]}
placeholder="Password"
type="password"
value="testtest"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -228,7 +294,7 @@ exports[`accepts correct password confirmation 1`] = `
Confirm Password
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="confirmPassword"
onChange={[Function]}
@@ -236,6 +302,19 @@ exports[`accepts correct password confirmation 1`] = `
type="password"
value="testtest"
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
Passwords do not match. Try again.
</span>
</div>
</div>
<button
className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
@@ -326,6 +405,7 @@ exports[`accepts valid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -361,6 +441,7 @@ exports[`accepts valid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -391,6 +472,7 @@ exports[`accepts valid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -454,14 +536,27 @@ exports[`accepts valid username 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -512,6 +607,7 @@ exports[`accepts valid username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -542,6 +638,7 @@ exports[`accepts valid username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -605,14 +702,27 @@ exports[`checks for invalid characters in username 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -640,6 +750,7 @@ exports[`checks for invalid characters in username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -675,6 +786,7 @@ exports[`checks for invalid characters in username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -705,6 +817,7 @@ exports[`checks for invalid characters in username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -780,6 +893,7 @@ exports[`checks for invalid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -815,6 +929,7 @@ exports[`checks for invalid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -850,6 +965,7 @@ exports[`checks for invalid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -880,6 +996,7 @@ exports[`checks for invalid email 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -943,14 +1060,27 @@ exports[`checks for too long username 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -978,6 +1108,7 @@ exports[`checks for too long username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1013,6 +1144,7 @@ exports[`checks for too long username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1043,6 +1175,7 @@ exports[`checks for too long username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1106,14 +1239,27 @@ exports[`checks for too short password 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -1129,14 +1275,27 @@ exports[`checks for too short password 1`] = `
A unique identifier displayed on your comments. You may use “_” and “.”
</p>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="username"
onChange={[Function]}
placeholder="Username"
type="text"
value="hans"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -1164,6 +1323,7 @@ exports[`checks for too short password 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1194,6 +1354,7 @@ exports[`checks for too short password 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1257,14 +1418,27 @@ exports[`checks for too short username 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -1292,6 +1466,7 @@ exports[`checks for too short username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1327,6 +1502,7 @@ exports[`checks for too short username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1357,6 +1533,7 @@ exports[`checks for too short username 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1420,14 +1597,27 @@ exports[`checks for wrong password confirmation 1`] = `
Email Address
</label>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -1443,14 +1633,27 @@ exports[`checks for wrong password confirmation 1`] = `
A unique identifier displayed on your comments. You may use “_” and “.”
</p>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="username"
onChange={[Function]}
placeholder="Username"
type="text"
value="hans"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -1466,14 +1669,27 @@ exports[`checks for wrong password confirmation 1`] = `
Must be at least {$minLength} characters
</p>
<input
className="TextField-root TextField-colorRegular TextField-fullWidth"
className="TextField-root TextField-colorError TextField-fullWidth"
disabled={false}
name="password"
onChange={[Function]}
placeholder="Password"
type="password"
value="testtest"
value=""
/>
<div
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
</span>
<span>
This field is required.
</span>
</div>
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
@@ -1496,6 +1712,7 @@ exports[`checks for wrong password confirmation 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1698,6 +1915,7 @@ exports[`shows error when submitting empty form 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1733,6 +1951,7 @@ exports[`shows error when submitting empty form 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1768,6 +1987,7 @@ exports[`shows error when submitting empty form 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -1798,6 +2018,7 @@ exports[`shows error when submitting empty form 1`] = `
className="ValidationMessage-root ValidationMessage-colorError ValidationMessage-fullWidth"
>
<span
aria-hidden="true"
className="Icon-root ValidationMessage-icon Icon-sm"
>
warning
@@ -2111,11 +2332,6 @@ exports[`submits form successfully 1`] = `
>
Sign up to join the conversation
</h1>
<div
className="CallOut-root CallOut-colorError CallOut-fullWidth"
>
Server Error
</div>
<div
className="HorizontalGutter-root FormField-root HorizontalGutter-half"
>
@@ -2258,7 +2474,7 @@ exports[`submits form successfully 2`] = `
onChange={[Function]}
placeholder="Email Address"
type="text"
value="hans@test.com"
value=""
/>
</div>
<div
@@ -2281,7 +2497,7 @@ exports[`submits form successfully 2`] = `
onChange={[Function]}
placeholder="Username"
type="text"
value="hans"
value=""
/>
</div>
<div
@@ -2304,7 +2520,7 @@ exports[`submits form successfully 2`] = `
onChange={[Function]}
placeholder="Password"
type="password"
value="testtest"
value=""
/>
</div>
<div
@@ -2322,7 +2538,7 @@ exports[`submits form successfully 2`] = `
onChange={[Function]}
placeholder="Confirm Password"
type="password"
value="testtest"
value=""
/>
</div>
<button
src/core/client/auth/test/signIn.spec.tsx
+47 -23
View File
@@ -1,5 +1,8 @@
import React from "react";
import TestRenderer, { ReactTestInstance } from "react-test-renderer";
import TestRenderer, {
ReactTestInstance,
ReactTestRenderer,
} from "react-test-renderer";
import { RecordProxy } from "relay-runtime";
import sinon from "sinon";
@@ -12,32 +15,36 @@ import { createInMemoryStorage } from "talk-framework/lib/storage";
import createEnvironment from "./createEnvironment";
const environment = createEnvironment({
initLocalState: (localRecord: RecordProxy) => {
localRecord.setValue("SIGN_IN", "view");
},
});
const context: TalkContext = {
relayEnvironment: environment,
localeBundles: [],
localStorage: createInMemoryStorage(),
sessionStorage: createInMemoryStorage(),
rest: new RestClient("http://localhost/api"),
postMessage: new PostMessageService(),
};
const testRenderer = TestRenderer.create(
<TalkContextProvider value={context}>
<AppContainer />
</TalkContextProvider>
);
const inputPredicate = (name: string) => (n: ReactTestInstance) => {
return n.props.name === name && n.props.onChange;
};
const form = testRenderer.root.findByType("form");
let context: TalkContext;
let testRenderer: ReactTestRenderer;
let form: ReactTestInstance;
beforeEach(() => {
const environment = createEnvironment({
initLocalState: (localRecord: RecordProxy) => {
localRecord.setValue("SIGN_IN", "view");
},
});
context = {
relayEnvironment: environment,
localeBundles: [],
localStorage: createInMemoryStorage(),
sessionStorage: createInMemoryStorage(),
rest: new RestClient("http://localhost/api"),
postMessage: new PostMessageService(),
};
testRenderer = TestRenderer.create(
<TalkContextProvider value={context}>
<AppContainer />
</TalkContextProvider>
);
form = testRenderer.root.findByType("form");
});
it("renders sign in form", async () => {
expect(testRenderer.toJSON()).toMatchSnapshot();
@@ -52,6 +59,7 @@ it("checks for invalid email", async () => {
form
.find(inputPredicate("email"))
.props.onChange({ target: { value: "invalid-email" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -59,6 +67,7 @@ it("accepts valid email", async () => {
form
.find(inputPredicate("email"))
.props.onChange({ target: { value: "hans@test.com" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -66,10 +75,18 @@ it("accepts correct password", async () => {
form
.find(inputPredicate("password"))
.props.onChange({ target: { value: "testtest" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
it("shows server error", async () => {
form
.find(inputPredicate("email"))
.props.onChange({ target: { value: "hans@test.com" } });
form
.find(inputPredicate("password"))
.props.onChange({ target: { value: "testtest" } });
const windowMock = sinon.mock(window);
windowMock.expects("resizeTo");
@@ -105,6 +122,13 @@ it("shows server error", async () => {
});
it("submits form successfully", async () => {
form
.find(inputPredicate("email"))
.props.onChange({ target: { value: "hans@test.com" } });
form
.find(inputPredicate("password"))
.props.onChange({ target: { value: "testtest" } });
const windowMock = sinon.mock(window);
windowMock.expects("close").once();
windowMock.expects("resizeTo");
src/core/client/auth/test/signUp.spec.tsx
+67 -23
View File
@@ -1,5 +1,8 @@
import React from "react";
import TestRenderer, { ReactTestInstance } from "react-test-renderer";
import TestRenderer, {
ReactTestInstance,
ReactTestRenderer,
} from "react-test-renderer";
import { RecordProxy } from "relay-runtime";
import sinon from "sinon";
@@ -12,32 +15,37 @@ import { createInMemoryStorage } from "talk-framework/lib/storage";
import createEnvironment from "./createEnvironment";
const environment = createEnvironment({
initLocalState: (localRecord: RecordProxy) => {
localRecord.setValue("SIGN_UP", "view");
},
});
const context: TalkContext = {
relayEnvironment: environment,
localeBundles: [],
localStorage: createInMemoryStorage(),
sessionStorage: createInMemoryStorage(),
rest: new RestClient("http://localhost/api"),
postMessage: new PostMessageService(),
};
const testRenderer = TestRenderer.create(
<TalkContextProvider value={context}>
<AppContainer />
</TalkContextProvider>
);
const inputPredicate = (name: string) => (n: ReactTestInstance) => {
return n.props.name === name && n.props.onChange;
};
const form = testRenderer.root.findByType("form");
let context: TalkContext;
let testRenderer: ReactTestRenderer;
let form: ReactTestInstance;
beforeEach(() => {
const environment = createEnvironment({
initLocalState: (localRecord: RecordProxy) => {
localRecord.setValue("SIGN_UP", "view");
},
});
context = {
relayEnvironment: environment,
localeBundles: [],
localStorage: createInMemoryStorage(),
sessionStorage: createInMemoryStorage(),
rest: new RestClient("http://localhost/api"),
postMessage: new PostMessageService(),
};
testRenderer = TestRenderer.create(
<TalkContextProvider value={context}>
<AppContainer />
</TalkContextProvider>
);
form = testRenderer.root.findByType("form");
});
it("renders sign up form", async () => {
expect(testRenderer.toJSON()).toMatchSnapshot();
@@ -52,6 +60,7 @@ it("checks for invalid email", async () => {
form
.find(inputPredicate("email"))
.props.onChange({ target: { value: "invalid-email" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -59,6 +68,7 @@ it("accepts valid email", async () => {
form
.find(inputPredicate("email"))
.props.onChange({ target: { value: "hans@test.com" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -66,6 +76,7 @@ it("checks for too short username", async () => {
form
.find(inputPredicate("username"))
.props.onChange({ target: { value: "u" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -73,6 +84,7 @@ it("checks for too long username", async () => {
form
.find(inputPredicate("username"))
.props.onChange({ target: { value: "a".repeat(100) } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -80,6 +92,7 @@ it("checks for invalid characters in username", async () => {
form
.find(inputPredicate("username"))
.props.onChange({ target: { value: "$%$§$%$§%" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -87,6 +100,7 @@ it("accepts valid username", async () => {
form
.find(inputPredicate("username"))
.props.onChange({ target: { value: "hans" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -94,6 +108,7 @@ it("checks for too short password", async () => {
form
.find(inputPredicate("password"))
.props.onChange({ target: { value: "pass" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -101,6 +116,7 @@ it("accepts correct password", async () => {
form
.find(inputPredicate("password"))
.props.onChange({ target: { value: "testtest" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -108,6 +124,7 @@ it("checks for wrong password confirmation", async () => {
form
.find(inputPredicate("confirmPassword"))
.props.onChange({ target: { value: "not-matching" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
@@ -115,10 +132,24 @@ it("accepts correct password confirmation", async () => {
form
.find(inputPredicate("confirmPassword"))
.props.onChange({ target: { value: "testtest" } });
form.props.onSubmit();
expect(testRenderer.toJSON()).toMatchSnapshot();
});
it("shows server error", async () => {
form
.find(inputPredicate("email"))
.props.onChange({ target: { value: "hans@test.com" } });
form
.find(inputPredicate("username"))
.props.onChange({ target: { value: "hans" } });
form
.find(inputPredicate("password"))
.props.onChange({ target: { value: "testtest" } });
form
.find(inputPredicate("confirmPassword"))
.props.onChange({ target: { value: "testtest" } });
const windowMock = sinon.mock(window);
windowMock.expects("resizeTo");
@@ -155,6 +186,19 @@ it("shows server error", async () => {
});
it("submits form successfully", async () => {
form
.find(inputPredicate("email"))
.props.onChange({ target: { value: "hans@test.com" } });
form
.find(inputPredicate("username"))
.props.onChange({ target: { value: "hans" } });
form
.find(inputPredicate("password"))
.props.onChange({ target: { value: "testtest" } });
form
.find(inputPredicate("confirmPassword"))
.props.onChange({ target: { value: "testtest" } });
const windowMock = sinon.mock(window);
windowMock.expects("close").once();
windowMock.expects("resizeTo");