@capillarytech/creatives-library 7.12.111 → 7.12.112
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/package.json +1 -1
- package/tests/integration/CreateTemplate/CreateTemplate.integration.test.js +18 -0
- package/v2Components/FormBuilder/index.js +18 -12
- package/v2Components/FormBuilder/tests/index.test.js +41 -0
- package/v2Components/FormBuilder/tests/mockData.js +120 -0
- package/v2Containers/MobilePush/initialSchema.js +5 -1
package/package.json
CHANGED
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This is not an integration test rather it's created to run the integration test script for now.
|
|
3
|
+
* The tests case and file name will be re-written as per the requirement in future.
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
describe('Create Templates ', () => {
|
|
7
|
+
it('Should pass the test case for truthy values', async () => {
|
|
8
|
+
expect(true).toBeTruthy();
|
|
9
|
+
});
|
|
10
|
+
|
|
11
|
+
it('Should pass the test case for falsy values', async () => {
|
|
12
|
+
expect(false).toBeFalsy();
|
|
13
|
+
});
|
|
14
|
+
|
|
15
|
+
it('Should pass the test case for falsy values', async () => {
|
|
16
|
+
expect({}).toEqual({});
|
|
17
|
+
});
|
|
18
|
+
});
|
|
@@ -11,7 +11,7 @@ import PropTypes from 'prop-types';
|
|
|
11
11
|
import React from 'react';
|
|
12
12
|
import _ from 'lodash';
|
|
13
13
|
import { Tabs, Table, Modal} from 'antd';
|
|
14
|
-
import { CapSpin, CapDrawer, CapButton, CapInput, CapPopover, CapImage, CapCheckbox, CapRadio, CapSelect, CapTable, CapRow, CapColumn, CapNotification, CapUploader, CapHeading, CapIcon} from '@capillarytech/cap-ui-library';
|
|
14
|
+
import { CapSpin, CapDrawer, CapButton, CapInput, CapPopover, CapImage, CapCheckbox, CapRadio, CapSelect, CapTable, CapRow, CapColumn, CapNotification, CapUploader, CapHeading, CapIcon, CapTooltip} from '@capillarytech/cap-ui-library';
|
|
15
15
|
import { injectIntl, intlShape, FormattedMessage } from 'react-intl';
|
|
16
16
|
import LabelHOC from '@capillarytech/cap-ui-library/assets/HOCs/ComponentWithLabelHOC';
|
|
17
17
|
import { CAP_SPACE_12, CAP_SPACE_08, FONT_COLOR_05, FONT_COLOR_04 } from '@capillarytech/cap-ui-library/styled/variables';
|
|
@@ -2800,22 +2800,28 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
|
|
|
2800
2800
|
break;
|
|
2801
2801
|
case "checkbox":
|
|
2802
2802
|
ifError = this.state.checkValidation && (isVersionEnable ? this.state.errorData[`${this.state.currentTab - 1}`][val.id] : this.state.errorData[val.id]);
|
|
2803
|
+
const { disabled , hoverText } = val || {};
|
|
2803
2804
|
if (styling === 'semantic') {
|
|
2804
2805
|
columns.push(
|
|
2805
2806
|
<CapColumn key="input" span={val.width} offset={val.offset}>
|
|
2806
|
-
<
|
|
2807
|
-
|
|
2808
|
-
|
|
2809
|
-
errorMessage={val.errorMessage && ifError ? val.errorMessage : ''}
|
|
2810
|
-
onChange={(e) => this.updateFormData(e.target.checked, val, val.submitAction)}
|
|
2811
|
-
checked={isVersionEnable ? this.state.formData[`${this.state.currentTab - 1}`][val.id] : this.state.formData[val.id]}
|
|
2812
|
-
defaultChecked={isVersionEnable ? this.state.formData[`${this.state.currentTab - 1}`][val.id] : this.state.formData[val.id]}
|
|
2813
|
-
style={val.style ? val.style : {}}
|
|
2814
|
-
disabled={val.disabled}
|
|
2815
|
-
inductiveText={val.inductiveText}
|
|
2807
|
+
<CapTooltip
|
|
2808
|
+
title={ disabled && hoverText ? hoverText : '' }
|
|
2809
|
+
placement="topLeft"
|
|
2816
2810
|
>
|
|
2811
|
+
<CapCheckbox
|
|
2812
|
+
key={val.id}
|
|
2813
|
+
className={`${ifError ? 'error' : ''}`}
|
|
2814
|
+
errorMessage={val.errorMessage && ifError ? val.errorMessage : ''}
|
|
2815
|
+
onChange={(e) => this.updateFormData(e.target.checked, val, val.submitAction)}
|
|
2816
|
+
checked={isVersionEnable ? this.state.formData[`${this.state.currentTab - 1}`][val.id] : this.state.formData[val.id]}
|
|
2817
|
+
defaultChecked={isVersionEnable ? this.state.formData[`${this.state.currentTab - 1}`][val.id] : this.state.formData[val.id]}
|
|
2818
|
+
style={val.style ? val.style : {}}
|
|
2819
|
+
disabled={val.disabled}
|
|
2820
|
+
inductiveText={val.inductiveText}
|
|
2821
|
+
>
|
|
2817
2822
|
{val.label}
|
|
2818
|
-
|
|
2823
|
+
</CapCheckbox>
|
|
2824
|
+
</CapTooltip>
|
|
2819
2825
|
</CapColumn>
|
|
2820
2826
|
);
|
|
2821
2827
|
}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { injectIntl } from 'react-intl';
|
|
3
|
+
import '@testing-library/jest-dom';
|
|
4
|
+
import FormBuilder from '../index';
|
|
5
|
+
import { Provider } from 'react-redux';
|
|
6
|
+
import configureStore from '../../../store';
|
|
7
|
+
import {
|
|
8
|
+
render,
|
|
9
|
+
screen,
|
|
10
|
+
fireEvent,
|
|
11
|
+
waitFor
|
|
12
|
+
} from '../../../utils/test-utils';
|
|
13
|
+
import { mockData } from './mockData';
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
const ComponentToRender = injectIntl(FormBuilder);
|
|
17
|
+
const renderComponent = props => {
|
|
18
|
+
const store = configureStore({}, null);
|
|
19
|
+
return render(
|
|
20
|
+
<Provider store={store}>
|
|
21
|
+
<ComponentToRender {...props} />
|
|
22
|
+
</Provider>,
|
|
23
|
+
);
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
describe("test for checkbox form builder",() => {
|
|
27
|
+
const onFormValidityChange=jest.fn();
|
|
28
|
+
const props={
|
|
29
|
+
...mockData,
|
|
30
|
+
onFormValidityChange
|
|
31
|
+
}
|
|
32
|
+
renderComponent(props);
|
|
33
|
+
it("add action button to notification disabled in ios", async () => {
|
|
34
|
+
const addNotifBtn=screen.getByLabelText("Add action buttons to notification")
|
|
35
|
+
expect(addNotifBtn).toBeDisabled();
|
|
36
|
+
fireEvent.mouseOver(addNotifBtn);
|
|
37
|
+
await waitFor(() => {
|
|
38
|
+
expect(screen.getByText("This section is being revamped. Till then it will remain disabled.")).toBeInTheDocument();
|
|
39
|
+
})
|
|
40
|
+
})
|
|
41
|
+
})
|
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
export const mockData = {
|
|
2
|
+
schema:{
|
|
3
|
+
"containers": [
|
|
4
|
+
{
|
|
5
|
+
"id": "pane",
|
|
6
|
+
"supportedEvents": [
|
|
7
|
+
"onTabChange"
|
|
8
|
+
],
|
|
9
|
+
"panes": [
|
|
10
|
+
{
|
|
11
|
+
"isSupported": true,
|
|
12
|
+
"sectionsHeaders": [
|
|
13
|
+
{
|
|
14
|
+
"type": "multicols",
|
|
15
|
+
"inputFields": [
|
|
16
|
+
{
|
|
17
|
+
"rowStyle": {
|
|
18
|
+
"display": "flex",
|
|
19
|
+
"flex": 1
|
|
20
|
+
},
|
|
21
|
+
"cols": [
|
|
22
|
+
{
|
|
23
|
+
"id": "tab-header",
|
|
24
|
+
"metaType": "label",
|
|
25
|
+
"value": "iOS",
|
|
26
|
+
"primitive": true,
|
|
27
|
+
"dynamicTab": false,
|
|
28
|
+
"type": "div",
|
|
29
|
+
"width": 5,
|
|
30
|
+
"offset": 0,
|
|
31
|
+
"onlyDisplay": true,
|
|
32
|
+
"colStyle": {
|
|
33
|
+
"flex": 1
|
|
34
|
+
},
|
|
35
|
+
"injectedEvents": {}
|
|
36
|
+
}
|
|
37
|
+
]
|
|
38
|
+
}
|
|
39
|
+
],
|
|
40
|
+
"actionFields": []
|
|
41
|
+
}
|
|
42
|
+
],
|
|
43
|
+
"sections": [
|
|
44
|
+
{
|
|
45
|
+
"type": "parent",
|
|
46
|
+
"width": 16,
|
|
47
|
+
"rowStyle": {
|
|
48
|
+
"height": "100%"
|
|
49
|
+
},
|
|
50
|
+
"childSections": [
|
|
51
|
+
{
|
|
52
|
+
"colStyle": {
|
|
53
|
+
"paddingTop": "16px",
|
|
54
|
+
"paddingLeft": "16px",
|
|
55
|
+
"borderRight": "1px solid #d9d9d9",
|
|
56
|
+
"height": "70vh",
|
|
57
|
+
"overflowY": "auto"
|
|
58
|
+
},
|
|
59
|
+
"width": 16,
|
|
60
|
+
"type": "parent",
|
|
61
|
+
"childSections": [
|
|
62
|
+
{
|
|
63
|
+
"type": "multicols",
|
|
64
|
+
"inputFields": [
|
|
65
|
+
{
|
|
66
|
+
"identifier": "add-sec-cta-ios",
|
|
67
|
+
"cols": [
|
|
68
|
+
{
|
|
69
|
+
"id": "add-sec-cta-ios",
|
|
70
|
+
"metaType": "label",
|
|
71
|
+
"dynamicTab": false,
|
|
72
|
+
"label": "Add action buttons to notification",
|
|
73
|
+
"styling": "semantic",
|
|
74
|
+
"type": "checkbox",
|
|
75
|
+
"customComponent": false,
|
|
76
|
+
"datatype": "boolean",
|
|
77
|
+
"fluid": true,
|
|
78
|
+
"onlyDisplay": false,
|
|
79
|
+
"offset": 0,
|
|
80
|
+
"colStyle": {
|
|
81
|
+
"flex": 1
|
|
82
|
+
},
|
|
83
|
+
"submitAction": "addSecondaryCtaIos",
|
|
84
|
+
"supportedEvents": [
|
|
85
|
+
"addSecondaryCtaIos"
|
|
86
|
+
],
|
|
87
|
+
"disabled": true,
|
|
88
|
+
"hoverText": "This section is being revamped. Till then it will remain disabled.",
|
|
89
|
+
"injectedEvents": {}
|
|
90
|
+
}
|
|
91
|
+
]
|
|
92
|
+
}
|
|
93
|
+
],
|
|
94
|
+
"actionFields": []
|
|
95
|
+
}
|
|
96
|
+
]
|
|
97
|
+
},
|
|
98
|
+
]
|
|
99
|
+
}
|
|
100
|
+
]
|
|
101
|
+
}
|
|
102
|
+
],
|
|
103
|
+
"type": "tabs",
|
|
104
|
+
"defaultPanes": 1,
|
|
105
|
+
"additionalPanes": 0,
|
|
106
|
+
"injectedEvents": {}
|
|
107
|
+
}
|
|
108
|
+
],
|
|
109
|
+
"channel": "MOBILEPUSH",
|
|
110
|
+
"module": "Campaigns",
|
|
111
|
+
"type": "LAYOUT"
|
|
112
|
+
},
|
|
113
|
+
location:{
|
|
114
|
+
"pathname": "/mobilepush/create/image",
|
|
115
|
+
"query": {
|
|
116
|
+
"type": false,
|
|
117
|
+
"module": "default"
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
}
|
|
@@ -782,6 +782,8 @@ export const response = {
|
|
|
782
782
|
supportedEvents: [
|
|
783
783
|
"addSecondaryCtaIos",
|
|
784
784
|
],
|
|
785
|
+
disabled: true,
|
|
786
|
+
hoverText: "This section is being revamped. Till then it will remain disabled.",
|
|
785
787
|
},
|
|
786
788
|
],
|
|
787
789
|
},
|
|
@@ -1688,8 +1690,10 @@ export const response = {
|
|
|
1688
1690
|
},
|
|
1689
1691
|
submitAction: "addSecondaryCtaIos",
|
|
1690
1692
|
supportedEvents: [
|
|
1691
|
-
"addSecondaryCtaIos"
|
|
1693
|
+
"addSecondaryCtaIos"
|
|
1692
1694
|
],
|
|
1695
|
+
disabled: true,
|
|
1696
|
+
hoverText: "This section is being revamped. Till then it will remain disabled.",
|
|
1693
1697
|
},
|
|
1694
1698
|
],
|
|
1695
1699
|
},
|