aboutsummaryrefslogtreecommitdiff
path: root/test
diff options
context:
space:
mode:
Diffstat (limited to 'test')
-rw-r--r--test/settings/components/form/blacklist-form.test.jsx82
-rw-r--r--test/settings/components/form/keymaps-form.test.jsx53
-rw-r--r--test/settings/components/form/search-engine-form.test.jsx104
-rw-r--r--test/settings/components/ui/input.test.jsx83
-rw-r--r--test/shared/settings/values.test.js112
5 files changed, 434 insertions, 0 deletions
diff --git a/test/settings/components/form/blacklist-form.test.jsx b/test/settings/components/form/blacklist-form.test.jsx
new file mode 100644
index 0000000..95f5cde
--- /dev/null
+++ b/test/settings/components/form/blacklist-form.test.jsx
@@ -0,0 +1,82 @@
+import { expect } from 'chai';
+import { h, render } from 'preact';
+import BlacklistForm from 'settings/components/form/blacklist-form'
+
+describe("settings/form/BlacklistForm", () => {
+ beforeEach(() => {
+ document.body.innerHTML = '';
+ });
+
+ describe('render', () => {
+ it('renders BlacklistForm', () => {
+ render(<BlacklistForm value={['*.slack.com', 'www.google.com/maps']} />, document.body);
+
+ let inputs = document.querySelectorAll('input[type=text]');
+ expect(inputs).to.have.lengthOf(2);
+ expect(inputs[0].value).to.equal('*.slack.com');
+ expect(inputs[1].value).to.equal('www.google.com/maps');
+ });
+
+ it('renders blank value', () => {
+ render(<BlacklistForm />, document.body);
+
+ let inputs = document.querySelectorAll('input[type=text]');
+ expect(inputs).to.be.empty;
+ });
+
+ it('renders blank value', () => {
+ render(<BlacklistForm />, document.body);
+
+ let inputs = document.querySelectorAll('input[type=text]');
+ expect(inputs).to.be.empty;
+ });
+ });
+
+ describe('onChange', () => {
+ it('invokes onChange event on edit', (done) => {
+ render(<BlacklistForm
+ value={['*.slack.com', 'www.google.com/maps*']}
+ onChange={value => {
+ expect(value).to.have.lengthOf(2)
+ .and.have.members(['gitter.im', 'www.google.com/maps*']);
+
+ done();
+ }}
+ />, document.body);
+
+ let input = document.querySelectorAll('input[type=text]')[0];
+ input.value = 'gitter.im';
+ input.dispatchEvent(new Event('change'))
+ });
+
+ it('invokes onChange event on delete', (done) => {
+ render(<BlacklistForm
+ value={['*.slack.com', 'www.google.com/maps*']}
+ onChange={value => {
+ expect(value).to.have.lengthOf(1)
+ .and.have.members(['www.google.com/maps*']);
+
+ done();
+ }}
+ />, document.body);
+
+ let button = document.querySelectorAll('input[type=button]')[0];
+ button.click();
+ });
+
+ it('invokes onChange event on add', (done) => {
+ render(<BlacklistForm
+ value={['*.slack.com']}
+ onChange={value => {
+ expect(value).to.have.lengthOf(2)
+ .and.have.members(['*.slack.com', '']);
+
+ done();
+ }}
+ />, document.body);
+
+ let button = document.querySelector('input[type=button].ui-add-button');
+ button.click();
+ });
+ });
+});
diff --git a/test/settings/components/form/keymaps-form.test.jsx b/test/settings/components/form/keymaps-form.test.jsx
new file mode 100644
index 0000000..e9f9359
--- /dev/null
+++ b/test/settings/components/form/keymaps-form.test.jsx
@@ -0,0 +1,53 @@
+import { expect } from 'chai';
+import { h, render } from 'preact';
+import KeymapsForm from 'settings/components/form/keymaps-form'
+
+describe("settings/form/KeymapsForm", () => {
+ beforeEach(() => {
+ document.body.innerHTML = '';
+ });
+
+ describe('render', () => {
+ it('renders KeymapsForm', () => {
+ render(<KeymapsForm value={{
+ 'scroll.vertically?{"count":1}': 'j',
+ 'scroll.vertically?{"count":-1}': 'k',
+ }} />, document.body);
+
+ let inputj = document.getElementById('scroll.vertically?{"count":1}');
+ let inputk = document.getElementById('scroll.vertically?{"count":-1}');
+
+ expect(inputj.value).to.equal('j');
+ expect(inputk.value).to.equal('k');
+ });
+
+ it('renders blank value', () => {
+ render(<KeymapsForm />, document.body);
+
+ let inputj = document.getElementById('scroll.vertically?{"count":1}');
+ let inputk = document.getElementById('scroll.vertically?{"count":-1}');
+
+ expect(inputj.value).to.be.empty;
+ expect(inputk.value).to.be.empty;
+ });
+ });
+
+ describe('onChange event', () => {
+ it('invokes onChange event on edit', (done) => {
+ render(<KeymapsForm
+ value={{
+ 'scroll.vertically?{"count":1}': 'j',
+ 'scroll.vertically?{"count":-1}': 'k',
+ }}
+ onChange={value => {
+ expect(value['scroll.vertically?{"count":1}']).to.equal('jjj');
+
+ done();
+ }} />, document.body);
+
+ let input = document.getElementById('scroll.vertically?{"count":1}');
+ input.value = 'jjj';
+ input.dispatchEvent(new Event('change'))
+ });
+ });
+});
diff --git a/test/settings/components/form/search-engine-form.test.jsx b/test/settings/components/form/search-engine-form.test.jsx
new file mode 100644
index 0000000..9600cae
--- /dev/null
+++ b/test/settings/components/form/search-engine-form.test.jsx
@@ -0,0 +1,104 @@
+import { expect } from 'chai';
+import { h, render } from 'preact';
+import SearchForm from 'settings/components/form/search-form'
+
+describe("settings/form/SearchForm", () => {
+ beforeEach(() => {
+ document.body.innerHTML = '';
+ });
+
+ describe('render', () => {
+ it('renders SearchForm', () => {
+ render(<SearchForm value={{
+ default: 'google',
+ engines: [['google', 'google.com'], ['yahoo', 'yahoo.com']],
+ }} />, document.body);
+
+ let names = document.querySelectorAll('input[name=name]');
+ expect(names).to.have.lengthOf(2);
+ expect(names[0].value).to.equal('google');
+ expect(names[1].value).to.equal('yahoo');
+
+ let urls = document.querySelectorAll('input[name=url]');
+ expect(urls).to.have.lengthOf(2);
+ expect(urls[0].value).to.equal('google.com');
+ expect(urls[1].value).to.equal('yahoo.com');
+ });
+
+ it('renders blank value', () => {
+ render(<SearchForm />, document.body);
+
+ let names = document.querySelectorAll('input[name=name]');
+ let urls = document.querySelectorAll('input[name=url]');
+ expect(names).to.have.lengthOf(0);
+ expect(urls).to.have.lengthOf(0);
+ });
+
+ it('renders blank engines', () => {
+ render(<SearchForm value={{ default: 'google' }} />, document.body);
+
+ let names = document.querySelectorAll('input[name=name]');
+ let urls = document.querySelectorAll('input[name=url]');
+ expect(names).to.have.lengthOf(0);
+ expect(urls).to.have.lengthOf(0);
+ });
+ });
+
+ describe('onChange event', () => {
+ it('invokes onChange event on edit', (done) => {
+ render(<SearchForm
+ value={{
+ default: 'google',
+ engines: [['google', 'google.com'], ['yahoo', 'yahoo.com']]
+ }}
+ onChange={value => {
+ expect(value.default).to.equal('louvre');
+ expect(value.engines).to.have.lengthOf(2)
+ .and.have.deep.members([['louvre', 'google.com'], ['yahoo', 'yahoo.com']])
+
+ done();
+ }} />, document.body);
+
+ let radio = document.querySelectorAll('input[type=radio]');
+ radio.checked = true;
+
+ let name = document.querySelector('input[name=name]');
+ name.value = 'louvre';
+ name.dispatchEvent(new Event('change'))
+ });
+
+ it('invokes onChange event on delete', (done) => {
+ render(<SearchForm value={{
+ default: 'yahoo',
+ engines: [['louvre', 'google.com'], ['yahoo', 'yahoo.com']]
+ }}
+ onChange={value => {
+ expect(value.default).to.equal('yahoo');
+ expect(value.engines).to.have.lengthOf(1)
+ .and.have.deep.members([['yahoo', 'yahoo.com']])
+
+ done();
+ }} />, document.body);
+
+ let button = document.querySelector('input[type=button]');
+ button.click();
+ });
+
+ it('invokes onChange event on add', (done) => {
+ render(<SearchForm value={{
+ default: 'yahoo',
+ engines: [['google', 'google.com']]
+ }}
+ onChange={value => {
+ expect(value.default).to.equal('yahoo');
+ expect(value.engines).to.have.lengthOf(2)
+ .and.have.deep.members([['google', 'google.com'], ['', '']])
+
+ done();
+ }} />, document.body);
+
+ let button = document.querySelector('input[type=button].ui-add-button');
+ button.click();
+ });
+ });
+});
diff --git a/test/settings/components/ui/input.test.jsx b/test/settings/components/ui/input.test.jsx
new file mode 100644
index 0000000..98f2cef
--- /dev/null
+++ b/test/settings/components/ui/input.test.jsx
@@ -0,0 +1,83 @@
+import { expect } from 'chai';
+import { h, render } from 'preact';
+import Input from 'settings/components/ui/input'
+
+describe("settings/ui/Input", () => {
+ beforeEach(() => {
+ document.body.innerHTML = '';
+ });
+
+ context("type=text", () => {
+ it('renders text input', () => {
+ render(<Input type='text' name='myname' label='myfield' value='myvalue'/>, document.body)
+
+ let label = document.querySelector('label');
+ let 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) => {
+ render(<Input type='text' name='myname' label='myfield' value='myvalue' onChange={(e) => {
+ expect(e.target.value).to.equal('newvalue');
+ done();
+ }}/>, document.body);
+
+ let input = document.querySelector('input');
+ input.value = 'newvalue';
+ input.dispatchEvent(new Event('change'))
+ });
+ });
+
+ context("type=radio", () => {
+ it('renders radio button', () => {
+ render(<Input type='radio' name='myname' label='myfield' value='myvalue'/>, document.body)
+
+ let label = document.querySelector('label');
+ let 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) => {
+ render(<Input type='text' name='radio' label='myfield' value='myvalue' onChange={(e) => {
+ expect(e.target.checked).to.be.true;
+ done();
+ }}/>, document.body);
+
+ let input = document.querySelector('input');
+ input.checked = true;
+ input.dispatchEvent(new Event('change'))
+ });
+ });
+
+ context("type=textarea", () => {
+ it('renders textarea button', () => {
+ render(<Input type='textarea' name='myname' label='myfield' value='myvalue' error='myerror' />, document.body)
+
+ let label = document.querySelector('label');
+ let textarea = document.querySelector('textarea');
+ let 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) => {
+ render(<Input type='textarea' name='myname' label='myfield' value='myvalue' onChange={(e) => {
+ expect(e.target.value).to.equal('newvalue');
+ done();
+ }}/>, document.body);
+
+ let input = document.querySelector('textarea');
+ input.value = 'newvalue'
+ input.dispatchEvent(new Event('change'))
+ });
+ });
+});
diff --git a/test/shared/settings/values.test.js b/test/shared/settings/values.test.js
new file mode 100644
index 0000000..2c222b6
--- /dev/null
+++ b/test/shared/settings/values.test.js
@@ -0,0 +1,112 @@
+import { expect } from 'chai';
+import * as values from 'shared/settings/values';
+
+describe("settings values", () => {
+ describe('valueFromJson', () => {
+ it('return object from json string', () => {
+ let json = `{
+ "keymaps": { "0": {"type": "scroll.home"}},
+ "search": { "default": "google", "engines": { "google": "https://google.com/search?q={}" }},
+ "blacklist": [ "*.slack.com"]
+ }`;
+ let value = values.valueFromJson(json);
+
+ expect(value.keymaps).to.deep.equal({ 0: {type: "scroll.home"}});
+ expect(value.search).to.deep.equal({ default: "google", engines: { google: "https://google.com/search?q={}"} });
+ expect(value.blacklist).to.deep.equal(["*.slack.com"]);
+ });
+ });
+
+ describe('valueFromForm', () => {
+ it('returns value from form', () => {
+ let form = {
+ keymaps: {
+ 'scroll.vertically?{"count":1}': 'j',
+ 'scroll.home': '0',
+ },
+ search: {
+ default: 'google',
+ engines: [['google', 'https://google.com/search?q={}']],
+ },
+ blacklist: ['*.slack.com'],
+ };
+ let value = values.valueFromForm(form);
+
+ expect(value.keymaps).to.have.deep.property('j', { type: "scroll.vertically", count: 1 });
+ expect(value.keymaps).to.have.deep.property('0', { type: "scroll.home" });
+ expect(JSON.stringify(value.search)).to.deep.equal(JSON.stringify({ default: "google", engines: { google: "https://google.com/search?q={}"} }));
+ expect(value.search).to.deep.equal({ default: "google", engines: { google: "https://google.com/search?q={}"} });
+ expect(value.blacklist).to.deep.equal(["*.slack.com"]);
+ });
+
+ it('convert from empty form', () => {
+ let form = {};
+ let value = values.valueFromForm(form);
+ expect(value).to.not.have.key('keymaps');
+ expect(value).to.not.have.key('search');
+ expect(value).to.not.have.key('blacklist');
+ });
+
+ it('override keymaps', () => {
+ let form = {
+ keymaps: {
+ 'scroll.vertically?{"count":1}': 'j',
+ 'scroll.vertically?{"count":-1}': 'j',
+ }
+ };
+ let value = values.valueFromForm(form);
+
+ expect(value.keymaps).to.have.key('j');
+ });
+
+ it('override search engine', () => {
+ let form = {
+ search: {
+ default: 'google',
+ engines: [
+ ['google', 'https://google.com/search?q={}'],
+ ['google', 'https://google.co.jp/search?q={}'],
+ ]
+ }
+ };
+ let value = values.valueFromForm(form);
+
+ expect(value.search.engines).to.have.property('google', 'https://google.co.jp/search?q={}');
+ });
+ });
+
+ describe('jsonFromValue', () => {
+ });
+
+ describe('formFromValue', () => {
+ it('convert empty value to form', () => {
+ let value = {};
+ let form = values.formFromValue(value);
+
+ expect(value).to.not.have.key('keymaps');
+ expect(value).to.not.have.key('search');
+ expect(value).to.not.have.key('blacklist');
+ });
+
+ it('convert value to form', () => {
+ let value = {
+ keymaps: {
+ j: { type: 'scroll.vertically', count: 1 },
+ JJ: { type: 'scroll.vertically', count: 100 },
+ 0: { type: 'scroll.home' },
+ },
+ search: { default: 'google', engines: { google: 'https://google.com/search?q={}' }},
+ blacklist: [ '*.slack.com']
+ };
+ let form = values.formFromValue(value);
+
+ expect(form.keymaps).to.have.property('scroll.vertically?{"count":1}', 'j');
+ expect(form.keymaps).to.have.property('scroll.home', '0');
+ expect(Object.keys(form.keymaps)).to.have.lengthOf(2);
+ expect(form.search).to.have.property('default', 'google');
+ expect(form.search).to.have.deep.property('engines', [['google', 'https://google.com/search?q={}']]);
+ expect(form.blacklist).to.have.lengthOf(1);
+ expect(form.blacklist).to.include('*.slack.com');
+ });
+ });
+});
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-15 21:23:01 +0000