You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This repo is archived. You can view files and clone it, but cannot push or open issues/pull-requests.

83 lines
2.8 KiB

7 years ago
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'))
});
});
});