aboutsummaryrefslogtreecommitdiff
path: root/test/settings/components/form
diff options
context:
space:
mode:
authorShin'ya Ueoka <ueokande@i-beam.org>2020-04-13 20:37:36 +0900
committerShin'ya Ueoka <ueokande@i-beam.org>2020-04-13 20:37:36 +0900
commite1dac618a8b8929f601c7ec8aca3842c5ebf9d03 (patch)
tree6a914a8243c8c02e7752a83667a54d3fa832955c /test/settings/components/form
parent685f2b7b69218b06b5bb676069e35f79c5048c9b (diff)
Use plugin:prettier/recommended
Diffstat (limited to 'test/settings/components/form')
-rw-r--r--test/settings/components/form/BlacklistForm.test.tsx112
-rw-r--r--test/settings/components/form/KeymapsForm.test.tsx68
-rw-r--r--test/settings/components/form/PropertiesForm.test.tsx121
-rw-r--r--test/settings/components/form/SearchEngineForm.test.tsx165
4 files changed, 265 insertions, 201 deletions
diff --git a/test/settings/components/form/BlacklistForm.test.tsx b/test/settings/components/form/BlacklistForm.test.tsx
index 6c329ff..4d79383 100644
--- a/test/settings/components/form/BlacklistForm.test.tsx
+++ b/test/settings/components/form/BlacklistForm.test.tsx
@@ -1,40 +1,44 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import ReactTestRenderer from 'react-test-renderer';
-import ReactTestUtils from 'react-dom/test-utils';
-import { expect } from 'chai'
+import React from "react";
+import ReactDOM from "react-dom";
+import ReactTestRenderer from "react-test-renderer";
+import ReactTestUtils from "react-dom/test-utils";
+import { expect } from "chai";
-import BlacklistForm from '../../../../src/settings/components/form/BlacklistForm'
-import Blacklist from '../../../../src/shared/settings/Blacklist';
+import BlacklistForm from "../../../../src/settings/components/form/BlacklistForm";
+import Blacklist from "../../../../src/shared/settings/Blacklist";
describe("settings/form/BlacklistForm", () => {
- describe('render', () => {
- it('renders BlacklistForm', () => {
+ describe("render", () => {
+ it("renders BlacklistForm", () => {
const root = ReactTestRenderer.create(
- <BlacklistForm value={Blacklist.fromJSON(['*.slack.com', 'www.google.com/maps'])} />,
+ <BlacklistForm
+ value={Blacklist.fromJSON(["*.slack.com", "www.google.com/maps"])}
+ />
).root;
const children = root.children[0].children;
expect(children).to.have.lengthOf(3);
- expect(children[0].children[0].props.value).to.equal('*.slack.com');
- expect(children[1].children[0].props.value).to.equal('www.google.com/maps');
- expect(children[2].props.name).to.equal('add');
+ expect(children[0].children[0].props.value).to.equal("*.slack.com");
+ expect(children[1].children[0].props.value).to.equal(
+ "www.google.com/maps"
+ );
+ expect(children[2].props.name).to.equal("add");
});
- it('renders blank value', () => {
+ it("renders blank value", () => {
const root = ReactTestRenderer.create(<BlacklistForm />).root;
const children = root.children[0].children;
expect(children).to.have.lengthOf(1);
- expect(children[0].props.name).to.equal('add');
+ expect(children[0].props.name).to.equal("add");
});
});
- describe('onChange', () => {
+ describe("onChange", () => {
let container;
beforeEach(() => {
- container = document.createElement('div');
+ container = document.createElement("div");
document.body.appendChild(container);
});
@@ -43,52 +47,64 @@ describe("settings/form/BlacklistForm", () => {
container = null;
});
- it('invokes onChange event on edit', (done) => {
+ it("invokes onChange event on edit", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<BlacklistForm
- value={Blacklist.fromJSON(['*.slack.com', 'www.google.com/maps*'])}
- onChange={value => {
- const urls = value.items.map(item => item.pattern);
- expect(urls).to.have.members(['gitter.im', 'www.google.com/maps*']);
- done();
- }}
- />, container)
+ ReactDOM.render(
+ <BlacklistForm
+ value={Blacklist.fromJSON(["*.slack.com", "www.google.com/maps*"])}
+ onChange={(value) => {
+ const urls = value.items.map((item) => item.pattern);
+ expect(urls).to.have.members([
+ "gitter.im",
+ "www.google.com/maps*",
+ ]);
+ done();
+ }}
+ />,
+ container
+ );
});
- const input = document.querySelectorAll('input[type=text]')[0];
- input.value = 'gitter.im';
+ const input = document.querySelectorAll("input[type=text]")[0];
+ input.value = "gitter.im";
ReactTestUtils.Simulate.change(input);
});
- it('invokes onChange event on delete', (done) => {
+ it("invokes onChange event on delete", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<BlacklistForm
- value={Blacklist.fromJSON(['*.slack.com', 'www.google.com/maps*'])}
- onChange={value => {
- const urls = value.items.map(item => item.pattern);
- expect(urls).to.have.members(['www.google.com/maps*']);
- done();
- }}
- />, container)
+ ReactDOM.render(
+ <BlacklistForm
+ value={Blacklist.fromJSON(["*.slack.com", "www.google.com/maps*"])}
+ onChange={(value) => {
+ const urls = value.items.map((item) => item.pattern);
+ expect(urls).to.have.members(["www.google.com/maps*"]);
+ done();
+ }}
+ />,
+ container
+ );
});
- const button = document.querySelectorAll('input[type=button]')[0];
+ const button = document.querySelectorAll("input[type=button]")[0];
ReactTestUtils.Simulate.click(button);
});
- it('invokes onChange event on add', (done) => {
+ it("invokes onChange event on add", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<BlacklistForm
- value={Blacklist.fromJSON(['*.slack.com'])}
- onChange={value => {
- const urls = value.items.map(item => item.pattern);
- expect(urls).to.have.members(['*.slack.com', '']);
- done();
- }}
- />, container);
+ ReactDOM.render(
+ <BlacklistForm
+ value={Blacklist.fromJSON(["*.slack.com"])}
+ onChange={(value) => {
+ const urls = value.items.map((item) => item.pattern);
+ expect(urls).to.have.members(["*.slack.com", ""]);
+ done();
+ }}
+ />,
+ container
+ );
});
- const button = document.querySelector('input[type=button].ui-add-button');
+ const button = document.querySelector("input[type=button].ui-add-button");
ReactTestUtils.Simulate.click(button);
});
});
diff --git a/test/settings/components/form/KeymapsForm.test.tsx b/test/settings/components/form/KeymapsForm.test.tsx
index ccc772c..0a88db5 100644
--- a/test/settings/components/form/KeymapsForm.test.tsx
+++ b/test/settings/components/form/KeymapsForm.test.tsx
@@ -1,27 +1,31 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import ReactTestRenderer from 'react-test-renderer';
-import ReactTestUtils from 'react-dom/test-utils';
-import KeymapsForm from '../../../../src/settings/components/form/KeymapsForm'
-import { FormKeymaps } from 'shared/SettingData';
-import { expect } from 'chai';
+import React from "react";
+import ReactDOM from "react-dom";
+import ReactTestRenderer from "react-test-renderer";
+import ReactTestUtils from "react-dom/test-utils";
+import KeymapsForm from "../../../../src/settings/components/form/KeymapsForm";
+import { FormKeymaps } from "shared/SettingData";
+import { expect } from "chai";
describe("settings/form/KeymapsForm", () => {
- describe('render', () => {
- it('renders keymap fields', () => {
- const root = ReactTestRenderer.create(<KeymapsForm value={FormKeymaps.fromJSON({
- 'scroll.vertically?{"count":1}': 'j',
- 'scroll.vertically?{"count":-1}': 'k',
- })} />).root
+ describe("render", () => {
+ it("renders keymap fields", () => {
+ const root = ReactTestRenderer.create(
+ <KeymapsForm
+ value={FormKeymaps.fromJSON({
+ 'scroll.vertically?{"count":1}': "j",
+ 'scroll.vertically?{"count":-1}': "k",
+ })}
+ />
+ ).root;
const inputj = root.findByProps({ id: 'scroll.vertically?{"count":1}' });
const inputk = root.findByProps({ id: 'scroll.vertically?{"count":-1}' });
- expect(inputj.props.value).to.equal('j');
- expect(inputk.props.value).to.equal('k');
+ expect(inputj.props.value).to.equal("j");
+ expect(inputk.props.value).to.equal("k");
});
- it('renders blank value', () => {
+ it("renders blank value", () => {
const root = ReactTestRenderer.create(<KeymapsForm />).root;
const inputj = root.findByProps({ id: 'scroll.vertically?{"count":1}' });
@@ -32,11 +36,11 @@ describe("settings/form/KeymapsForm", () => {
});
});
- describe('onChange event', () => {
+ describe("onChange event", () => {
let container;
beforeEach(() => {
- container = document.createElement('div');
+ container = document.createElement("div");
document.body.appendChild(container);
});
@@ -45,21 +49,27 @@ describe("settings/form/KeymapsForm", () => {
container = null;
});
- it('invokes onChange event on edit', (done) => {
+ it("invokes onChange event on edit", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<KeymapsForm
- value={FormKeymaps.fromJSON({
- 'scroll.vertically?{"count":1}': 'j',
- 'scroll.vertically?{"count":-1}': 'k',
- })}
- onChange={value => {
- expect(value.toJSON()['scroll.vertically?{"count":1}']).to.equal('jjj');
- done();
- }} />, container);
+ ReactDOM.render(
+ <KeymapsForm
+ value={FormKeymaps.fromJSON({
+ 'scroll.vertically?{"count":1}': "j",
+ 'scroll.vertically?{"count":-1}': "k",
+ })}
+ onChange={(value) => {
+ expect(value.toJSON()['scroll.vertically?{"count":1}']).to.equal(
+ "jjj"
+ );
+ done();
+ }}
+ />,
+ container
+ );
});
const input = document.getElementById('scroll.vertically?{"count":1}');
- input.value = 'jjj';
+ input.value = "jjj";
ReactTestUtils.Simulate.change(input);
});
});
diff --git a/test/settings/components/form/PropertiesForm.test.tsx b/test/settings/components/form/PropertiesForm.test.tsx
index 4a0e25a..4dc00a2 100644
--- a/test/settings/components/form/PropertiesForm.test.tsx
+++ b/test/settings/components/form/PropertiesForm.test.tsx
@@ -1,47 +1,47 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import ReactTestRenderer from 'react-test-renderer';
-import ReactTestUtils from 'react-dom/test-utils';
-import PropertiesForm from 'settings/components/form/PropertiesForm'
+import React from "react";
+import ReactDOM from "react-dom";
+import ReactTestRenderer from "react-test-renderer";
+import ReactTestUtils from "react-dom/test-utils";
+import PropertiesForm from "settings/components/form/PropertiesForm";
describe("settings/form/PropertiesForm", () => {
- describe('render', () => {
- it('renders PropertiesForm', () => {
+ describe("render", () => {
+ it("renders PropertiesForm", () => {
const types = {
- mystr: 'string',
- mynum: 'number',
- mybool: 'boolean',
- empty: 'string',
- }
+ mystr: "string",
+ mynum: "number",
+ mybool: "boolean",
+ empty: "string",
+ };
const values = {
- mystr: 'abc',
+ mystr: "abc",
mynum: 123,
mybool: true,
};
const root = ReactTestRenderer.create(
- <PropertiesForm types={types} value={values} />,
- ).root
+ <PropertiesForm types={types} value={values} />
+ ).root;
- let input = root.findByProps({ name: 'mystr' });
- expect(input.props.type).to.equals('text');
- expect(input.props.value).to.equal('abc');
+ let input = root.findByProps({ name: "mystr" });
+ expect(input.props.type).to.equals("text");
+ expect(input.props.value).to.equal("abc");
- input = root.findByProps({ name: 'mynum' });
- expect(input.props.type).to.equals('number');
+ input = root.findByProps({ name: "mynum" });
+ expect(input.props.type).to.equals("number");
expect(input.props.value).to.equal(123);
- input = root.findByProps({ name: 'mybool' });
- expect(input.props.type).to.equals('checkbox');
+ input = root.findByProps({ name: "mybool" });
+ expect(input.props.type).to.equals("checkbox");
expect(input.props.value).to.equal(true);
});
});
- describe('onChange', () => {
+ describe("onChange", () => {
let container;
beforeEach(() => {
- container = document.createElement('div');
+ container = document.createElement("div");
document.body.appendChild(container);
});
@@ -50,53 +50,62 @@ describe("settings/form/PropertiesForm", () => {
container = null;
});
- it('invokes onChange event on text changed', (done) => {
+ it("invokes onChange event on text changed", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<PropertiesForm
- types={{ 'myvalue': 'string' }}
- value={{ 'myvalue': 'abc' }}
- onChange={value => {
- expect(value).to.have.property('myvalue', 'abcd');
- done();
- }}
- />, container);
+ ReactDOM.render(
+ <PropertiesForm
+ types={{ myvalue: "string" }}
+ value={{ myvalue: "abc" }}
+ onChange={(value) => {
+ expect(value).to.have.property("myvalue", "abcd");
+ done();
+ }}
+ />,
+ container
+ );
});
- const input = document.querySelector('input[name=myvalue]');
- input.value = 'abcd'
+ const input = document.querySelector("input[name=myvalue]");
+ input.value = "abcd";
ReactTestUtils.Simulate.change(input);
});
- it('invokes onChange event on number changeed', (done) => {
+ it("invokes onChange event on number changeed", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<PropertiesForm
- types={{ 'myvalue': 'number' }}
- value={{ '': 123 }}
- onChange={value => {
- expect(value).to.have.property('myvalue', 1234);
- done();
- }}
- />, container);
+ ReactDOM.render(
+ <PropertiesForm
+ types={{ myvalue: "number" }}
+ value={{ "": 123 }}
+ onChange={(value) => {
+ expect(value).to.have.property("myvalue", 1234);
+ done();
+ }}
+ />,
+ container
+ );
});
- const input = document.querySelector('input[name=myvalue]');
- input.value = '1234'
+ const input = document.querySelector("input[name=myvalue]");
+ input.value = "1234";
ReactTestUtils.Simulate.change(input);
});
- it('invokes onChange event on checkbox changed', (done) => {
+ it("invokes onChange event on checkbox changed", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<PropertiesForm
- types={{ 'myvalue': 'boolean' }}
- value={{ 'myvalue': false }}
- onChange={value => {
- expect(value).to.have.property('myvalue', true);
- done();
- }}
- />, container);
+ ReactDOM.render(
+ <PropertiesForm
+ types={{ myvalue: "boolean" }}
+ value={{ myvalue: false }}
+ onChange={(value) => {
+ expect(value).to.have.property("myvalue", true);
+ done();
+ }}
+ />,
+ container
+ );
});
- const input = document.querySelector('input[name=myvalue]');
+ const input = document.querySelector("input[name=myvalue]");
input.checked = true;
ReactTestUtils.Simulate.change(input);
});
diff --git a/test/settings/components/form/SearchEngineForm.test.tsx b/test/settings/components/form/SearchEngineForm.test.tsx
index b918203..ccbd197 100644
--- a/test/settings/components/form/SearchEngineForm.test.tsx
+++ b/test/settings/components/form/SearchEngineForm.test.tsx
@@ -1,35 +1,42 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import ReactTestRenderer from 'react-test-renderer';
-import ReactTestUtils from 'react-dom/test-utils';
-import SearchForm from 'settings/components/form/SearchForm'
-import { FormSearch } from 'shared/SettingData';
+import React from "react";
+import ReactDOM from "react-dom";
+import ReactTestRenderer from "react-test-renderer";
+import ReactTestUtils from "react-dom/test-utils";
+import SearchForm from "settings/components/form/SearchForm";
+import { FormSearch } from "shared/SettingData";
describe("settings/form/SearchForm", () => {
- describe('render', () => {
- it('renders SearchForm', () => {
- const root = ReactTestRenderer.create(<SearchForm value={FormSearch.fromJSON({
- default: 'google',
- engines: [['google', 'google.com'], ['yahoo', 'yahoo.com']],
- })} />).root;
+ describe("render", () => {
+ it("renders SearchForm", () => {
+ const root = ReactTestRenderer.create(
+ <SearchForm
+ value={FormSearch.fromJSON({
+ default: "google",
+ engines: [
+ ["google", "google.com"],
+ ["yahoo", "yahoo.com"],
+ ],
+ })}
+ />
+ ).root;
- const names = root.findAllByProps({ name: 'name' });
+ const names = root.findAllByProps({ name: "name" });
expect(names).to.have.lengthOf(2);
- expect(names[0].props.value).to.equal('google');
- expect(names[1].props.value).to.equal('yahoo');
+ 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.findAllByProps({ 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');
+ expect(urls[0].props.value).to.equal("google.com");
+ expect(urls[1].props.value).to.equal("yahoo.com");
});
});
- describe('onChange event', () => {
+ describe("onChange event", () => {
let container;
beforeEach(() => {
- container = document.createElement('div');
+ container = document.createElement("div");
document.body.appendChild(container);
});
@@ -38,72 +45,94 @@ describe("settings/form/SearchForm", () => {
container = null;
});
- it('invokes onChange event on edit', (done) => {
+ it("invokes onChange event on edit", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<SearchForm
- value={FormSearch.fromJSON({
- default: 'google',
- engines: [['google', 'google.com'], ['yahoo', 'yahoo.com']]
- })}
- onChange={value => {
- const json = value.toJSON();
- expect(json.default).to.equal('louvre');
- expect(json.engines).to.have.lengthOf(2)
- expect(json.engines).to.have.deep.members(
- [['louvre', 'google.com'], ['yahoo', 'yahoo.com']]
- );
- done();
- }} />, container);
+ ReactDOM.render(
+ <SearchForm
+ value={FormSearch.fromJSON({
+ default: "google",
+ engines: [
+ ["google", "google.com"],
+ ["yahoo", "yahoo.com"],
+ ],
+ })}
+ onChange={(value) => {
+ const json = value.toJSON();
+ expect(json.default).to.equal("louvre");
+ expect(json.engines).to.have.lengthOf(2);
+ expect(json.engines).to.have.deep.members([
+ ["louvre", "google.com"],
+ ["yahoo", "yahoo.com"],
+ ]);
+ done();
+ }}
+ />,
+ container
+ );
});
- const radio = document.querySelectorAll('input[type=radio]');
+ const radio = document.querySelectorAll("input[type=radio]");
radio.checked = true;
- const name = document.querySelector('input[name=name]');
- name.value = 'louvre';
+ const name = document.querySelector("input[name=name]");
+ name.value = "louvre";
ReactTestUtils.Simulate.change(name);
});
- it('invokes onChange event on delete', (done) => {
+ it("invokes onChange event on delete", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<SearchForm value={FormSearch.fromJSON({
- default: 'yahoo',
- engines: [['louvre', 'google.com'], ['yahoo', 'yahoo.com']]
- })}
- onChange={value => {
- const json = value.toJSON();
- expect(json.default).to.equal('yahoo');
- expect(json.engines).to.have.lengthOf(1)
- expect(json.engines).to.have.deep.members(
- [['yahoo', 'yahoo.com']]
- );
- done();
- }} />, container);
+ ReactDOM.render(
+ <SearchForm
+ value={FormSearch.fromJSON({
+ default: "yahoo",
+ engines: [
+ ["louvre", "google.com"],
+ ["yahoo", "yahoo.com"],
+ ],
+ })}
+ onChange={(value) => {
+ const json = value.toJSON();
+ expect(json.default).to.equal("yahoo");
+ expect(json.engines).to.have.lengthOf(1);
+ expect(json.engines).to.have.deep.members([
+ ["yahoo", "yahoo.com"],
+ ]);
+ done();
+ }}
+ />,
+ container
+ );
});
- const button = document.querySelector('input[type=button]');
+ const button = document.querySelector("input[type=button]");
ReactTestUtils.Simulate.click(button);
});
- it('invokes onChange event on add', (done) => {
+ it("invokes onChange event on add", (done) => {
ReactTestUtils.act(() => {
- ReactDOM.render(<SearchForm value={FormSearch.fromJSON({
- default: 'yahoo',
- engines: [['google', 'google.com']]
- })}
- onChange={value => {
- const json = value.toJSON();
- expect(json.default).to.equal('yahoo');
- expect(json.engines).to.have.lengthOf(2)
- expect(json.engines).to.have.deep.members(
- [['google', 'google.com'], ['', '']],
- );
- done();
- }} />, container);
+ ReactDOM.render(
+ <SearchForm
+ value={FormSearch.fromJSON({
+ default: "yahoo",
+ engines: [["google", "google.com"]],
+ })}
+ onChange={(value) => {
+ const json = value.toJSON();
+ expect(json.default).to.equal("yahoo");
+ expect(json.engines).to.have.lengthOf(2);
+ expect(json.engines).to.have.deep.members([
+ ["google", "google.com"],
+ ["", ""],
+ ]);
+ done();
+ }}
+ />,
+ container
+ );
});
- const button = document.querySelector('input[type=button].ui-add-button');
+ const button = document.querySelector("input[type=button].ui-add-button");
ReactTestUtils.Simulate.click(button);
});
});