Skip to content
This repository was archived by the owner on Aug 8, 2019. It is now read-only.

Commit f710de2

Browse files
author
condef5
committed
Add test for create-sport-field
1 parent 5efe212 commit f710de2

4 files changed

Lines changed: 181 additions & 7 deletions

File tree

client/src/services/sport-field.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import fetch from "isomorphic-fetch";
21
import { apiUrl } from "../utils";
32

43
async function postSportField(sportField) {
@@ -9,7 +8,7 @@ async function postSportField(sportField) {
98
contentType: "application/json"
109
});
1110

12-
if (!response.ok) {
11+
if (!response.ok) {
1312
const errors = await response.json();
1413
throw new Error(errors);
1514
}
Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`CreateSportField View 1`] = `
4+
<DocumentFragment>
5+
<div
6+
class="css-2dm21w-CreateSportField"
7+
>
8+
<form>
9+
<div
10+
class="css-fzhjnh-CreateSportField"
11+
>
12+
<label
13+
class="css-1vx6px3-Label"
14+
for="name"
15+
>
16+
Name
17+
</label>
18+
<input
19+
aria-label="enter name"
20+
autocomplete="off"
21+
class="css-s3z14w-Input"
22+
id="name"
23+
name="name"
24+
placeholder="Sports field's name"
25+
required=""
26+
type="text"
27+
value=""
28+
/>
29+
</div>
30+
<div
31+
class="css-fzhjnh-CreateSportField"
32+
>
33+
<label
34+
class="css-1vx6px3-Label"
35+
for="description"
36+
>
37+
Description
38+
</label>
39+
<input
40+
aria-label="enter description"
41+
class="css-s3z14w-Input"
42+
id="description"
43+
name="description"
44+
placeholder="Sports field's description"
45+
required=""
46+
type="text"
47+
value=""
48+
/>
49+
</div>
50+
<div
51+
class="css-fzhjnh-CreateSportField"
52+
>
53+
<label
54+
class="css-1vx6px3-Label"
55+
for="image"
56+
>
57+
Image(s)
58+
</label>
59+
<input
60+
aria-label="choose image"
61+
class="css-s3z14w-Input"
62+
id="image"
63+
name="image"
64+
required=""
65+
type="file"
66+
/>
67+
</div>
68+
<div
69+
class="css-fzhjnh-CreateSportField"
70+
>
71+
<label
72+
class="css-1vx6px3-Label"
73+
>
74+
Prices
75+
</label>
76+
<div
77+
class="css-111oolb-CreateSportField"
78+
>
79+
<label
80+
class="css-ypeytr-CreateSportField"
81+
for="price_day"
82+
>
83+
Day:
84+
</label>
85+
<input
86+
aria-label="enter price-day"
87+
class="css-uqawe0-CreateSportField"
88+
id="price_day"
89+
name="price_day"
90+
required=""
91+
type="number"
92+
value=""
93+
/>
94+
</div>
95+
<div
96+
class="css-111oolb-CreateSportField"
97+
>
98+
<label
99+
class="css-ypeytr-CreateSportField"
100+
for="price_night"
101+
>
102+
Night:
103+
</label>
104+
<input
105+
aria-label="enter price-night"
106+
class="css-uqawe0-CreateSportField"
107+
id="price_night"
108+
name="price_night"
109+
required=""
110+
type="number"
111+
value=""
112+
/>
113+
</div>
114+
</div>
115+
<div
116+
class="css-fzhjnh-CreateSportField"
117+
>
118+
<button
119+
class="css-lrasnk-Button"
120+
>
121+
Create
122+
</button>
123+
</div>
124+
</form>
125+
</div>
126+
</DocumentFragment>
127+
`;

client/src/views/create-sport-field.js

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -44,38 +44,47 @@ function CreateSportField() {
4444
margin: "auto"
4545
}}
4646
>
47-
{/* <h1 css={{ letterSpacing: "-.066875rem", lineHeight: "1.5" }}>
48-
New Club
49-
</h1> */}
5047
<form onSubmit={handleSubmit}>
5148
<div css={{ marginTop: "2em" }}>
5249
<Label htmlFor="name">Name</Label>
5350
<Input
51+
aria-label="enter name"
52+
autoComplete="off"
5453
id="name"
5554
name="name"
5655
type="text"
5756
placeholder="Sports field's name"
5857
value={fields.name}
5958
onChange={handleChange}
59+
required
6060
/>
6161
</div>
6262
<div css={{ marginTop: "2em" }}>
6363
<Label htmlFor="description">Description</Label>
6464
<Input
65+
aria-label="enter description"
6566
id="description"
6667
placeholder="Sports field's description"
6768
name="description"
6869
type="text"
6970
value={fields.description}
7071
onChange={handleChange}
72+
required
7173
/>
7274
</div>
7375
<div css={{ marginTop: "2em" }}>
7476
<Label htmlFor="image">Image(s)</Label>
75-
<Input id="image" name="image" type="file" onChange={handleChange} />
77+
<Input
78+
aria-label="choose image"
79+
required
80+
id="image"
81+
name="image"
82+
type="file"
83+
onChange={handleChange}
84+
/>
7685
</div>
7786
<div css={{ marginTop: "2em" }}>
78-
<Label htmlFor="schedule">Prices</Label>
87+
<Label>Prices</Label>
7988
<div
8089
css={{ marginTop: "0.75em", display: "flex", alignItems: "center" }}
8190
>
@@ -89,12 +98,14 @@ function CreateSportField() {
8998
Day:{" "}
9099
</label>
91100
<Input
101+
aria-label="enter price-day"
92102
id="price_day"
93103
name="price_day"
94104
type="number"
95105
css={{ maxWidth: "80px" }}
96106
value={fields.price_day}
97107
onChange={handleChange}
108+
required
98109
/>
99110
</div>
100111
<div
@@ -110,12 +121,14 @@ function CreateSportField() {
110121
Night:
111122
</label>
112123
<Input
124+
aria-label="enter price-night"
113125
id="price_night"
114126
name="price_night"
115127
type="number"
116128
css={{ maxWidth: "80px" }}
117129
value={fields.price_night}
118130
onChange={handleChange}
131+
required
119132
/>
120133
</div>
121134
</div>
Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
import React from "react";
2+
import { render, fireEvent } from "@testing-library/react";
3+
import CreateSportField from "./create-sport-field";
4+
5+
test("CreateSportField View", () => {
6+
const { asFragment, getByLabelText } = render(<CreateSportField />);
7+
8+
expect(asFragment()).toMatchSnapshot();
9+
10+
const inputName = getByLabelText("enter name");
11+
fireEvent.change(inputName, {
12+
target: { value: "Sport field green" }
13+
});
14+
15+
const inputDescription = getByLabelText("enter description");
16+
fireEvent.change(inputDescription, {
17+
target: { value: "Sport field awesome" }
18+
});
19+
20+
const file = new File(["(⌐□_□)"], "shinji-ikari.png", { type: "image/png" });
21+
const imageInput = getByLabelText("choose image");
22+
fireEvent.change(imageInput, { target: { files: [file] } });
23+
24+
const inputPriceDay = getByLabelText("enter price-day");
25+
fireEvent.change(inputPriceDay, {
26+
target: { value: 70 }
27+
});
28+
29+
const inputPriceNight = getByLabelText("enter price-night");
30+
fireEvent.change(inputPriceNight, {
31+
target: { value: 120 }
32+
});
33+
34+
// fireEvent.submit(inputName);
35+
});

0 commit comments

Comments
 (0)