Fleshing out Form tests
This commit is contained in:
parent
7a8a9836aa
commit
8b2ce32b75
@ -44,3 +44,129 @@ exports[`Form rendering 1`] = `
|
||||
</form>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Form rendering with download URLs 1`] = `
|
||||
<div
|
||||
className="form"
|
||||
>
|
||||
<form
|
||||
onSubmit={[Function]}
|
||||
>
|
||||
<textarea
|
||||
autoFocus={true}
|
||||
onKeyPress={[Function]}
|
||||
placeholder="translate(Enter regular expression to display)"
|
||||
/>
|
||||
<button
|
||||
type="submit"
|
||||
>
|
||||
<Trans>
|
||||
Display
|
||||
</Trans>
|
||||
</button>
|
||||
<div
|
||||
className="select"
|
||||
>
|
||||
<select>
|
||||
<option
|
||||
key="js"
|
||||
value="js"
|
||||
>
|
||||
Javascript
|
||||
</option>
|
||||
<option
|
||||
key="pcre"
|
||||
value="pcre"
|
||||
>
|
||||
PCRE
|
||||
</option>
|
||||
</select>
|
||||
<SvgMock />
|
||||
</div>
|
||||
<ul
|
||||
className="actions"
|
||||
>
|
||||
<li
|
||||
key="0"
|
||||
>
|
||||
<a
|
||||
download="image.svg"
|
||||
href="#svg"
|
||||
type="image/svg+xml"
|
||||
>
|
||||
<SvgMock />
|
||||
Download SVG
|
||||
</a>
|
||||
</li>
|
||||
<li
|
||||
key="1"
|
||||
>
|
||||
<a
|
||||
download="image.png"
|
||||
href="#png"
|
||||
type="image/png"
|
||||
>
|
||||
<SvgMock />
|
||||
Download PNG
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</form>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`Form rendering with permalink URL 1`] = `
|
||||
<div
|
||||
className="form"
|
||||
>
|
||||
<form
|
||||
onSubmit={[Function]}
|
||||
>
|
||||
<textarea
|
||||
autoFocus={true}
|
||||
onKeyPress={[Function]}
|
||||
placeholder="translate(Enter regular expression to display)"
|
||||
/>
|
||||
<button
|
||||
type="submit"
|
||||
>
|
||||
<Trans>
|
||||
Display
|
||||
</Trans>
|
||||
</button>
|
||||
<div
|
||||
className="select"
|
||||
>
|
||||
<select>
|
||||
<option
|
||||
key="js"
|
||||
value="js"
|
||||
>
|
||||
Javascript
|
||||
</option>
|
||||
<option
|
||||
key="pcre"
|
||||
value="pcre"
|
||||
>
|
||||
PCRE
|
||||
</option>
|
||||
</select>
|
||||
<SvgMock />
|
||||
</div>
|
||||
<ul
|
||||
className="actions"
|
||||
>
|
||||
<li>
|
||||
<a
|
||||
href="#permalink"
|
||||
>
|
||||
<SvgMock />
|
||||
<Trans>
|
||||
Permalink
|
||||
</Trans>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</form>
|
||||
</div>
|
||||
`;
|
||||
|
@ -1,5 +1,5 @@
|
||||
import React from 'react';
|
||||
import { shallow } from 'enzyme';
|
||||
import { shallow, mount } from 'enzyme';
|
||||
|
||||
import { Form } from 'components/Form';
|
||||
import { translate, I18nWrapper } from '__mocks__/i18n';
|
||||
@ -17,11 +17,67 @@ describe('Form', () => {
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('rendering with download URLs');
|
||||
test('rendering with download URLs', () => {
|
||||
const downloadUrls = [
|
||||
{ url: '#svg', filename: 'image.svg', type: 'image/svg+xml', label: 'Download SVG' },
|
||||
{ url: '#png', filename: 'image.png', type: 'image/png', label: 'Download PNG' }
|
||||
];
|
||||
const component = shallow(
|
||||
<Form t={ translate } syntaxes={ syntaxes } downloadUrls={ downloadUrls }/>
|
||||
);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('rendering with permalink URL');
|
||||
test('rendering with permalink URL', () => {
|
||||
const permalinkUrl = '#permalink';
|
||||
const component = shallow(
|
||||
<Form t={ translate } syntaxes={ syntaxes } permalinkUrl={ permalinkUrl }/>
|
||||
);
|
||||
expect(component).toMatchSnapshot();
|
||||
});
|
||||
|
||||
test('submitting form');
|
||||
describe('submitting expression', () => {
|
||||
const build = (props = {}) => {
|
||||
const component = mount(
|
||||
<I18nWrapper>
|
||||
<Form syntaxes={ syntaxes } { ...props }/>
|
||||
</I18nWrapper>
|
||||
);
|
||||
return component;
|
||||
};
|
||||
|
||||
test('submitting form with Shift+Enter');
|
||||
test('submitting form', () => {
|
||||
const onSubmit = jest.fn();
|
||||
const component = build({ onSubmit });
|
||||
const eventObj = { preventDefault: jest.fn() };
|
||||
component.find(Form).instance().textarea.value = 'Test textarea value';
|
||||
component.find('form').simulate('submit', eventObj);
|
||||
|
||||
expect(eventObj.preventDefault).toHaveBeenCalled();
|
||||
expect(onSubmit).toHaveBeenCalledWith({
|
||||
expr: 'Test textarea value',
|
||||
syntax: 'js'
|
||||
});
|
||||
});
|
||||
|
||||
test('submitting form with Shift+Enter', () => {
|
||||
const component = build({ onSubmit: Function.prototype });
|
||||
const form = component.find(Form).instance();
|
||||
const eventObj = { charCode: 13, shiftKey: true };
|
||||
jest.spyOn(form, 'handleSubmit');
|
||||
component.find('textarea').simulate('keypress', eventObj);
|
||||
|
||||
expect(form.handleSubmit).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
test('not submitting with just Enter', () => {
|
||||
const component = build({ onSubmit: Function.prototype });
|
||||
const form = component.find(Form).instance();
|
||||
const eventObj = { charCode: 13, shiftKey: false };
|
||||
jest.spyOn(form, 'handleSubmit');
|
||||
component.find('textarea').simulate('keypress', eventObj);
|
||||
|
||||
expect(form.handleSubmit).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user