@zohodesk/components 1.0.0-temp-166 → 1.0.0-temp-167
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +20 -0
- package/assets/Appearance/dark/themes/blue/blue_ComponentTheme_DarkTheme.module.css +24 -24
- package/assets/Appearance/dark/themes/green/green_ComponentTheme_DarkTheme.module.css +24 -24
- package/assets/Appearance/dark/themes/orange/orange_ComponentTheme_DarkTheme.module.css +24 -24
- package/assets/Appearance/dark/themes/red/red_ComponentTheme_DarkTheme.module.css +24 -24
- package/assets/Appearance/dark/themes/yellow/yellow_ComponentTheme_DarkTheme.module.css +24 -24
- package/assets/Appearance/light/themes/blue/blue_ComponentTheme_LightTheme.module.css +24 -24
- package/assets/Appearance/light/themes/green/green_ComponentTheme_LightTheme.module.css +24 -24
- package/assets/Appearance/light/themes/orange/orange_ComponentTheme_LightTheme.module.css +24 -24
- package/assets/Appearance/light/themes/red/red_ComponentTheme_LightTheme.module.css +24 -24
- package/assets/Appearance/light/themes/yellow/yellow_ComponentTheme_LightTheme.module.css +24 -24
- package/assets/Appearance/pureDark/themes/blue/blue_ComponentTheme_PureDarkTheme.module.css +24 -24
- package/assets/Appearance/pureDark/themes/green/green_ComponentTheme_PureDarkTheme.module.css +24 -24
- package/assets/Appearance/pureDark/themes/orange/orange_ComponentTheme_PureDarkTheme.module.css +24 -24
- package/assets/Appearance/pureDark/themes/red/red_ComponentTheme_PureDarkTheme.module.css +24 -24
- package/assets/Appearance/pureDark/themes/yellow/yellow_ComponentTheme_PureDarkTheme.module.css +24 -24
- package/es/Button/__tests__/Button.spec.js +61 -0
- package/es/Button/__tests__/__snapshots__/Button.spec.js.snap +440 -0
- package/es/Buttongroup/Buttongroup.js +1 -1
- package/es/DateTime/DateTime.js +2 -2
- package/es/DropBox/DropBox.js +24 -12
- package/es/DropBox/props/defaultProps.js +2 -1
- package/es/DropBox/props/propTypes.js +2 -1
- package/es/ListItem/ListContainer.js +3 -2
- package/es/ListItem/ListItem.js +8 -3
- package/es/ListItem/ListItemWithAvatar.js +8 -3
- package/es/ListItem/ListItemWithCheckBox.js +5 -1
- package/es/ListItem/ListItemWithIcon.js +8 -3
- package/es/ListItem/ListItemWithRadio.js +5 -1
- package/es/MultiSelect/props/propTypes.js +1 -1
- package/es/Select/Select.js +2 -0
- package/lib/Button/__tests__/Button.spec.js +62 -0
- package/lib/Button/__tests__/__snapshots__/Button.spec.js.snap +440 -0
- package/lib/Buttongroup/Buttongroup.js +1 -1
- package/lib/DateTime/DateTime.js +2 -2
- package/lib/DropBox/DropBox.js +26 -12
- package/lib/DropBox/props/defaultProps.js +2 -1
- package/lib/DropBox/props/propTypes.js +2 -1
- package/lib/ListItem/ListContainer.js +4 -2
- package/lib/ListItem/ListItem.js +14 -3
- package/lib/ListItem/ListItemWithAvatar.js +14 -3
- package/lib/ListItem/ListItemWithCheckBox.js +12 -1
- package/lib/ListItem/ListItemWithIcon.js +14 -3
- package/lib/ListItem/ListItemWithRadio.js +12 -1
- package/lib/MultiSelect/props/propTypes.js +1 -1
- package/lib/Select/Select.js +2 -0
- package/package.json +21 -13
- package/postPublish.js +8 -0
- package/prePublish.js +70 -0
- package/result.json +1 -0
- package/es/Accordion/__tests__/Accordion.spec.js +0 -79
- package/es/Animation/__tests__/Animation.spec.js +0 -17
- package/es/Avatar/__tests__/Avatar.spec.js +0 -161
- package/es/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +0 -288
- package/es/AvatarTeam/__tests__/AvatarTeam.spec.js +0 -76
- package/es/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +0 -226
- package/es/Buttongroup/__test__/Buttongroup.spec.js +0 -73
- package/es/Buttongroup/__test__/__snapshots__/Buttongroup.spec.js.snap +0 -146
- package/es/Card/__tests__/Card.spec.js +0 -36
- package/es/CheckBox/__tests__/CheckBox.spec.js +0 -12
- package/es/DateTime/__tests__/CalendarView.spec.js +0 -33
- package/es/DateTime/__tests__/DateTime.spec.js +0 -115
- package/es/DateTime/__tests__/DateWidget.spec.js +0 -75
- package/es/DropBox/__tests__/DropBox.spec.js +0 -81
- package/es/DropDown/__tests__/DropDown.spec.js +0 -44
- package/es/DropDown/__tests__/DropDownItem.spec.js +0 -45
- package/es/DropDown/__tests__/DropDownSearch.spec.js +0 -11
- package/es/Label/__tests__/Label.spec.js +0 -120
- package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +0 -101
- package/es/Layout/__tests__/Box.spec.js +0 -114
- package/es/Layout/__tests__/Container.spec.js +0 -120
- package/es/MultiSelect/__tests__/MultiSelect.spec.js +0 -160
- package/es/PopOver/__tests__/PopOver.spec.js +0 -14
- package/es/Popup/__tests__/Popup.spec.js +0 -134
- package/es/Radio/__tests__/Radiospec.js +0 -23
- package/es/Ribbon/__tests__/Ribbon.spec.js +0 -168
- package/es/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +0 -163
- package/es/Select/__tests__/Select.spec.js +0 -345
- package/es/Stencils/__tests__/Stencils.spec.js +0 -69
- package/es/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +0 -49
- package/es/Tab/__tests__/Tab.spec.js +0 -117
- package/es/Tab/__tests__/TabContent.spec.js +0 -16
- package/es/Tab/__tests__/TabContentWrapper.spec.js +0 -50
- package/es/Tab/__tests__/TabWrapper.spec.js +0 -86
- package/es/Tab/__tests__/Tabs.spec.js +0 -115
- package/es/Tag/__tests__/Tag.spec.js +0 -28
- package/es/TextBox/__tests__/TextBox.spec.js +0 -189
- package/es/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +0 -127
- package/es/TextBoxIcon/__tests__/TextBoxIcon.spec.js +0 -212
- package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +0 -334
- package/es/Textarea/__tests__/Textarea.spec.js +0 -171
- package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +0 -97
- package/es/Tooltip/__tests__/Tooltip.spec.js +0 -52
- package/es/utils/__tests__/constructFullName.spec.js +0 -9
- package/es/utils/__tests__/debounce.spec.js +0 -37
- package/es/utils/__tests__/getInitial.spec.js +0 -23
- package/lib/Accordion/__tests__/Accordion.spec.js +0 -85
- package/lib/Animation/__tests__/Animation.spec.js +0 -23
- package/lib/Avatar/__tests__/Avatar.spec.js +0 -208
- package/lib/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +0 -288
- package/lib/AvatarTeam/__tests__/AvatarTeam.spec.js +0 -92
- package/lib/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +0 -226
- package/lib/Buttongroup/__test__/Buttongroup.spec.js +0 -86
- package/lib/Buttongroup/__test__/__snapshots__/Buttongroup.spec.js.snap +0 -146
- package/lib/Card/__tests__/Card.spec.js +0 -56
- package/lib/CheckBox/__tests__/CheckBox.spec.js +0 -18
- package/lib/DateTime/__tests__/CalendarView.spec.js +0 -45
- package/lib/DateTime/__tests__/DateTime.spec.js +0 -127
- package/lib/DateTime/__tests__/DateWidget.spec.js +0 -81
- package/lib/DropBox/__tests__/DropBox.spec.js +0 -87
- package/lib/DropDown/__tests__/DropDown.spec.js +0 -50
- package/lib/DropDown/__tests__/DropDownItem.spec.js +0 -51
- package/lib/DropDown/__tests__/DropDownSearch.spec.js +0 -17
- package/lib/Label/__tests__/Label.spec.js +0 -137
- package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +0 -101
- package/lib/Layout/__tests__/Box.spec.js +0 -121
- package/lib/Layout/__tests__/Container.spec.js +0 -127
- package/lib/MultiSelect/__tests__/MultiSelect.spec.js +0 -170
- package/lib/PopOver/__tests__/PopOver.spec.js +0 -20
- package/lib/Popup/__tests__/Popup.spec.js +0 -192
- package/lib/Radio/__tests__/Radiospec.js +0 -29
- package/lib/Ribbon/__tests__/Ribbon.spec.js +0 -193
- package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +0 -163
- package/lib/Select/__tests__/Select.spec.js +0 -383
- package/lib/Stencils/__tests__/Stencils.spec.js +0 -84
- package/lib/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +0 -49
- package/lib/Tab/__tests__/Tab.spec.js +0 -123
- package/lib/Tab/__tests__/TabContent.spec.js +0 -22
- package/lib/Tab/__tests__/TabContentWrapper.spec.js +0 -59
- package/lib/Tab/__tests__/TabWrapper.spec.js +0 -100
- package/lib/Tab/__tests__/Tabs.spec.js +0 -123
- package/lib/Tag/__tests__/Tag.spec.js +0 -35
- package/lib/TextBox/__tests__/TextBox.spec.js +0 -205
- package/lib/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +0 -127
- package/lib/TextBoxIcon/__tests__/TextBoxIcon.spec.js +0 -228
- package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +0 -334
- package/lib/Textarea/__tests__/Textarea.spec.js +0 -186
- package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +0 -97
- package/lib/Tooltip/__tests__/Tooltip.spec.js +0 -98
- package/lib/utils/__tests__/constructFullName.spec.js +0 -12
- package/lib/utils/__tests__/debounce.spec.js +0 -40
- package/lib/utils/__tests__/getInitial.spec.js +0 -26
|
@@ -1,86 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import ReactDOM from 'react-dom';
|
|
3
|
-
import TabWrapper from '../TabWrapper';
|
|
4
|
-
import Tab from '../Tab';
|
|
5
|
-
import Tabs from '../Tabs';
|
|
6
|
-
describe('TabWrapper Component', () => {
|
|
7
|
-
it('is Tab rendered', () => {
|
|
8
|
-
let onSelect = jest.fn();
|
|
9
|
-
let renderedDOM = TestUtils.renderIntoDocument( /*#__PURE__*/React.createElement(TabWrapper, {
|
|
10
|
-
defaultTab: "0",
|
|
11
|
-
type: "alpha",
|
|
12
|
-
onSelect: onSelect
|
|
13
|
-
}, /*#__PURE__*/React.createElement(Tabs, {
|
|
14
|
-
isResponsive: false
|
|
15
|
-
}, /*#__PURE__*/React.createElement(Tab, {
|
|
16
|
-
key: '0',
|
|
17
|
-
id: "0"
|
|
18
|
-
}))));
|
|
19
|
-
let tabChild = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'tabMenu_Tab');
|
|
20
|
-
expect(tabChild.getAttribute('data-id')).toBe('tabMenu_Tab');
|
|
21
|
-
});
|
|
22
|
-
it('is onSelect called', () => {
|
|
23
|
-
let onSelect = jest.fn();
|
|
24
|
-
let renderedDOM = TestUtils.renderIntoDocument( /*#__PURE__*/React.createElement(TabWrapper, {
|
|
25
|
-
defaultTab: "0",
|
|
26
|
-
type: "alpha",
|
|
27
|
-
onSelect: onSelect
|
|
28
|
-
}, /*#__PURE__*/React.createElement(Tabs, {
|
|
29
|
-
isResponsive: false
|
|
30
|
-
}, /*#__PURE__*/React.createElement(Tab, {
|
|
31
|
-
key: '0',
|
|
32
|
-
id: "0"
|
|
33
|
-
}))));
|
|
34
|
-
let tabChild = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'tabMenu_Tab');
|
|
35
|
-
TestUtils.Simulate.click(tabChild, {
|
|
36
|
-
currentTarget: {
|
|
37
|
-
offsetLeft: 0,
|
|
38
|
-
offsetWidth: 0
|
|
39
|
-
}
|
|
40
|
-
});
|
|
41
|
-
expect(onSelect).toHaveBeenCalled();
|
|
42
|
-
});
|
|
43
|
-
it('is disable State internally', () => {
|
|
44
|
-
let renderedDOM = TestUtils.renderIntoDocument( /*#__PURE__*/React.createElement(TabWrapper, {
|
|
45
|
-
defaultTab: "0",
|
|
46
|
-
type: "alpha"
|
|
47
|
-
}, /*#__PURE__*/React.createElement(Tabs, {
|
|
48
|
-
isResponsive: false
|
|
49
|
-
}, /*#__PURE__*/React.createElement(Tab, {
|
|
50
|
-
key: '0',
|
|
51
|
-
id: "0"
|
|
52
|
-
}, "One"), /*#__PURE__*/React.createElement(Tab, {
|
|
53
|
-
key: '1',
|
|
54
|
-
id: "1"
|
|
55
|
-
}, "Two"))));
|
|
56
|
-
expect(renderedDOM.state.selectedTabInternal).toBe('0');
|
|
57
|
-
});
|
|
58
|
-
it('change selectedTab id', () => {
|
|
59
|
-
let node = document.createElement('div');
|
|
60
|
-
let children = /*#__PURE__*/React.createElement(Tabs, {
|
|
61
|
-
isResponsive: false
|
|
62
|
-
}, /*#__PURE__*/React.createElement(Tab, {
|
|
63
|
-
key: '0',
|
|
64
|
-
id: "0"
|
|
65
|
-
}, "One"), /*#__PURE__*/React.createElement(Tab, {
|
|
66
|
-
key: '1',
|
|
67
|
-
id: "1"
|
|
68
|
-
}, "Two"));
|
|
69
|
-
/*eslint-disable */
|
|
70
|
-
|
|
71
|
-
let renderedDOM = ReactDOM.render( /*#__PURE__*/React.createElement(TabWrapper, {
|
|
72
|
-
defaultTab: '0',
|
|
73
|
-
type: "alpha",
|
|
74
|
-
hookToDisableInternalState: true
|
|
75
|
-
}, children), node);
|
|
76
|
-
let tab = TestUtils.scryRenderedComponentsWithTestid(renderedDOM, 'tabMenu_Tab');
|
|
77
|
-
expect(tab[0].className.contains('Active')).toBe(true);
|
|
78
|
-
ReactDOM.render( /*#__PURE__*/React.createElement(TabWrapper, {
|
|
79
|
-
defaultTab: '1',
|
|
80
|
-
type: "alpha",
|
|
81
|
-
hookToDisableInternalState: true
|
|
82
|
-
}, children), node);
|
|
83
|
-
expect(tab[0].className.contains('Active')).toBe(false);
|
|
84
|
-
expect(tab[1].className.contains('Active')).toBe(true);
|
|
85
|
-
});
|
|
86
|
-
});
|
|
@@ -1,115 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import ReactDOM from 'react-dom';
|
|
3
|
-
import Tab from '../Tab';
|
|
4
|
-
import Tabs from '../Tabs';
|
|
5
|
-
let defaultProps = {
|
|
6
|
-
type: 'alpha',
|
|
7
|
-
selectedTab: '0',
|
|
8
|
-
children: [/*#__PURE__*/React.createElement("div", {
|
|
9
|
-
key: 0,
|
|
10
|
-
"data-id": "customtab"
|
|
11
|
-
}, "Not tab component")],
|
|
12
|
-
isResponsive: false
|
|
13
|
-
};
|
|
14
|
-
let tabChildrenProps = {
|
|
15
|
-
type: 'alpha',
|
|
16
|
-
isResponsive: false,
|
|
17
|
-
selectedTab: '0',
|
|
18
|
-
children: [/*#__PURE__*/React.createElement(Tab, {
|
|
19
|
-
style: {
|
|
20
|
-
width: '200px'
|
|
21
|
-
},
|
|
22
|
-
key: 0,
|
|
23
|
-
id: '0'
|
|
24
|
-
}, "Tab component")]
|
|
25
|
-
};
|
|
26
|
-
describe('Tabs Component', () => {
|
|
27
|
-
it('is contains alpha class', () => {
|
|
28
|
-
const {
|
|
29
|
-
props,
|
|
30
|
-
renderedDOM
|
|
31
|
-
} = setup(Tabs, {
|
|
32
|
-
type: 'alpha',
|
|
33
|
-
isResponsive: false
|
|
34
|
-
});
|
|
35
|
-
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'containerComponent').className.contains('alpha')).toBe(true);
|
|
36
|
-
});
|
|
37
|
-
it('is contains special class', () => {
|
|
38
|
-
const {
|
|
39
|
-
props,
|
|
40
|
-
renderedDOM
|
|
41
|
-
} = setup(Tabs, {
|
|
42
|
-
type: 'special'
|
|
43
|
-
});
|
|
44
|
-
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'containerComponent').className.contains('special')).toBe(true);
|
|
45
|
-
});
|
|
46
|
-
it('is contains border class', () => {
|
|
47
|
-
const {
|
|
48
|
-
props,
|
|
49
|
-
renderedDOM
|
|
50
|
-
} = setup(Tabs, {
|
|
51
|
-
type: 'alpha',
|
|
52
|
-
needBorder: true
|
|
53
|
-
});
|
|
54
|
-
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'containerComponent').className.contains('border')).toBe(true);
|
|
55
|
-
});
|
|
56
|
-
it('is contains padding class', () => {
|
|
57
|
-
const {
|
|
58
|
-
props,
|
|
59
|
-
renderedDOM
|
|
60
|
-
} = setup(Tabs, {
|
|
61
|
-
type: 'alpha',
|
|
62
|
-
needPadding: true
|
|
63
|
-
});
|
|
64
|
-
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'containerComponent').className.contains('padding')).toBe(true);
|
|
65
|
-
});
|
|
66
|
-
it('is contains custom class', () => {
|
|
67
|
-
const {
|
|
68
|
-
props,
|
|
69
|
-
renderedDOM
|
|
70
|
-
} = setup(Tabs, {
|
|
71
|
-
type: 'alpha',
|
|
72
|
-
className: 'customClass'
|
|
73
|
-
});
|
|
74
|
-
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'containerComponent').className.contains('customClass')).toBe(true);
|
|
75
|
-
});
|
|
76
|
-
it('did render custom tab', () => {
|
|
77
|
-
const {
|
|
78
|
-
props,
|
|
79
|
-
renderedDOM
|
|
80
|
-
} = setup(Tabs, defaultProps);
|
|
81
|
-
let component = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'customtab');
|
|
82
|
-
expect(component.getAttribute('data-id')).toBe('customtab');
|
|
83
|
-
});
|
|
84
|
-
it('did render Tab', () => {
|
|
85
|
-
const {
|
|
86
|
-
props,
|
|
87
|
-
renderedDOM
|
|
88
|
-
} = setup(Tabs, tabChildrenProps);
|
|
89
|
-
let component = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'taskSubtab');
|
|
90
|
-
expect(component.getAttribute('data-id')).toBe('taskSubtab');
|
|
91
|
-
});
|
|
92
|
-
it('move Highlight called', () => {
|
|
93
|
-
const {
|
|
94
|
-
props,
|
|
95
|
-
renderedDOM
|
|
96
|
-
} = setup(Tabs, Object.assign({}, tabChildrenProps, {
|
|
97
|
-
isAnimate: true,
|
|
98
|
-
needTabBorder: true
|
|
99
|
-
}));
|
|
100
|
-
let component = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'highlight');
|
|
101
|
-
expect(component.getAttribute('style')).toBe('left: 0; width: 0;');
|
|
102
|
-
});
|
|
103
|
-
fit('isResponsive called', () => {
|
|
104
|
-
const {
|
|
105
|
-
props,
|
|
106
|
-
renderedDOM
|
|
107
|
-
} = setup(Tabs, Object.assign({}, tabChildrenProps, {
|
|
108
|
-
isAnimate: true,
|
|
109
|
-
isResponsive: true,
|
|
110
|
-
needTabBorder: true
|
|
111
|
-
}));
|
|
112
|
-
let component = TestUtils.scryRenderedComponentsWithTestid(renderedDOM, 'taskSubtab');
|
|
113
|
-
expect(component.length).toBe(0);
|
|
114
|
-
});
|
|
115
|
-
});
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import renderer from 'react-test-renderer';
|
|
3
|
-
import Tag from '../Tag';
|
|
4
|
-
const defaultProps = {};
|
|
5
|
-
describe('Tag component conditions', () => {
|
|
6
|
-
it('Select Tag', () => {
|
|
7
|
-
let {
|
|
8
|
-
props,
|
|
9
|
-
renderedDOM
|
|
10
|
-
} = setup(Tag, Object.assign({}, defaultProps, {
|
|
11
|
-
onSelectTag: jest.fn()
|
|
12
|
-
}));
|
|
13
|
-
let component = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'tag_Tag');
|
|
14
|
-
TestUtils.Simulate.click(component);
|
|
15
|
-
expect(props.onSelectTag).toHaveBeenCalled();
|
|
16
|
-
});
|
|
17
|
-
it('Remove Tag', () => {
|
|
18
|
-
let {
|
|
19
|
-
props,
|
|
20
|
-
renderedDOM
|
|
21
|
-
} = setup(Tag, Object.assign({}, defaultProps, {
|
|
22
|
-
onRemove: jest.fn()
|
|
23
|
-
}));
|
|
24
|
-
let component = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'tag_RemoveTag');
|
|
25
|
-
TestUtils.Simulate.click(component);
|
|
26
|
-
expect(props.onRemove).toHaveBeenCalled();
|
|
27
|
-
});
|
|
28
|
-
});
|
|
@@ -1,189 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import TextBox from '../TextBox';
|
|
3
|
-
import renderer from 'react-test-renderer';
|
|
4
|
-
describe('TextBox component', () => {
|
|
5
|
-
it('should display size small', () => {
|
|
6
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
7
|
-
maxLength: "100",
|
|
8
|
-
placeHolder: "Text Area",
|
|
9
|
-
size: "small",
|
|
10
|
-
variant: "default"
|
|
11
|
-
}));
|
|
12
|
-
let tree = ele.toJSON();
|
|
13
|
-
expect(tree).toMatchSnapshot();
|
|
14
|
-
});
|
|
15
|
-
it('should display size medium', () => {
|
|
16
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
17
|
-
maxLength: "100",
|
|
18
|
-
placeHolder: "Text Area",
|
|
19
|
-
size: "medium",
|
|
20
|
-
variant: "default"
|
|
21
|
-
}));
|
|
22
|
-
let tree = ele.toJSON();
|
|
23
|
-
expect(tree).toMatchSnapshot();
|
|
24
|
-
});
|
|
25
|
-
it('should display size xmedium', () => {
|
|
26
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
27
|
-
maxLength: "100",
|
|
28
|
-
placeHolder: "Text Area",
|
|
29
|
-
size: "xmedium",
|
|
30
|
-
variant: "default"
|
|
31
|
-
}));
|
|
32
|
-
let tree = ele.toJSON();
|
|
33
|
-
expect(tree).toMatchSnapshot();
|
|
34
|
-
});
|
|
35
|
-
it('should display size small - primary', () => {
|
|
36
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
37
|
-
maxLength: "100",
|
|
38
|
-
placeHolder: "Text Area",
|
|
39
|
-
size: "small",
|
|
40
|
-
variant: "primary"
|
|
41
|
-
}));
|
|
42
|
-
let tree = ele.toJSON();
|
|
43
|
-
expect(tree).toMatchSnapshot();
|
|
44
|
-
});
|
|
45
|
-
it('should display size medium - primary', () => {
|
|
46
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
47
|
-
maxLength: "100",
|
|
48
|
-
placeHolder: "Text Area",
|
|
49
|
-
size: "medium",
|
|
50
|
-
variant: "primary"
|
|
51
|
-
}));
|
|
52
|
-
let tree = ele.toJSON();
|
|
53
|
-
expect(tree).toMatchSnapshot();
|
|
54
|
-
});
|
|
55
|
-
it('should display size xmedium - primary', () => {
|
|
56
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
57
|
-
maxLength: "100",
|
|
58
|
-
placeHolder: "Text Area",
|
|
59
|
-
size: "xmedium",
|
|
60
|
-
variant: "primary"
|
|
61
|
-
}));
|
|
62
|
-
let tree = ele.toJSON();
|
|
63
|
-
expect(tree).toMatchSnapshot();
|
|
64
|
-
});
|
|
65
|
-
it('should display size small - secondary', () => {
|
|
66
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
67
|
-
maxLength: "100",
|
|
68
|
-
placeHolder: "Text Area",
|
|
69
|
-
size: "small",
|
|
70
|
-
variant: "secondary"
|
|
71
|
-
}));
|
|
72
|
-
let tree = ele.toJSON();
|
|
73
|
-
expect(tree).toMatchSnapshot();
|
|
74
|
-
});
|
|
75
|
-
it('should display size medium - secondary', () => {
|
|
76
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
77
|
-
maxLength: "100",
|
|
78
|
-
placeHolder: "Text Area",
|
|
79
|
-
size: "medium",
|
|
80
|
-
variant: "secondary"
|
|
81
|
-
}));
|
|
82
|
-
let tree = ele.toJSON();
|
|
83
|
-
expect(tree).toMatchSnapshot();
|
|
84
|
-
});
|
|
85
|
-
it('should display size xmedium - secondary', () => {
|
|
86
|
-
let ele = renderer.create( /*#__PURE__*/React.createElement(TextBox, {
|
|
87
|
-
maxLength: "100",
|
|
88
|
-
placeHolder: "Text Area",
|
|
89
|
-
size: "xmedium",
|
|
90
|
-
variant: "secondary"
|
|
91
|
-
}));
|
|
92
|
-
let tree = ele.toJSON();
|
|
93
|
-
expect(tree).toMatchSnapshot();
|
|
94
|
-
});
|
|
95
|
-
it('should text propertly entered', () => {
|
|
96
|
-
let renderedDOM = TestUtils.renderIntoDocument( /*#__PURE__*/React.createElement(TextBox, {
|
|
97
|
-
maxLength: "100",
|
|
98
|
-
placeHolder: "Text Box",
|
|
99
|
-
size: "medium",
|
|
100
|
-
variant: "primary",
|
|
101
|
-
value: "Text Box Working"
|
|
102
|
-
}));
|
|
103
|
-
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBox').value.contains('Text Box Working')).toBe(true);
|
|
104
|
-
});
|
|
105
|
-
it('should placeHolder propertly entered', () => {
|
|
106
|
-
let renderedDOM = TestUtils.renderIntoDocument( /*#__PURE__*/React.createElement(TextBox, {
|
|
107
|
-
maxLength: "100",
|
|
108
|
-
placeHolder: "Text Box",
|
|
109
|
-
size: "medium",
|
|
110
|
-
variant: "primary",
|
|
111
|
-
text: "Text Box Working"
|
|
112
|
-
}));
|
|
113
|
-
expect(TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBox').getAttribute('placeholder')).toMatch(/Text Box/);
|
|
114
|
-
}); // it('Check disabled works', () => {
|
|
115
|
-
// let renderedDOM = TestUtils.renderIntoDocument(
|
|
116
|
-
// <TextBox maxLength='100' placeHolder='Text Box' size='medium' variant='primary' value='Text Box Working' disabled />
|
|
117
|
-
// );
|
|
118
|
-
// let pass = false;
|
|
119
|
-
// let classNames = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBox').classList;
|
|
120
|
-
// Object.keys(classNames)
|
|
121
|
-
// .map(className => {
|
|
122
|
-
// if (classNames[className] == 'disabled') {
|
|
123
|
-
// pass = true;
|
|
124
|
-
// }
|
|
125
|
-
// });
|
|
126
|
-
// expect(
|
|
127
|
-
// pass
|
|
128
|
-
// ).toBe(true);
|
|
129
|
-
// });
|
|
130
|
-
// it('Check readOnly works', () => {
|
|
131
|
-
// let renderedDOM = TestUtils.renderIntoDocument(
|
|
132
|
-
// <TextBox maxLength='100' placeHolder='Text Box' size='medium' variant='primary' value='Text Box Working' readOnly />
|
|
133
|
-
// );
|
|
134
|
-
// let pass = false;
|
|
135
|
-
// let classNames = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBox').classList;
|
|
136
|
-
// Object.keys(classNames)
|
|
137
|
-
// .map(className => {
|
|
138
|
-
// if (classNames[className] == 'pointer') {
|
|
139
|
-
// pass = true;
|
|
140
|
-
// }
|
|
141
|
-
// });
|
|
142
|
-
// expect(
|
|
143
|
-
// pass
|
|
144
|
-
// ).toBe(true);
|
|
145
|
-
// });
|
|
146
|
-
|
|
147
|
-
it('Check onchange works', () => {
|
|
148
|
-
let mockfn = jest.fn();
|
|
149
|
-
let renderedDOM = TestUtils.renderIntoDocument( /*#__PURE__*/React.createElement(TextBox, {
|
|
150
|
-
maxLength: "100",
|
|
151
|
-
placeHolder: "Text Box",
|
|
152
|
-
size: "medium",
|
|
153
|
-
variant: "primary",
|
|
154
|
-
value: "Text Box Working",
|
|
155
|
-
onChange: mockfn
|
|
156
|
-
}));
|
|
157
|
-
let onChangeEle = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBox');
|
|
158
|
-
TestUtils.Simulate.change(onChangeEle);
|
|
159
|
-
expect(mockfn.mock.calls.length).toBe(1);
|
|
160
|
-
});
|
|
161
|
-
it('Check onBlur works', () => {
|
|
162
|
-
let mockfn = jest.fn();
|
|
163
|
-
let renderedDOM = TestUtils.renderIntoDocument( /*#__PURE__*/React.createElement(TextBox, {
|
|
164
|
-
maxLength: "100",
|
|
165
|
-
placeHolder: "Text Box",
|
|
166
|
-
size: "medium",
|
|
167
|
-
variant: "primary",
|
|
168
|
-
value: "Text Box Working",
|
|
169
|
-
onBlur: mockfn
|
|
170
|
-
}));
|
|
171
|
-
let onBlurEle = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBox');
|
|
172
|
-
TestUtils.Simulate.blur(onBlurEle);
|
|
173
|
-
expect(mockfn.mock.calls.length).toBe(1);
|
|
174
|
-
});
|
|
175
|
-
it('Check onFocus works', () => {
|
|
176
|
-
let mockfn = jest.fn();
|
|
177
|
-
let renderedDOM = TestUtils.renderIntoDocument( /*#__PURE__*/React.createElement(TextBox, {
|
|
178
|
-
maxLength: "100",
|
|
179
|
-
placeHolder: "Text Box",
|
|
180
|
-
size: "medium",
|
|
181
|
-
variant: "primary",
|
|
182
|
-
value: "Text Box Working",
|
|
183
|
-
onFocus: mockfn
|
|
184
|
-
}));
|
|
185
|
-
let onFocusEle = TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'textBox');
|
|
186
|
-
TestUtils.Simulate.focus(onFocusEle);
|
|
187
|
-
expect(mockfn.mock.calls.length).toBe(1);
|
|
188
|
-
});
|
|
189
|
-
});
|
|
@@ -1,127 +0,0 @@
|
|
|
1
|
-
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
|
-
|
|
3
|
-
exports[`TextBox component should display size medium - primary 1`] = `
|
|
4
|
-
<input
|
|
5
|
-
className=" container medium primary border effect borderColor_default"
|
|
6
|
-
data-id="textBox"
|
|
7
|
-
maxLength="100"
|
|
8
|
-
onBlur={[Function]}
|
|
9
|
-
onChange={[Function]}
|
|
10
|
-
onFocus={[Function]}
|
|
11
|
-
placeholder="Text Area"
|
|
12
|
-
type="text"
|
|
13
|
-
value=""
|
|
14
|
-
/>
|
|
15
|
-
`;
|
|
16
|
-
|
|
17
|
-
exports[`TextBox component should display size medium - secondary 1`] = `
|
|
18
|
-
<input
|
|
19
|
-
className=" container medium secondary border effect borderColor_default"
|
|
20
|
-
data-id="textBox"
|
|
21
|
-
maxLength="100"
|
|
22
|
-
onBlur={[Function]}
|
|
23
|
-
onChange={[Function]}
|
|
24
|
-
onFocus={[Function]}
|
|
25
|
-
placeholder="Text Area"
|
|
26
|
-
type="text"
|
|
27
|
-
value=""
|
|
28
|
-
/>
|
|
29
|
-
`;
|
|
30
|
-
|
|
31
|
-
exports[`TextBox component should display size medium 1`] = `
|
|
32
|
-
<input
|
|
33
|
-
className=" container medium default border effect borderColor_default"
|
|
34
|
-
data-id="textBox"
|
|
35
|
-
maxLength="100"
|
|
36
|
-
onBlur={[Function]}
|
|
37
|
-
onChange={[Function]}
|
|
38
|
-
onFocus={[Function]}
|
|
39
|
-
placeholder="Text Area"
|
|
40
|
-
type="text"
|
|
41
|
-
value=""
|
|
42
|
-
/>
|
|
43
|
-
`;
|
|
44
|
-
|
|
45
|
-
exports[`TextBox component should display size small - primary 1`] = `
|
|
46
|
-
<input
|
|
47
|
-
className=" container small primary border effect borderColor_default"
|
|
48
|
-
data-id="textBox"
|
|
49
|
-
maxLength="100"
|
|
50
|
-
onBlur={[Function]}
|
|
51
|
-
onChange={[Function]}
|
|
52
|
-
onFocus={[Function]}
|
|
53
|
-
placeholder="Text Area"
|
|
54
|
-
type="text"
|
|
55
|
-
value=""
|
|
56
|
-
/>
|
|
57
|
-
`;
|
|
58
|
-
|
|
59
|
-
exports[`TextBox component should display size small - secondary 1`] = `
|
|
60
|
-
<input
|
|
61
|
-
className=" container small secondary border effect borderColor_default"
|
|
62
|
-
data-id="textBox"
|
|
63
|
-
maxLength="100"
|
|
64
|
-
onBlur={[Function]}
|
|
65
|
-
onChange={[Function]}
|
|
66
|
-
onFocus={[Function]}
|
|
67
|
-
placeholder="Text Area"
|
|
68
|
-
type="text"
|
|
69
|
-
value=""
|
|
70
|
-
/>
|
|
71
|
-
`;
|
|
72
|
-
|
|
73
|
-
exports[`TextBox component should display size small 1`] = `
|
|
74
|
-
<input
|
|
75
|
-
className=" container small default border effect borderColor_default"
|
|
76
|
-
data-id="textBox"
|
|
77
|
-
maxLength="100"
|
|
78
|
-
onBlur={[Function]}
|
|
79
|
-
onChange={[Function]}
|
|
80
|
-
onFocus={[Function]}
|
|
81
|
-
placeholder="Text Area"
|
|
82
|
-
type="text"
|
|
83
|
-
value=""
|
|
84
|
-
/>
|
|
85
|
-
`;
|
|
86
|
-
|
|
87
|
-
exports[`TextBox component should display size xmedium - primary 1`] = `
|
|
88
|
-
<input
|
|
89
|
-
className=" container xmedium primary border effect borderColor_default"
|
|
90
|
-
data-id="textBox"
|
|
91
|
-
maxLength="100"
|
|
92
|
-
onBlur={[Function]}
|
|
93
|
-
onChange={[Function]}
|
|
94
|
-
onFocus={[Function]}
|
|
95
|
-
placeholder="Text Area"
|
|
96
|
-
type="text"
|
|
97
|
-
value=""
|
|
98
|
-
/>
|
|
99
|
-
`;
|
|
100
|
-
|
|
101
|
-
exports[`TextBox component should display size xmedium - secondary 1`] = `
|
|
102
|
-
<input
|
|
103
|
-
className=" container xmedium secondary border effect borderColor_default"
|
|
104
|
-
data-id="textBox"
|
|
105
|
-
maxLength="100"
|
|
106
|
-
onBlur={[Function]}
|
|
107
|
-
onChange={[Function]}
|
|
108
|
-
onFocus={[Function]}
|
|
109
|
-
placeholder="Text Area"
|
|
110
|
-
type="text"
|
|
111
|
-
value=""
|
|
112
|
-
/>
|
|
113
|
-
`;
|
|
114
|
-
|
|
115
|
-
exports[`TextBox component should display size xmedium 1`] = `
|
|
116
|
-
<input
|
|
117
|
-
className=" container xmedium default border effect borderColor_default"
|
|
118
|
-
data-id="textBox"
|
|
119
|
-
maxLength="100"
|
|
120
|
-
onBlur={[Function]}
|
|
121
|
-
onChange={[Function]}
|
|
122
|
-
onFocus={[Function]}
|
|
123
|
-
placeholder="Text Area"
|
|
124
|
-
type="text"
|
|
125
|
-
value=""
|
|
126
|
-
/>
|
|
127
|
-
`;
|