Fleshing out Form tests
This commit is contained in:
parent
7a8a9836aa
commit
8b2ce32b75
@ -44,3 +44,129 @@ exports[`Form rendering 1`] = `
|
|||||||
</form>
|
</form>
|
||||||
</div>
|
</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 React from 'react';
|
||||||
import { shallow } from 'enzyme';
|
import { shallow, mount } from 'enzyme';
|
||||||
|
|
||||||
import { Form } from 'components/Form';
|
import { Form } from 'components/Form';
|
||||||
import { translate, I18nWrapper } from '__mocks__/i18n';
|
import { translate, I18nWrapper } from '__mocks__/i18n';
|
||||||
@ -17,11 +17,67 @@ describe('Form', () => {
|
|||||||
expect(component).toMatchSnapshot();
|
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