1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
|
import React from "react";
import { render } from "@testing-library/react";
import FormListing from "../../components/FormListing";
import { BrowserRouter as Router } from "react-router-dom";
import { Form, FormFeatures } from "../../api/forms";
import { QuestionType } from "../../api/question";
const openFormListing: Form = {
name: "Example form listing",
id: "example-form-listing",
description: "My form listing",
features: [FormFeatures.Discoverable, FormFeatures.Open],
questions: [
{
"id": "my-question",
"name": "My question",
"type": QuestionType.ShortText,
"data": {},
required: false
}
],
webhook: null,
submitted_text: null
};
const closedFormListing: Form = {
name: "Example form listing",
id: "example-form-listing",
description: "My form listing",
features: [FormFeatures.Discoverable],
questions: [
{
"id": "what-should-i-ask",
"name": "What should I ask?",
"type": QuestionType.ShortText,
"data": {},
required: false
}
],
webhook: null,
submitted_text: null
};
test("renders form listing with specified title", () => {
const { getByText } = render(<Router><FormListing form={openFormListing} /></Router>);
const formListing = getByText(/Example form listing/i);
expect(formListing).toBeInTheDocument();
});
test("renders form listing with specified description", () => {
const { getByText } = render(<Router><FormListing form={openFormListing} /></Router>);
const formListing = getByText(/My form listing/i);
expect(formListing).toBeInTheDocument();
});
test("renders form listing with background green colour for open", () => {
const { container } = render(<Router><FormListing form={openFormListing} /></Router>);
const elem = container.querySelector("a");
expect(elem).not.toBeNull();
if (elem) {
const style = window.getComputedStyle(elem);
expect(style.backgroundColor).toBe("rgb(55, 128, 94)");
}
});
test("renders form listing with background dark colour for closed", () => {
const { container } = render(<Router><FormListing form={closedFormListing} /></Router>);
const elem = container.querySelector("a");
expect(elem).not.toBeNull();
if (elem) {
const style = window.getComputedStyle(elem);
expect(style.backgroundColor).toBe("rgb(44, 47, 51)");
}
});
|