Adds test for register.jsx and snapshot
This commit is contained in:
13
src/components/Register-snapshot.test.jsx
Normal file
13
src/components/Register-snapshot.test.jsx
Normal file
@@ -0,0 +1,13 @@
|
||||
import React from "react";
|
||||
import renderer from "react-test-renderer";
|
||||
import Register from "./Register";
|
||||
|
||||
test("Register Snapshot", () => {
|
||||
const registerFunc = jest.fn();
|
||||
|
||||
const register = renderer.create(<Register register={registerFunc} />);
|
||||
|
||||
const tree = register.toJSON();
|
||||
|
||||
expect(tree).toMatchSnapshot();
|
||||
});
|
||||
24
src/components/Register.test.jsx
Normal file
24
src/components/Register.test.jsx
Normal file
@@ -0,0 +1,24 @@
|
||||
import React from "react";
|
||||
import { render } from "@testing-library/react";
|
||||
import userEvent from "@testing-library/user-event";
|
||||
import Register from "./Register";
|
||||
|
||||
test("Register inputs", () => {
|
||||
const registerFunc = jest.fn();
|
||||
const register = render(<Register register={registerFunc} />);
|
||||
|
||||
const usernameInput = register.getByRole("textbox", { name: /Username/ });
|
||||
const displayNameInput = register.getByRole("textbox", { name: /Name/ })
|
||||
const passwordInput = register.getByLabelText("Password");
|
||||
const buttonInput = register.getByRole("button", { name: /Sign me up/i });
|
||||
|
||||
const username = "here's a username";
|
||||
const displayName = "testing this is a display name for a person";
|
||||
const pw = "here's a password";
|
||||
|
||||
userEvent.type(usernameInput, username);
|
||||
userEvent.type(displayNameInput, displayName)
|
||||
userEvent.type(passwordInput, pw);
|
||||
userEvent.click(buttonInput);
|
||||
expect(registerFunc).toHaveBeenCalledWith(username, displayName, pw);
|
||||
});
|
||||
52
src/components/__snapshots__/Register-snapshot.test.jsx.snap
Normal file
52
src/components/__snapshots__/Register-snapshot.test.jsx.snap
Normal file
@@ -0,0 +1,52 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`Register Snapshot 1`] = `
|
||||
<div
|
||||
className="register-wrapper"
|
||||
>
|
||||
<h1>
|
||||
Enter your data to register.
|
||||
</h1>
|
||||
<form
|
||||
onSubmit={[Function]}
|
||||
>
|
||||
<label>
|
||||
<p>
|
||||
Username
|
||||
</p>
|
||||
<input
|
||||
id="username"
|
||||
onChange={[Function]}
|
||||
type="text"
|
||||
/>
|
||||
</label>
|
||||
<label>
|
||||
<p>
|
||||
Name
|
||||
</p>
|
||||
<input
|
||||
id="displayName"
|
||||
onChange={[Function]}
|
||||
type="text"
|
||||
/>
|
||||
</label>
|
||||
<label>
|
||||
<p>
|
||||
Password
|
||||
</p>
|
||||
<input
|
||||
id="password"
|
||||
onChange={[Function]}
|
||||
type="password"
|
||||
/>
|
||||
</label>
|
||||
<div>
|
||||
<button
|
||||
type="submit"
|
||||
>
|
||||
Sign me up
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
`;
|
||||
Reference in New Issue
Block a user