aboutsummaryrefslogtreecommitdiff
path: root/test
diff options
context:
space:
mode:
Diffstat (limited to 'test')
-rw-r--r--test/console/components/console/Completion.test.tsx259
-rw-r--r--test/console/components/console/CompletionItem.test.tsx21
-rw-r--r--test/console/components/console/CompletionTitle.test.tsx15
-rw-r--r--test/console/components/console/Message.test.tsx27
-rw-r--r--test/settings/components/form/BlacklistForm.test.tsx20
-rw-r--r--test/settings/components/form/SearchEngineForm.test.tsx10
-rw-r--r--test/settings/components/ui/Radio.test.tsx56
-rw-r--r--test/settings/components/ui/Text.test.tsx55
-rw-r--r--test/settings/components/ui/TextArea.test.tsx63
-rw-r--r--test/settings/components/ui/input.test.tsx146
10 files changed, 443 insertions, 229 deletions
diff --git a/test/console/components/console/Completion.test.tsx b/test/console/components/console/Completion.test.tsx
index 921720b..0e4e21f 100644
--- a/test/console/components/console/Completion.test.tsx
+++ b/test/console/components/console/Completion.test.tsx
@@ -1,11 +1,11 @@
import React from "react";
import Completion from "../../../../src/console/components/console/Completion";
-import ReactTestRenderer, { ReactTestInstance } from "react-test-renderer";
+import ReactTestRenderer from "react-test-renderer";
import { expect } from "chai";
import CompletionTitle from "../../../../src/console/components/console/CompletionTitle";
import CompletionItem from "../../../../src/console/components/console/CompletionItem";
-describe("console/components/console/completion", () => {
+describe("console/components/console/completion/Completion", () => {
const completions = [
{
name: "Fruit",
@@ -30,27 +30,19 @@ describe("console/components/console/completion", () => {
<Completion completions={completions} size={30} select={-1} />
).root;
- // const children = root.findByType('ul').children as Array<ReactTestInstance>;
- const children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children).to.have.lengthOf(8);
- expect(children.map((e) => e.type)).to.deep.equal([
- CompletionTitle,
- CompletionItem,
- CompletionItem,
- CompletionItem,
- CompletionTitle,
- CompletionItem,
- CompletionItem,
- CompletionItem,
- ]);
- expect(children[0].props.title).to.equal("Fruit");
- expect(children[1].props.caption).to.equal("apple");
- expect(children[2].props.caption).to.equal("banana");
- expect(children[3].props.caption).to.equal("cherry");
- expect(children[4].props.title).to.equal("Element");
- expect(children[5].props.caption).to.equal("argon");
- expect(children[6].props.caption).to.equal("boron");
- expect(children[7].props.caption).to.equal("carbon");
+ const groups = root.findAllByProps({ role: "group" });
+ expect(groups).to.have.lengthOf(2);
+
+ groups.forEach((group, i) => {
+ const title = group.findByType(CompletionTitle);
+ expect(title.props.title).to.equal(completions[i].name);
+
+ const items = group.findAllByType(CompletionItem);
+ expect(items).to.have.lengthOf(completions[i].items.length);
+ items.forEach((item, j) => {
+ expect(item.props.caption).to.equal(completions[i].items[j].caption);
+ });
+ });
});
it("highlight current item", () => {
@@ -58,8 +50,8 @@ describe("console/components/console/completion", () => {
<Completion completions={completions} size={30} select={3} />
).root;
- const children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children[5].props.highlight).to.be.true;
+ const items = root.findAllByType(CompletionItem);
+ expect(items[3].props.highlight).to.be.true;
});
it("does not highlight any items", () => {
@@ -67,8 +59,8 @@ describe("console/components/console/completion", () => {
<Completion completions={completions} size={30} select={-1} />
).root;
- const children = root.findByType("ul").findAllByType(CompletionItem);
- expect(children.every((e) => e.props.highlight === false)).to.be.true;
+ const items = root.findAllByType(CompletionItem);
+ expect(items.every((item) => item.props.highlight === false)).to.be.true;
});
it("limits completion items", () => {
@@ -76,19 +68,35 @@ describe("console/components/console/completion", () => {
<Completion completions={completions} size={3} select={-1} />
).root;
- let children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children).to.have.lengthOf(3);
+ const showns = root
+ .findAllByProps({ role: "group" })
+ .map((group) =>
+ [
+ group.findByType(CompletionTitle).props.shown,
+ group.findAllByType(CompletionItem).map((item) => item.props.shown),
+ ].flat()
+ )
+ .flat();
- expect(children[0].props.title).to.equal("Fruit");
- expect(children[1].props.caption).to.equal("apple");
- expect(children[2].props.caption).to.equal("banana");
+ expect(showns).to.deep.equal([
+ true,
+ true,
+ true,
+ false,
+ false,
+ false,
+ false,
+ false,
+ ]);
root = ReactTestRenderer.create(
<Completion completions={completions} size={3} select={0} />
).root;
- children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children[1].props.highlight).to.be.true;
+ const items = root
+ .findAllByType(CompletionItem)
+ .map((item) => item.props.shown);
+ expect(items[1]).to.be.true;
});
it("scrolls up to down with select", () => {
@@ -97,33 +105,76 @@ describe("console/components/console/completion", () => {
);
const root = component.root;
- let children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children).to.have.lengthOf(3);
- expect(children[0].props.title).to.equal("Fruit");
- expect(children[1].props.caption).to.equal("apple");
- expect(children[2].props.caption).to.equal("banana");
+ let items = root.findAllByType(CompletionItem);
+ let showns = root
+ .findAllByProps({ role: "group" })
+ .map((group) =>
+ [
+ group.findByType(CompletionTitle).props.shown,
+ group.findAllByType(CompletionItem).map((item) => item.props.shown),
+ ].flat()
+ )
+ .flat();
+ expect(showns).to.deep.equal([
+ true,
+ true,
+ true,
+ false,
+ false,
+ false,
+ false,
+ false,
+ ]);
component.update(
<Completion completions={completions} size={3} select={2} />
);
-
- children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children).to.have.lengthOf(3);
- expect(children[0].props.caption).to.equal("apple");
- expect(children[1].props.caption).to.equal("banana");
- expect(children[2].props.caption).to.equal("cherry");
- expect(children[2].props.highlight).to.be.true;
+ items = root.findAllByType(CompletionItem);
+ showns = root
+ .findAllByProps({ role: "group" })
+ .map((group) =>
+ [
+ group.findByType(CompletionTitle).props.shown,
+ group.findAllByType(CompletionItem).map((item) => item.props.shown),
+ ].flat()
+ )
+ .flat();
+ expect(showns).to.deep.equal([
+ false,
+ true,
+ true,
+ true,
+ false,
+ false,
+ false,
+ false,
+ ]);
+ expect(items[2].props.highlight).to.be.true;
component.update(
<Completion completions={completions} size={3} select={3} />
);
-
- children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children).to.have.lengthOf(3);
- expect(children[0].props.caption).to.equal("cherry");
- expect(children[1].props.title).to.equal("Element");
- expect(children[2].props.caption).to.equal("argon");
- expect(children[2].props.highlight).to.be.true;
+ items = root.findAllByType(CompletionItem);
+ showns = root
+ .findAllByProps({ role: "group" })
+ .map((group) =>
+ [
+ group.findByType(CompletionTitle).props.shown,
+ group.findAllByType(CompletionItem).map((item) => item.props.shown),
+ ].flat()
+ )
+ .flat();
+ expect(showns).to.deep.equal([
+ false,
+ false,
+ false,
+ true,
+ true,
+ true,
+ false,
+ false,
+ ]);
+ expect(items[3].props.highlight).to.be.true;
});
it("scrolls down to up with select", () => {
@@ -132,34 +183,102 @@ describe("console/components/console/completion", () => {
);
const root = component.root;
- let children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children).to.have.lengthOf(3);
- expect(children[0].props.caption).to.equal("argon");
- expect(children[1].props.caption).to.equal("boron");
- expect(children[2].props.caption).to.equal("carbon");
+ let items = root.findAllByType(CompletionItem);
+ let showns = root
+ .findAllByProps({ role: "group" })
+ .map((group) =>
+ [
+ group.findByType(CompletionTitle).props.shown,
+ group.findAllByType(CompletionItem).map((item) => item.props.shown),
+ ].flat()
+ )
+ .flat();
+
+ expect(showns).to.deep.equal([
+ false,
+ false,
+ false,
+ false,
+ false,
+ true,
+ true,
+ true,
+ ]);
+ expect(items[5].props.highlight).to.be.true;
component.update(
<Completion completions={completions} size={3} select={4} />
);
-
- children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children[1].props.highlight).to.be.true;
+ items = root.findAllByType(CompletionItem);
+ showns = root
+ .findAllByProps({ role: "group" })
+ .map((group) =>
+ [
+ group.findByType(CompletionTitle).props.shown,
+ group.findAllByType(CompletionItem).map((item) => item.props.shown),
+ ].flat()
+ )
+ .flat();
+ expect(showns).to.deep.equal([
+ false,
+ false,
+ false,
+ false,
+ false,
+ true,
+ true,
+ true,
+ ]);
+ expect(items[4].props.highlight).to.be.true;
component.update(
<Completion completions={completions} size={3} select={3} />
);
-
- children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children[0].props.highlight).to.be.true;
+ items = root.findAllByType(CompletionItem);
+ showns = root
+ .findAllByProps({ role: "group" })
+ .map((group) =>
+ [
+ group.findByType(CompletionTitle).props.shown,
+ group.findAllByType(CompletionItem).map((item) => item.props.shown),
+ ].flat()
+ )
+ .flat();
+ expect(showns).to.deep.equal([
+ false,
+ false,
+ false,
+ false,
+ false,
+ true,
+ true,
+ true,
+ ]);
+ expect(items[3].props.highlight).to.be.true;
component.update(
<Completion completions={completions} size={3} select={2} />
);
-
- children = root.findByType("ul").children as Array<ReactTestInstance>;
- expect(children[0].props.caption).to.equal("cherry");
- expect(children[1].props.title).to.equal("Element");
- expect(children[2].props.caption).to.equal("argon");
- expect(children[0].props.highlight).to.be.true;
+ items = root.findAllByType(CompletionItem);
+ showns = root
+ .findAllByProps({ role: "group" })
+ .map((group) =>
+ [
+ group.findByType(CompletionTitle).props.shown,
+ group.findAllByType(CompletionItem).map((item) => item.props.shown),
+ ].flat()
+ )
+ .flat();
+ expect(showns).to.deep.equal([
+ false,
+ false,
+ false,
+ true,
+ true,
+ true,
+ false,
+ false,
+ ]);
+ expect(items[2].props.highlight).to.be.true;
});
});
diff --git a/test/console/components/console/CompletionItem.test.tsx b/test/console/components/console/CompletionItem.test.tsx
new file mode 100644
index 0000000..3a4b1f2
--- /dev/null
+++ b/test/console/components/console/CompletionItem.test.tsx
@@ -0,0 +1,21 @@
+import React from "react";
+import ReactTestRenderer from "react-test-renderer";
+import { expect } from "chai";
+import CompletionItem from "../../../../src/console/components/console/CompletionItem";
+
+describe("console/components/console/completion/CompletionItem", () => {
+ it("renders a CompletionItem", () => {
+ const root = ReactTestRenderer.create(
+ <CompletionItem
+ shown={true}
+ highlight={false}
+ caption="twitter"
+ url="https://twitter.com/"
+ />
+ ).root;
+ const spans = root.findAllByType("span");
+ expect(spans).to.have.lengthOf(2);
+ expect(spans[0].children).to.deep.equal(["twitter"]);
+ expect(spans[1].children).to.deep.equal(["https://twitter.com/"]);
+ });
+});
diff --git a/test/console/components/console/CompletionTitle.test.tsx b/test/console/components/console/CompletionTitle.test.tsx
new file mode 100644
index 0000000..d8cc411
--- /dev/null
+++ b/test/console/components/console/CompletionTitle.test.tsx
@@ -0,0 +1,15 @@
+import React from "react";
+import ReactTestRenderer from "react-test-renderer";
+import { expect } from "chai";
+import CompletionTitle from "../../../../src/console/components/console/CompletionTitle";
+
+describe("console/components/console/completion/CompletionTitle", () => {
+ it("renders a CompletionTitle", () => {
+ const root = ReactTestRenderer.create(
+ <CompletionTitle title="Fruits" shown={true} />
+ ).root;
+
+ const li = root.findByType("li");
+ expect(li.children).to.deep.equal(["Fruits"]);
+ });
+});
diff --git a/test/console/components/console/Message.test.tsx b/test/console/components/console/Message.test.tsx
new file mode 100644
index 0000000..f8f950a
--- /dev/null
+++ b/test/console/components/console/Message.test.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+import ReactTestRenderer from "react-test-renderer";
+import { expect } from "chai";
+import Message from "../../../../src/console/components/console/Message";
+
+describe("console/components/console/completion/Message", () => {
+ it("renders an information message", () => {
+ const root = ReactTestRenderer.create(<Message mode="info">Hello!</Message>)
+ .root;
+
+ const p = root.findByType("p");
+
+ expect(p.props["role"]).to.equal("status");
+ expect(p.children).to.deep.equal(["Hello!"]);
+ });
+
+ it("renders an error message", () => {
+ const root = ReactTestRenderer.create(
+ <Message mode="error">Hello!</Message>
+ ).root;
+
+ const p = root.findByType("p");
+
+ expect(p.props["role"]).to.equal("alert");
+ expect(p.children).to.deep.equal(["Hello!"]);
+ });
+});
diff --git a/test/settings/components/form/BlacklistForm.test.tsx b/test/settings/components/form/BlacklistForm.test.tsx
index e34802a..8727c59 100644
--- a/test/settings/components/form/BlacklistForm.test.tsx
+++ b/test/settings/components/form/BlacklistForm.test.tsx
@@ -17,16 +17,16 @@ describe("settings/form/BlacklistForm", () => {
/>
).root;
- const rows = root.findAllByProps({
- className: "form-blacklist-form-row",
- });
+ const rows = root
+ .findAllByType("div")
+ .filter((instance) => instance.props.role === "listitem");
expect(rows).to.have.lengthOf(2);
- expect(
- rows[0].findByProps({ className: "column-url" }).props.value
- ).to.equal("*.slack.com");
- expect(
- rows[1].findByProps({ className: "column-url" }).props.value
- ).to.equal("www.google.com/maps");
+ expect(rows[0].findByProps({ name: "url" }).props.value).to.equal(
+ "*.slack.com"
+ );
+ expect(rows[1].findByProps({ name: "url" }).props.value).to.equal(
+ "www.google.com/maps"
+ );
expect(() => root.findByType(AddButton)).not.throw();
});
@@ -113,7 +113,7 @@ describe("settings/form/BlacklistForm", () => {
});
const button = document.querySelector(
- "input[type=button].ui-add-button"
+ "input[type=button][name=add]"
) as HTMLButtonElement;
ReactTestUtils.Simulate.click(button);
});
diff --git a/test/settings/components/form/SearchEngineForm.test.tsx b/test/settings/components/form/SearchEngineForm.test.tsx
index 5f835cc..7b10274 100644
--- a/test/settings/components/form/SearchEngineForm.test.tsx
+++ b/test/settings/components/form/SearchEngineForm.test.tsx
@@ -21,12 +21,16 @@ describe("settings/form/SearchForm", () => {
/>
).root;
- const names = root.findAllByProps({ name: "name" });
+ const names = root
+ .findAllByType("input")
+ .filter((instance) => instance.props.name === "name");
expect(names).to.have.lengthOf(2);
expect(names[0].props.value).to.equal("google");
expect(names[1].props.value).to.equal("yahoo");
- const urls = root.findAllByProps({ name: "url" });
+ const urls = root
+ .findAllByType("input")
+ .filter((instance) => instance.props.name === "url");
expect(urls).to.have.lengthOf(2);
expect(urls[0].props.value).to.equal("google.com");
expect(urls[1].props.value).to.equal("yahoo.com");
@@ -139,7 +143,7 @@ describe("settings/form/SearchForm", () => {
});
const button = document.querySelector(
- "input[type=button].ui-add-button"
+ "input[type=button][name=add]"
) as HTMLInputElement;
ReactTestUtils.Simulate.click(button);
});
diff --git a/test/settings/components/ui/Radio.test.tsx b/test/settings/components/ui/Radio.test.tsx
new file mode 100644
index 0000000..f929ee3
--- /dev/null
+++ b/test/settings/components/ui/Radio.test.tsx
@@ -0,0 +1,56 @@
+import React from "react";
+import ReactDOM from "react-dom";
+import ReactTestUtils from "react-dom/test-utils";
+import Radio from "../../../../src/settings/components/ui/Radio";
+import { expect } from "chai";
+
+describe("settings/ui/Radio", () => {
+ let container: HTMLDivElement;
+
+ beforeEach(() => {
+ container = document.createElement("div");
+ document.body.appendChild(container);
+ });
+
+ afterEach(() => {
+ document.body.removeChild(container);
+ });
+
+ it("renders radio button", () => {
+ ReactTestUtils.act(() => {
+ ReactDOM.render(
+ <Radio name="myradio" label="myfield" value="myvalue" />,
+ container
+ );
+ });
+
+ const label = document.querySelector("label")!;
+ const input = document.querySelector("input")!;
+ expect(label.textContent).to.contain("myfield");
+ expect(input.type).to.contain("radio");
+ expect(input.name).to.contain("myradio");
+ expect(input.value).to.contain("myvalue");
+ });
+
+ it("invoke onChange", (done) => {
+ ReactTestUtils.act(() => {
+ ReactDOM.render(
+ <Radio
+ name="myradio"
+ type="text"
+ label="myfield"
+ value="myvalue"
+ onChange={(e) => {
+ expect((e.target as HTMLInputElement).checked).to.be.true;
+ done();
+ }}
+ />,
+ container
+ );
+ });
+
+ const input = document.querySelector("input") as HTMLInputElement;
+ input.checked = true;
+ ReactTestUtils.Simulate.change(input);
+ });
+});
diff --git a/test/settings/components/ui/Text.test.tsx b/test/settings/components/ui/Text.test.tsx
new file mode 100644
index 0000000..d5451bb
--- /dev/null
+++ b/test/settings/components/ui/Text.test.tsx
@@ -0,0 +1,55 @@
+import React from "react";
+import ReactDOM from "react-dom";
+import ReactTestUtils from "react-dom/test-utils";
+import Text from "../../../../src/settings/components/ui/Text";
+import { expect } from "chai";
+
+describe("settings/ui/Text", () => {
+ let container: HTMLDivElement;
+
+ beforeEach(() => {
+ container = document.createElement("div");
+ document.body.appendChild(container);
+ });
+
+ afterEach(() => {
+ document.body.removeChild(container);
+ });
+
+ it("renders text input", () => {
+ ReactTestUtils.act(() => {
+ ReactDOM.render(
+ <Text name="myname" label="myfield" value="myvalue" />,
+ container
+ );
+ });
+
+ const label = document.querySelector("label")!;
+ const input = document.querySelector("input")!;
+ expect(label.textContent).to.contain("myfield");
+ expect(input.type).to.contain("text");
+ expect(input.name).to.contain("myname");
+ expect(input.value).to.contain("myvalue");
+ });
+
+ it("invoke onChange", (done) => {
+ ReactTestUtils.act(() => {
+ ReactDOM.render(
+ <Text
+ name="myname"
+ label="myfield"
+ value="myvalue"
+ onChange={(e) => {
+ expect((e.target as HTMLInputElement).value).to.equal("newvalue");
+ done();
+ }}
+ />,
+ container
+ );
+ });
+
+ const input = document.querySelector("input")!;
+ input.value = "newvalue";
+ ReactTestUtils.Simulate.change(input);
+ });
+});
diff --git a/test/settings/components/ui/TextArea.test.tsx b/test/settings/components/ui/TextArea.test.tsx
new file mode 100644
index 0000000..232c7c0
--- /dev/null
+++ b/test/settings/components/ui/TextArea.test.tsx
@@ -0,0 +1,63 @@
+import React from "react";
+import ReactDOM from "react-dom";
+import ReactTestUtils from "react-dom/test-utils";
+import TextArea from "../../../../src/settings/components/ui/TextArea";
+import { expect } from "chai";
+
+describe("settings/ui/TextArea", () => {
+ let container: HTMLDivElement;
+
+ beforeEach(() => {
+ container = document.createElement("div");
+ document.body.appendChild(container);
+ });
+
+ afterEach(() => {
+ document.body.removeChild(container);
+ });
+
+ it("renders textarea", () => {
+ ReactTestUtils.act(() => {
+ ReactDOM.render(
+ <TextArea
+ type="textarea"
+ name="myname"
+ label="myfield"
+ value="myvalue"
+ error="myerror"
+ />,
+ container
+ );
+ });
+
+ const label = document.querySelector("label")!;
+ const textarea = document.querySelector("textarea")!;
+ const error = document.querySelector("[role=alert]")!;
+ expect(label.textContent).to.contain("myfield");
+ expect(textarea.nodeName).to.contain("TEXTAREA");
+ expect(textarea.name).to.contain("myname");
+ expect(textarea.value).to.contain("myvalue");
+ expect(error.textContent).to.contain("myerror");
+ });
+
+ it("invoke onChange", (done) => {
+ ReactTestUtils.act(() => {
+ ReactDOM.render(
+ <TextArea
+ name="myname"
+ label="myfield"
+ value="myvalue"
+ onChange={(e) => {
+ expect((e.target as HTMLInputElement).value).to.equal("newvalue");
+ done();
+ }}
+ />,
+ container
+ );
+ });
+
+ const input = document.querySelector("textarea")!;
+ input.value = "newvalue";
+ ReactTestUtils.Simulate.change(input);
+ });
+});
diff --git a/test/settings/components/ui/input.test.tsx b/test/settings/components/ui/input.test.tsx
deleted file mode 100644
index d244d8f..0000000
--- a/test/settings/components/ui/input.test.tsx
+++ /dev/null
@@ -1,146 +0,0 @@
-import React from "react";
-import ReactDOM from "react-dom";
-import ReactTestUtils from "react-dom/test-utils";
-import Input from "../../../../src/settings/components/ui/Input";
-import { expect } from "chai";
-
-describe("settings/ui/Input", () => {
- let container: HTMLDivElement;
-
- beforeEach(() => {
- container = document.createElement("div");
- document.body.appendChild(container);
- });
-
- afterEach(() => {
- document.body.removeChild(container);
- });
-
- context("type=text", () => {
- it("renders text input", () => {
- ReactTestUtils.act(() => {
- ReactDOM.render(
- <Input type="text" name="myname" label="myfield" value="myvalue" />,
- container
- );
- });
-
- const label = document.querySelector("label")!;
- const input = document.querySelector("input")!;
- expect(label.textContent).to.contain("myfield");
- expect(input.type).to.contain("text");
- expect(input.name).to.contain("myname");
- expect(input.value).to.contain("myvalue");
- });
-
- it("invoke onChange", (done) => {
- ReactTestUtils.act(() => {
- ReactDOM.render(
- <Input
- type="text"
- name="myname"
- label="myfield"
- value="myvalue"
- onChange={(e) => {
- expect((e.target as HTMLInputElement).value).to.equal("newvalue");
- done();
- }}
- />,
- container
- );
- });
-
- const input = document.querySelector("input")!;
- input.value = "newvalue";
- ReactTestUtils.Simulate.change(input);
- });
- });
-
- context("type=radio", () => {
- it("renders radio button", () => {
- ReactTestUtils.act(() => {
- ReactDOM.render(
- <Input type="radio" name="myname" label="myfield" value="myvalue" />,
- container
- );
- });
-
- const label = document.querySelector("label")!;
- const input = document.querySelector("input")!;
- expect(label.textContent).to.contain("myfield");
- expect(input.type).to.contain("radio");
- expect(input.name).to.contain("myname");
- expect(input.value).to.contain("myvalue");
- });
-
- it("invoke onChange", (done) => {
- ReactTestUtils.act(() => {
- ReactDOM.render(
- <Input
- type="text"
- name="radio"
- label="myfield"
- value="myvalue"
- onChange={(e) => {
- expect((e.target as HTMLInputElement).checked).to.be.true;
- done();
- }}
- />,
- container
- );
- });
-
- const input = document.querySelector("input") as HTMLInputElement;
- input.checked = true;
- ReactTestUtils.Simulate.change(input);
- });
- });
-
- context("type=textarea", () => {
- it("renders textarea button", () => {
- ReactTestUtils.act(() => {
- ReactDOM.render(
- <Input
- type="textarea"
- name="myname"
- label="myfield"
- value="myvalue"
- error="myerror"
- />,
- container
- );
- });
-
- const label = document.querySelector("label")!;
- const textarea = document.querySelector("textarea")!;
- const error = document.querySelector(".settings-ui-input-error")!;
- expect(label.textContent).to.contain("myfield");
- expect(textarea.nodeName).to.contain("TEXTAREA");
- expect(textarea.name).to.contain("myname");
- expect(textarea.value).to.contain("myvalue");
- expect(error.textContent).to.contain("myerror");
- });
-
- it("invoke onChange", (done) => {
- ReactTestUtils.act(() => {
- ReactDOM.render(
- <Input
- type="textarea"
- name="myname"
- label="myfield"
- value="myvalue"
- onChange={(e) => {
- expect((e.target as HTMLInputElement).value).to.equal("newvalue");
- done();
- }}
- />,
- container
- );
- });
-
- const input = document.querySelector("textarea")!;
- input.value = "newvalue";
- ReactTestUtils.Simulate.change(input);
- });
- });
-});