add snapshot tests for 'import-from-source' part
This commit is contained in:
3
web/package-lock.json
generated
3
web/package-lock.json
generated
@@ -4382,8 +4382,7 @@
|
||||
},
|
||||
"jsbn": {
|
||||
"version": "0.1.1",
|
||||
"bundled": true,
|
||||
"optional": true
|
||||
"bundled": true
|
||||
},
|
||||
"json-schema": {
|
||||
"version": "0.2.3",
|
||||
|
||||
@@ -29,6 +29,7 @@
|
||||
"babel-jest": "^22.4.3",
|
||||
"enzyme": "^3.3.0",
|
||||
"enzyme-adapter-react-16": "^1.1.1",
|
||||
"enzyme-to-json": "^3.3.3",
|
||||
"jest": "^20.0.3",
|
||||
"jest-enzyme": "^6.0.0",
|
||||
"nodemon": "^1.12.1",
|
||||
|
||||
@@ -2,51 +2,60 @@ import React from 'react';
|
||||
import {Button} from 'react-md';
|
||||
import {shallow, mount} from 'enzyme';
|
||||
import AnswerSource from '../AnswerSource';
|
||||
import {ANSWER_TYPE} from '../../config/constants'
|
||||
import {ANSWER_TYPE} from '../../config/constants';
|
||||
|
||||
it ('renders without crashing', () => {
|
||||
shallow (<AnswerSource />);
|
||||
});
|
||||
|
||||
|
||||
describe('functional tests', ()=>{
|
||||
describe ('functional tests', () => {
|
||||
let wrapper;
|
||||
beforeEach(()=>{
|
||||
const onSaveAnswerTypeFunction = jest.fn();
|
||||
wrapper = mount(<AnswerSource onSaveAnswerType={onSaveAnswerTypeFunction} />);
|
||||
wrapper.setState({
|
||||
beforeEach (() => {
|
||||
const onSaveAnswerTypeFunction = jest.fn ();
|
||||
wrapper = mount (
|
||||
<AnswerSource onSaveAnswerType={onSaveAnswerTypeFunction} />
|
||||
);
|
||||
wrapper.setState ({
|
||||
isModalOpen: false,
|
||||
answerType: 0
|
||||
answerType: 0,
|
||||
});
|
||||
});
|
||||
|
||||
it ('snapshot', ()=>{
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it ('renders only a button', () => {
|
||||
expect(wrapper.first().text()).toEqual('Answer type');
|
||||
expect(wrapper.find('AnswerSourceForm').exists()).toEqual(false);
|
||||
expect (wrapper.first ().text ()).toEqual ('Answer type');
|
||||
expect (wrapper.find ('AnswerSourceForm').exists ()).toEqual (false);
|
||||
});
|
||||
|
||||
it('answer type button click opens modal form', () => {
|
||||
expect(wrapper.find('AnswerSourceFormA').exists()).toEqual(false);
|
||||
expect(wrapper.state().isModalOpen).toEqual(false);
|
||||
const AnswerTypeButton = wrapper.find('button').first();
|
||||
AnswerTypeButton.simulate('click');
|
||||
expect(wrapper.state().isModalOpen).toEqual(true);
|
||||
expect(wrapper.find('AnswerSourceForm').exists()).toEqual(true);
|
||||
expect(wrapper.find('button').length).toBe(3);
|
||||
expect(wrapper.find('button').first().text()).toEqual('Answer type');
|
||||
it ('answer type button click opens modal form', () => {
|
||||
expect (wrapper.find ('AnswerSourceFormA').exists ()).toEqual (false);
|
||||
expect (wrapper.state ().isModalOpen).toEqual (false);
|
||||
const AnswerTypeButton = wrapper.find ('button').first ();
|
||||
AnswerTypeButton.simulate ('click');
|
||||
expect (wrapper.state ().isModalOpen).toEqual (true);
|
||||
expect (wrapper.find ('AnswerSourceForm').exists ()).toEqual (true);
|
||||
expect (wrapper.find ('button').length).toBe (3);
|
||||
expect (wrapper.find ('button').first ().text ()).toEqual ('Answer type');
|
||||
});
|
||||
|
||||
it('save button changes answerType value in state and closes the form ', () => {
|
||||
const AnswerTypeButton = wrapper.find('button').first();
|
||||
AnswerTypeButton.simulate('click');
|
||||
const saveButton = wrapper.find('button').at(2);
|
||||
const optionControl = wrapper.find('SelectionControlGroup');
|
||||
expect(saveButton.text()).toEqual('Save');
|
||||
expect(optionControl.exists()).toEqual(true);
|
||||
optionControl.simulate('change',{target:{value:String(ANSWER_TYPE.EXTERNAL_SOURCE_WP_NEWS)}});
|
||||
saveButton.simulate('click');
|
||||
expect(wrapper.state().answerType).toBe(ANSWER_TYPE.EXTERNAL_SOURCE_WP_NEWS)
|
||||
expect(wrapper.state().isModalOpen).toEqual(false);
|
||||
expect(wrapper.find('button').length).toBe(1);
|
||||
it ('save button changes answerType value in state and closes the form ', () => {
|
||||
const AnswerTypeButton = wrapper.find ('button').first ();
|
||||
AnswerTypeButton.simulate ('click');
|
||||
const saveButton = wrapper.find ('button').at (2);
|
||||
const optionControl = wrapper.find ('SelectionControlGroup');
|
||||
expect (saveButton.text ()).toEqual ('Save');
|
||||
expect (optionControl.exists ()).toEqual (true);
|
||||
optionControl.simulate ('change', {
|
||||
target: {value: String (ANSWER_TYPE.EXTERNAL_SOURCE_WP_NEWS)},
|
||||
});
|
||||
saveButton.simulate ('click');
|
||||
expect (wrapper.state ().answerType).toBe (
|
||||
ANSWER_TYPE.EXTERNAL_SOURCE_WP_NEWS
|
||||
);
|
||||
expect (wrapper.state ().isModalOpen).toEqual (false);
|
||||
expect (wrapper.find ('button').length).toBe (1);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -0,0 +1,93 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`functional tests snapshot 1`] = `
|
||||
<AnswerSource
|
||||
onSaveAnswerType={[Function]}
|
||||
>
|
||||
<div>
|
||||
<withInk(withTooltip(Button))
|
||||
flat={true}
|
||||
inkTransitionEnterTimeout={450}
|
||||
inkTransitionLeaveTimeout={300}
|
||||
inkTransitionOverlap={150}
|
||||
onClick={[Function]}
|
||||
primary={true}
|
||||
>
|
||||
<withTooltip(Button)
|
||||
flat={true}
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
onClick={[Function]}
|
||||
primary={true}
|
||||
>
|
||||
<Button
|
||||
fixedPosition="br"
|
||||
flat={true}
|
||||
iconBefore={true}
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
onClick={[Function]}
|
||||
primary={true}
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="md-btn md-btn--flat md-btn--text md-pointer--hover md-text--theme-primary md-ink--primary md-inline-block"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
onMouseDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
onMouseUp={[Function]}
|
||||
onTouchEnd={[Function]}
|
||||
onTouchStart={[Function]}
|
||||
type="button"
|
||||
>
|
||||
<InkContainer
|
||||
key="ink-container"
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
>
|
||||
<TransitionGroup
|
||||
childFactory={[Function]}
|
||||
className="md-ink-container"
|
||||
component="div"
|
||||
>
|
||||
<div
|
||||
className="md-ink-container"
|
||||
/>
|
||||
</TransitionGroup>
|
||||
</InkContainer>
|
||||
Answer type
|
||||
</button>
|
||||
</Button>
|
||||
</withTooltip(Button)>
|
||||
</withInk(withTooltip(Button))>
|
||||
</div>
|
||||
</AnswerSource>
|
||||
`;
|
||||
@@ -7,6 +7,11 @@ it('renders without crashing', () => {
|
||||
shallow(<AnswerSourceForm onClose={()=>{}} onSave={()=>{}} onSourceChange={()=>{}} />);
|
||||
});
|
||||
|
||||
it ('snapshot',()=>{
|
||||
const wrapper = mount(<AnswerSourceForm onClose={()=>{}} onSave={()=>{}} onSourceChange={()=>{}} />);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
})
|
||||
|
||||
it('calls onClose when cancel is pressed', () => {
|
||||
const onClose = jest.fn();
|
||||
const wrapper = mount(<AnswerSourceForm onClose={onClose} onSave={()=>{}} onSourceChange={()=>{}} />);
|
||||
|
||||
@@ -23,6 +23,10 @@ describe ('predefined answer selected', () => {
|
||||
textField = wrapper.find ('TextField').first ();
|
||||
});
|
||||
|
||||
it ('snapshot', () =>{
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it ('renders text box for normal answer', () => {
|
||||
expect (textField.props ().label).toEqual ('Answer');
|
||||
});
|
||||
@@ -47,6 +51,10 @@ describe ('WordPress titles selected', () => {
|
||||
textField = wrapper.find ('TextField').first ();
|
||||
});
|
||||
|
||||
it ('snapshot', () =>{
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it ('renders text box for external source input', () => {
|
||||
expect (textField.props ().label).toEqual ('Answer source');
|
||||
});
|
||||
@@ -71,6 +79,10 @@ describe ('WordPress latest news selected', () => {
|
||||
textField = wrapper.find ('TextField').first ();
|
||||
});
|
||||
|
||||
it ('snapshot', () =>{
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it ('renders text box for external source input', () => {
|
||||
expect (textField.props ().label).toEqual ('Answer source');
|
||||
});
|
||||
|
||||
@@ -6,10 +6,21 @@ it('renders without crashing', () => {
|
||||
shallow(<Modal />);
|
||||
});
|
||||
|
||||
let actionButton;
|
||||
let childButton;
|
||||
let wrapper;
|
||||
|
||||
beforeEach(()=>{
|
||||
actionButton = <button key={0}>Dummy action button</button>;
|
||||
childButton = <button key={1}>Child button</button>;
|
||||
wrapper = mount(<Modal title={'Dummy title'} actions={[actionButton]}>{childButton}</Modal>);
|
||||
});
|
||||
|
||||
it ('snapshot', () => {
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('receives props as expected', () =>{
|
||||
const actionButton = <button key={0}>Dummy action button</button>;
|
||||
const childButton = <button key={1}>Child button</button>;
|
||||
const wrapper = mount(<Modal title={'Dummy title'} actions={[actionButton]}>{childButton}</Modal>);
|
||||
expect(wrapper.props().title).toEqual('Dummy title');
|
||||
expect(wrapper.props().actions).toEqual([actionButton]);
|
||||
expect(wrapper.props().children).toEqual(childButton);
|
||||
|
||||
@@ -0,0 +1,675 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`snapshot 1`] = `
|
||||
<AnswerSourceForm
|
||||
onClose={[Function]}
|
||||
onSave={[Function]}
|
||||
onSourceChange={[Function]}
|
||||
>
|
||||
<Modal
|
||||
actions={
|
||||
Array [
|
||||
<withInk(withTooltip(Button))
|
||||
flat={true}
|
||||
inkTransitionEnterTimeout={450}
|
||||
inkTransitionLeaveTimeout={300}
|
||||
inkTransitionOverlap={150}
|
||||
onClick={[Function]}
|
||||
swapTheming={true}
|
||||
>
|
||||
Cancel
|
||||
</withInk(withTooltip(Button))>,
|
||||
<withInk(withTooltip(Button))
|
||||
flat={true}
|
||||
inkTransitionEnterTimeout={450}
|
||||
inkTransitionLeaveTimeout={300}
|
||||
inkTransitionOverlap={150}
|
||||
onClick={[Function]}
|
||||
primary={true}
|
||||
swapTheming={true}
|
||||
>
|
||||
Save
|
||||
</withInk(withTooltip(Button))>,
|
||||
]
|
||||
}
|
||||
title="Answer type"
|
||||
>
|
||||
<div
|
||||
className="modal"
|
||||
>
|
||||
<div
|
||||
className="modal-content"
|
||||
>
|
||||
<h2
|
||||
className="header"
|
||||
>
|
||||
Answer type
|
||||
</h2>
|
||||
<SelectionControlGroup
|
||||
component="fieldset"
|
||||
controls={
|
||||
Array [
|
||||
Object {
|
||||
"label": "Predefined answer",
|
||||
"value": "0",
|
||||
},
|
||||
Object {
|
||||
"label": "WordPress titles",
|
||||
"value": "1",
|
||||
},
|
||||
Object {
|
||||
"label": "WordPress latest news",
|
||||
"value": "2",
|
||||
},
|
||||
]
|
||||
}
|
||||
defaultValue="undefined"
|
||||
id="answer-source"
|
||||
label="Import answer from:"
|
||||
labelClassName="md-subheading-1"
|
||||
labelComponent="legend"
|
||||
name="answer-source"
|
||||
onChange={[Function]}
|
||||
type="radio"
|
||||
>
|
||||
<fieldset
|
||||
className="md-selection-control-group"
|
||||
onChange={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
>
|
||||
<legend
|
||||
className="md-subheading-1"
|
||||
>
|
||||
Import answer from:
|
||||
</legend>
|
||||
<SelectionControl
|
||||
checked={false}
|
||||
checkedCheckboxIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
check_box
|
||||
</FontIcon>
|
||||
}
|
||||
checkedRadioIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
radio_button_checked
|
||||
</FontIcon>
|
||||
}
|
||||
className=""
|
||||
id="answer-source0"
|
||||
key="control0"
|
||||
label="Predefined answer"
|
||||
name="answer-source"
|
||||
type="radio"
|
||||
uncheckedCheckboxIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
check_box_outline_blank
|
||||
</FontIcon>
|
||||
}
|
||||
uncheckedRadioIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
radio_button_unchecked
|
||||
</FontIcon>
|
||||
}
|
||||
value="0"
|
||||
>
|
||||
<div
|
||||
className="md-selection-control-container"
|
||||
onKeyDown={[Function]}
|
||||
>
|
||||
<input
|
||||
aria-hidden={true}
|
||||
checked={false}
|
||||
className="md-selection-control-input"
|
||||
id="answer-source0"
|
||||
name="answer-source"
|
||||
onChange={[Function]}
|
||||
type="radio"
|
||||
value="0"
|
||||
/>
|
||||
<label
|
||||
className="md-selection-control-label md-pointer--hover md-text"
|
||||
htmlFor="answer-source0"
|
||||
>
|
||||
<withInk(AccessibleFakeButton)
|
||||
aria-checked={false}
|
||||
className="md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
inkTransitionEnterTimeout={450}
|
||||
inkTransitionLeaveTimeout={300}
|
||||
inkTransitionOverlap={150}
|
||||
role="radio"
|
||||
>
|
||||
<AccessibleFakeButton
|
||||
aria-checked={false}
|
||||
className="md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
component="div"
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
listenToEnter={true}
|
||||
listenToSpace={true}
|
||||
noFocusOutline={true}
|
||||
role="radio"
|
||||
tabIndex={0}
|
||||
>
|
||||
<div
|
||||
aria-checked={false}
|
||||
aria-pressed={false}
|
||||
className="md-fake-btn md-pointer--hover md-fake-btn--no-outline md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
onBlur={[Function]}
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
role="radio"
|
||||
tabIndex={0}
|
||||
>
|
||||
<InkContainer
|
||||
key="ink-container"
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
>
|
||||
<TransitionGroup
|
||||
childFactory={[Function]}
|
||||
className="md-ink-container"
|
||||
component="div"
|
||||
>
|
||||
<div
|
||||
className="md-ink-container"
|
||||
/>
|
||||
</TransitionGroup>
|
||||
</InkContainer>
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
inherit={true}
|
||||
key=".1"
|
||||
>
|
||||
<i
|
||||
className="md-icon material-icons md-text--inherit"
|
||||
>
|
||||
radio_button_unchecked
|
||||
</i>
|
||||
</FontIcon>
|
||||
</div>
|
||||
</AccessibleFakeButton>
|
||||
</withInk(AccessibleFakeButton)>
|
||||
<span>
|
||||
Predefined answer
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</SelectionControl>
|
||||
<SelectionControl
|
||||
checked={false}
|
||||
checkedCheckboxIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
check_box
|
||||
</FontIcon>
|
||||
}
|
||||
checkedRadioIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
radio_button_checked
|
||||
</FontIcon>
|
||||
}
|
||||
className=""
|
||||
id="answer-source1"
|
||||
key="control1"
|
||||
label="WordPress titles"
|
||||
name="answer-source"
|
||||
tabIndex={-1}
|
||||
type="radio"
|
||||
uncheckedCheckboxIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
check_box_outline_blank
|
||||
</FontIcon>
|
||||
}
|
||||
uncheckedRadioIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
radio_button_unchecked
|
||||
</FontIcon>
|
||||
}
|
||||
value="1"
|
||||
>
|
||||
<div
|
||||
className="md-selection-control-container"
|
||||
onKeyDown={[Function]}
|
||||
>
|
||||
<input
|
||||
aria-hidden={true}
|
||||
checked={false}
|
||||
className="md-selection-control-input"
|
||||
id="answer-source1"
|
||||
name="answer-source"
|
||||
onChange={[Function]}
|
||||
type="radio"
|
||||
value="1"
|
||||
/>
|
||||
<label
|
||||
className="md-selection-control-label md-pointer--hover md-text"
|
||||
htmlFor="answer-source1"
|
||||
>
|
||||
<withInk(AccessibleFakeButton)
|
||||
aria-checked={false}
|
||||
className="md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
inkTransitionEnterTimeout={450}
|
||||
inkTransitionLeaveTimeout={300}
|
||||
inkTransitionOverlap={150}
|
||||
role="radio"
|
||||
tabIndex={-1}
|
||||
>
|
||||
<AccessibleFakeButton
|
||||
aria-checked={false}
|
||||
className="md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
component="div"
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
listenToEnter={true}
|
||||
listenToSpace={true}
|
||||
noFocusOutline={true}
|
||||
role="radio"
|
||||
tabIndex={-1}
|
||||
>
|
||||
<div
|
||||
aria-checked={false}
|
||||
aria-pressed={false}
|
||||
className="md-fake-btn md-pointer--hover md-fake-btn--no-outline md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
onBlur={[Function]}
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
role="radio"
|
||||
tabIndex={-1}
|
||||
>
|
||||
<InkContainer
|
||||
key="ink-container"
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
>
|
||||
<TransitionGroup
|
||||
childFactory={[Function]}
|
||||
className="md-ink-container"
|
||||
component="div"
|
||||
>
|
||||
<div
|
||||
className="md-ink-container"
|
||||
/>
|
||||
</TransitionGroup>
|
||||
</InkContainer>
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
inherit={true}
|
||||
key=".1"
|
||||
>
|
||||
<i
|
||||
className="md-icon material-icons md-text--inherit"
|
||||
>
|
||||
radio_button_unchecked
|
||||
</i>
|
||||
</FontIcon>
|
||||
</div>
|
||||
</AccessibleFakeButton>
|
||||
</withInk(AccessibleFakeButton)>
|
||||
<span>
|
||||
WordPress titles
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</SelectionControl>
|
||||
<SelectionControl
|
||||
checked={false}
|
||||
checkedCheckboxIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
check_box
|
||||
</FontIcon>
|
||||
}
|
||||
checkedRadioIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
radio_button_checked
|
||||
</FontIcon>
|
||||
}
|
||||
className=""
|
||||
id="answer-source2"
|
||||
key="control2"
|
||||
label="WordPress latest news"
|
||||
name="answer-source"
|
||||
tabIndex={-1}
|
||||
type="radio"
|
||||
uncheckedCheckboxIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
check_box_outline_blank
|
||||
</FontIcon>
|
||||
}
|
||||
uncheckedRadioIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
radio_button_unchecked
|
||||
</FontIcon>
|
||||
}
|
||||
value="2"
|
||||
>
|
||||
<div
|
||||
className="md-selection-control-container"
|
||||
onKeyDown={[Function]}
|
||||
>
|
||||
<input
|
||||
aria-hidden={true}
|
||||
checked={false}
|
||||
className="md-selection-control-input"
|
||||
id="answer-source2"
|
||||
name="answer-source"
|
||||
onChange={[Function]}
|
||||
type="radio"
|
||||
value="2"
|
||||
/>
|
||||
<label
|
||||
className="md-selection-control-label md-pointer--hover md-text"
|
||||
htmlFor="answer-source2"
|
||||
>
|
||||
<withInk(AccessibleFakeButton)
|
||||
aria-checked={false}
|
||||
className="md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
inkTransitionEnterTimeout={450}
|
||||
inkTransitionLeaveTimeout={300}
|
||||
inkTransitionOverlap={150}
|
||||
role="radio"
|
||||
tabIndex={-1}
|
||||
>
|
||||
<AccessibleFakeButton
|
||||
aria-checked={false}
|
||||
className="md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
component="div"
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
listenToEnter={true}
|
||||
listenToSpace={true}
|
||||
noFocusOutline={true}
|
||||
role="radio"
|
||||
tabIndex={-1}
|
||||
>
|
||||
<div
|
||||
aria-checked={false}
|
||||
aria-pressed={false}
|
||||
className="md-fake-btn md-pointer--hover md-fake-btn--no-outline md-selection-control-toggle md-btn md-btn--icon md-text--secondary"
|
||||
onBlur={[Function]}
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
role="radio"
|
||||
tabIndex={-1}
|
||||
>
|
||||
<InkContainer
|
||||
key="ink-container"
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
>
|
||||
<TransitionGroup
|
||||
childFactory={[Function]}
|
||||
className="md-ink-container"
|
||||
component="div"
|
||||
>
|
||||
<div
|
||||
className="md-ink-container"
|
||||
/>
|
||||
</TransitionGroup>
|
||||
</InkContainer>
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
inherit={true}
|
||||
key=".1"
|
||||
>
|
||||
<i
|
||||
className="md-icon material-icons md-text--inherit"
|
||||
>
|
||||
radio_button_unchecked
|
||||
</i>
|
||||
</FontIcon>
|
||||
</div>
|
||||
</AccessibleFakeButton>
|
||||
</withInk(AccessibleFakeButton)>
|
||||
<span>
|
||||
WordPress latest news
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
</SelectionControl>
|
||||
</fieldset>
|
||||
</SelectionControlGroup>
|
||||
<div
|
||||
className="actions"
|
||||
>
|
||||
<withInk(withTooltip(Button))
|
||||
flat={true}
|
||||
inkTransitionEnterTimeout={450}
|
||||
inkTransitionLeaveTimeout={300}
|
||||
inkTransitionOverlap={150}
|
||||
key="cancel"
|
||||
onClick={[Function]}
|
||||
swapTheming={true}
|
||||
>
|
||||
<withTooltip(Button)
|
||||
flat={true}
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
onClick={[Function]}
|
||||
swapTheming={true}
|
||||
>
|
||||
<Button
|
||||
fixedPosition="br"
|
||||
flat={true}
|
||||
iconBefore={true}
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
onClick={[Function]}
|
||||
swapTheming={true}
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="md-btn md-btn--flat md-btn--text md-pointer--hover md-text md-inline-block"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
onMouseDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
onMouseUp={[Function]}
|
||||
onTouchEnd={[Function]}
|
||||
onTouchStart={[Function]}
|
||||
type="button"
|
||||
>
|
||||
<InkContainer
|
||||
key="ink-container"
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
>
|
||||
<TransitionGroup
|
||||
childFactory={[Function]}
|
||||
className="md-ink-container"
|
||||
component="div"
|
||||
>
|
||||
<div
|
||||
className="md-ink-container"
|
||||
/>
|
||||
</TransitionGroup>
|
||||
</InkContainer>
|
||||
Cancel
|
||||
</button>
|
||||
</Button>
|
||||
</withTooltip(Button)>
|
||||
</withInk(withTooltip(Button))>
|
||||
<withInk(withTooltip(Button))
|
||||
flat={true}
|
||||
inkTransitionEnterTimeout={450}
|
||||
inkTransitionLeaveTimeout={300}
|
||||
inkTransitionOverlap={150}
|
||||
key="save"
|
||||
onClick={[Function]}
|
||||
primary={true}
|
||||
swapTheming={true}
|
||||
>
|
||||
<withTooltip(Button)
|
||||
flat={true}
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
onClick={[Function]}
|
||||
primary={true}
|
||||
swapTheming={true}
|
||||
>
|
||||
<Button
|
||||
fixedPosition="br"
|
||||
flat={true}
|
||||
iconBefore={true}
|
||||
ink={
|
||||
<InkContainer
|
||||
className={undefined}
|
||||
disabledInteractions={undefined}
|
||||
inkClassName={undefined}
|
||||
inkStyle={undefined}
|
||||
pulse={undefined}
|
||||
style={undefined}
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
waitForInkTransition={undefined}
|
||||
/>
|
||||
}
|
||||
onClick={[Function]}
|
||||
primary={true}
|
||||
swapTheming={true}
|
||||
type="button"
|
||||
>
|
||||
<button
|
||||
className="md-btn md-btn--flat md-btn--text md-pointer--hover md-background--primary md-background--primary-hover md-inline-block"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
onMouseDown={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
onMouseUp={[Function]}
|
||||
onTouchEnd={[Function]}
|
||||
onTouchStart={[Function]}
|
||||
type="button"
|
||||
>
|
||||
<InkContainer
|
||||
key="ink-container"
|
||||
transitionEnterTimeout={450}
|
||||
transitionLeaveTimeout={300}
|
||||
transitionOverlap={150}
|
||||
>
|
||||
<TransitionGroup
|
||||
childFactory={[Function]}
|
||||
className="md-ink-container"
|
||||
component="div"
|
||||
>
|
||||
<div
|
||||
className="md-ink-container"
|
||||
/>
|
||||
</TransitionGroup>
|
||||
</InkContainer>
|
||||
Save
|
||||
</button>
|
||||
</Button>
|
||||
</withTooltip(Button)>
|
||||
</withInk(withTooltip(Button))>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Modal>
|
||||
</AnswerSourceForm>
|
||||
`;
|
||||
@@ -0,0 +1,376 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`WordPress latest news selected snapshot 1`] = `
|
||||
<AnswerTextBox
|
||||
answerType={2}
|
||||
externalAnswerSource="Dummy answer"
|
||||
handleAnswerSourceEdit={[Function]}
|
||||
>
|
||||
<div
|
||||
className="QuestionBox"
|
||||
>
|
||||
<TextField
|
||||
className="md-cell md-cell--bottom IntentDetailsInputBoxes"
|
||||
fullWidth={true}
|
||||
id="intent answer"
|
||||
label="Answer source"
|
||||
leftIconStateful={true}
|
||||
lineDirection="center"
|
||||
maxLength={150}
|
||||
onChange={[Function]}
|
||||
passwordIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
remove_red_eye
|
||||
</FontIcon>
|
||||
}
|
||||
placeholder="Answer source"
|
||||
rightIconStateful={true}
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
>
|
||||
<div
|
||||
className="md-text-field-container md-full-width md-text-field-container--input md-cell md-cell--bottom IntentDetailsInputBoxes"
|
||||
onClick={[Function]}
|
||||
>
|
||||
<FloatingLabel
|
||||
active={false}
|
||||
error={false}
|
||||
floating={true}
|
||||
htmlFor="intent answer"
|
||||
iconOffset={false}
|
||||
key="label"
|
||||
label="Answer source"
|
||||
>
|
||||
<label
|
||||
className="md-floating-label md-floating-label--floating md-text--secondary"
|
||||
htmlFor="intent answer"
|
||||
>
|
||||
Answer source
|
||||
</label>
|
||||
</FloatingLabel>
|
||||
<InputField
|
||||
className=""
|
||||
fullWidth={true}
|
||||
id="intent answer"
|
||||
inlineIndicator={false}
|
||||
key="field"
|
||||
label="Answer source"
|
||||
onBlur={[Function]}
|
||||
onChange={[Function]}
|
||||
onFocus={[Function]}
|
||||
placeholder="Answer source"
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
>
|
||||
<input
|
||||
className="md-text-field md-text-field--floating-margin md-full-width md-text"
|
||||
id="intent answer"
|
||||
onBlur={[Function]}
|
||||
onChange={[Function]}
|
||||
onFocus={[Function]}
|
||||
placeholder="Answer source"
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
/>
|
||||
</InputField>
|
||||
<TextFieldDivider
|
||||
active={false}
|
||||
error={false}
|
||||
key="text-divider"
|
||||
lineDirection="center"
|
||||
>
|
||||
<Divider
|
||||
className="md-divider--text-field md-divider--expand-from-center"
|
||||
>
|
||||
<hr
|
||||
className="md-divider md-divider--text-field md-divider--expand-from-center"
|
||||
/>
|
||||
</Divider>
|
||||
</TextFieldDivider>
|
||||
<TextFieldMessage
|
||||
active={false}
|
||||
currentLength={12}
|
||||
error={false}
|
||||
key="message"
|
||||
leftIcon={false}
|
||||
maxLength={150}
|
||||
rightIcon={false}
|
||||
>
|
||||
<div
|
||||
className="md-text-field-message-container md-text-field-message-container--count-only md-full-width md-text--disabled"
|
||||
>
|
||||
<Message
|
||||
active={false}
|
||||
key="message"
|
||||
/>
|
||||
<Message
|
||||
active={false}
|
||||
className="md-text-field-message--counter"
|
||||
key="counter"
|
||||
>
|
||||
<div
|
||||
aria-hidden={true}
|
||||
className="md-text-field-message md-text-field-message--inactive md-text-field-message--counter"
|
||||
>
|
||||
12 / 150
|
||||
</div>
|
||||
</Message>
|
||||
</div>
|
||||
</TextFieldMessage>
|
||||
</div>
|
||||
</TextField>
|
||||
</div>
|
||||
</AnswerTextBox>
|
||||
`;
|
||||
|
||||
exports[`WordPress titles selected snapshot 1`] = `
|
||||
<AnswerTextBox
|
||||
answerType={1}
|
||||
externalAnswerSource="Dummy answer"
|
||||
handleAnswerSourceEdit={[Function]}
|
||||
>
|
||||
<div
|
||||
className="QuestionBox"
|
||||
>
|
||||
<TextField
|
||||
className="md-cell md-cell--bottom IntentDetailsInputBoxes"
|
||||
fullWidth={true}
|
||||
id="intent answer"
|
||||
label="Answer source"
|
||||
leftIconStateful={true}
|
||||
lineDirection="center"
|
||||
maxLength={150}
|
||||
onChange={[Function]}
|
||||
passwordIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
remove_red_eye
|
||||
</FontIcon>
|
||||
}
|
||||
placeholder="Answer source"
|
||||
rightIconStateful={true}
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
>
|
||||
<div
|
||||
className="md-text-field-container md-full-width md-text-field-container--input md-cell md-cell--bottom IntentDetailsInputBoxes"
|
||||
onClick={[Function]}
|
||||
>
|
||||
<FloatingLabel
|
||||
active={false}
|
||||
error={false}
|
||||
floating={true}
|
||||
htmlFor="intent answer"
|
||||
iconOffset={false}
|
||||
key="label"
|
||||
label="Answer source"
|
||||
>
|
||||
<label
|
||||
className="md-floating-label md-floating-label--floating md-text--secondary"
|
||||
htmlFor="intent answer"
|
||||
>
|
||||
Answer source
|
||||
</label>
|
||||
</FloatingLabel>
|
||||
<InputField
|
||||
className=""
|
||||
fullWidth={true}
|
||||
id="intent answer"
|
||||
inlineIndicator={false}
|
||||
key="field"
|
||||
label="Answer source"
|
||||
onBlur={[Function]}
|
||||
onChange={[Function]}
|
||||
onFocus={[Function]}
|
||||
placeholder="Answer source"
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
>
|
||||
<input
|
||||
className="md-text-field md-text-field--floating-margin md-full-width md-text"
|
||||
id="intent answer"
|
||||
onBlur={[Function]}
|
||||
onChange={[Function]}
|
||||
onFocus={[Function]}
|
||||
placeholder="Answer source"
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
/>
|
||||
</InputField>
|
||||
<TextFieldDivider
|
||||
active={false}
|
||||
error={false}
|
||||
key="text-divider"
|
||||
lineDirection="center"
|
||||
>
|
||||
<Divider
|
||||
className="md-divider--text-field md-divider--expand-from-center"
|
||||
>
|
||||
<hr
|
||||
className="md-divider md-divider--text-field md-divider--expand-from-center"
|
||||
/>
|
||||
</Divider>
|
||||
</TextFieldDivider>
|
||||
<TextFieldMessage
|
||||
active={false}
|
||||
currentLength={12}
|
||||
error={false}
|
||||
key="message"
|
||||
leftIcon={false}
|
||||
maxLength={150}
|
||||
rightIcon={false}
|
||||
>
|
||||
<div
|
||||
className="md-text-field-message-container md-text-field-message-container--count-only md-full-width md-text--disabled"
|
||||
>
|
||||
<Message
|
||||
active={false}
|
||||
key="message"
|
||||
/>
|
||||
<Message
|
||||
active={false}
|
||||
className="md-text-field-message--counter"
|
||||
key="counter"
|
||||
>
|
||||
<div
|
||||
aria-hidden={true}
|
||||
className="md-text-field-message md-text-field-message--inactive md-text-field-message--counter"
|
||||
>
|
||||
12 / 150
|
||||
</div>
|
||||
</Message>
|
||||
</div>
|
||||
</TextFieldMessage>
|
||||
</div>
|
||||
</TextField>
|
||||
</div>
|
||||
</AnswerTextBox>
|
||||
`;
|
||||
|
||||
exports[`predefined answer selected snapshot 1`] = `
|
||||
<AnswerTextBox
|
||||
answer="Dummy answer"
|
||||
answerType={0}
|
||||
handleAnswerEdit={[Function]}
|
||||
>
|
||||
<div
|
||||
className="QuestionBox"
|
||||
>
|
||||
<TextField
|
||||
className="md-cell md-cell--bottom IntentDetailsInputBoxes"
|
||||
fullWidth={true}
|
||||
id="intent answer"
|
||||
label="Answer"
|
||||
leftIconStateful={true}
|
||||
lineDirection="center"
|
||||
maxLength={150}
|
||||
onChange={[Function]}
|
||||
passwordIcon={
|
||||
<FontIcon
|
||||
iconClassName="material-icons"
|
||||
>
|
||||
remove_red_eye
|
||||
</FontIcon>
|
||||
}
|
||||
placeholder="Answer"
|
||||
rightIconStateful={true}
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
>
|
||||
<div
|
||||
className="md-text-field-container md-full-width md-text-field-container--input md-cell md-cell--bottom IntentDetailsInputBoxes"
|
||||
onClick={[Function]}
|
||||
>
|
||||
<FloatingLabel
|
||||
active={false}
|
||||
error={false}
|
||||
floating={true}
|
||||
htmlFor="intent answer"
|
||||
iconOffset={false}
|
||||
key="label"
|
||||
label="Answer"
|
||||
>
|
||||
<label
|
||||
className="md-floating-label md-floating-label--floating md-text--secondary"
|
||||
htmlFor="intent answer"
|
||||
>
|
||||
Answer
|
||||
</label>
|
||||
</FloatingLabel>
|
||||
<InputField
|
||||
className=""
|
||||
fullWidth={true}
|
||||
id="intent answer"
|
||||
inlineIndicator={false}
|
||||
key="field"
|
||||
label="Answer"
|
||||
onBlur={[Function]}
|
||||
onChange={[Function]}
|
||||
onFocus={[Function]}
|
||||
placeholder="Answer"
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
>
|
||||
<input
|
||||
className="md-text-field md-text-field--floating-margin md-full-width md-text"
|
||||
id="intent answer"
|
||||
onBlur={[Function]}
|
||||
onChange={[Function]}
|
||||
onFocus={[Function]}
|
||||
placeholder="Answer"
|
||||
type="text"
|
||||
value="Dummy answer"
|
||||
/>
|
||||
</InputField>
|
||||
<TextFieldDivider
|
||||
active={false}
|
||||
error={false}
|
||||
key="text-divider"
|
||||
lineDirection="center"
|
||||
>
|
||||
<Divider
|
||||
className="md-divider--text-field md-divider--expand-from-center"
|
||||
>
|
||||
<hr
|
||||
className="md-divider md-divider--text-field md-divider--expand-from-center"
|
||||
/>
|
||||
</Divider>
|
||||
</TextFieldDivider>
|
||||
<TextFieldMessage
|
||||
active={false}
|
||||
currentLength={12}
|
||||
error={false}
|
||||
key="message"
|
||||
leftIcon={false}
|
||||
maxLength={150}
|
||||
rightIcon={false}
|
||||
>
|
||||
<div
|
||||
className="md-text-field-message-container md-text-field-message-container--count-only md-full-width md-text--disabled"
|
||||
>
|
||||
<Message
|
||||
active={false}
|
||||
key="message"
|
||||
/>
|
||||
<Message
|
||||
active={false}
|
||||
className="md-text-field-message--counter"
|
||||
key="counter"
|
||||
>
|
||||
<div
|
||||
aria-hidden={true}
|
||||
className="md-text-field-message md-text-field-message--inactive md-text-field-message--counter"
|
||||
>
|
||||
12 / 150
|
||||
</div>
|
||||
</Message>
|
||||
</div>
|
||||
</TextFieldMessage>
|
||||
</div>
|
||||
</TextField>
|
||||
</div>
|
||||
</AnswerTextBox>
|
||||
`;
|
||||
@@ -0,0 +1,42 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`snapshot 1`] = `
|
||||
<Modal
|
||||
actions={
|
||||
Array [
|
||||
<button>
|
||||
Dummy action button
|
||||
</button>,
|
||||
]
|
||||
}
|
||||
title="Dummy title"
|
||||
>
|
||||
<div
|
||||
className="modal"
|
||||
>
|
||||
<div
|
||||
className="modal-content"
|
||||
>
|
||||
<h2
|
||||
className="header"
|
||||
>
|
||||
Dummy title
|
||||
</h2>
|
||||
<button
|
||||
key="1"
|
||||
>
|
||||
Child button
|
||||
</button>
|
||||
<div
|
||||
className="actions"
|
||||
>
|
||||
<button
|
||||
key="0"
|
||||
>
|
||||
Dummy action button
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Modal>
|
||||
`;
|
||||
Reference in New Issue
Block a user