@ionic/core 7.5.6-dev.11700168085.18cb70d3 → 7.5.6-dev.11700492285.1581ed02
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/components/ion-datetime.js +2 -2
- package/dist/cjs/ion-datetime_3.cjs.entry.js +2 -2
- package/dist/collection/collection-manifest.json +4 -4
- package/dist/collection/components/accordion/test/accordion.spec.js +195 -0
- package/dist/collection/components/action-sheet/test/action-sheet-id.spec.js +32 -0
- package/dist/collection/components/action-sheet/test/basic/action-sheet.spec.js +18 -0
- package/dist/collection/components/alert/test/alert-id.spec.js +32 -0
- package/dist/collection/components/alert/test/alert.spec.js +37 -0
- package/dist/collection/components/back-button/test/back-button.spec.js +86 -0
- package/dist/collection/components/breadcrumb/test/aria.spec.js +22 -0
- package/dist/collection/components/breadcrumbs/test/breadcrumbs.spec.js +58 -0
- package/dist/collection/components/button/test/form-reference/button.spec.js +26 -0
- package/dist/collection/components/card/test/aria.spec.js +16 -0
- package/dist/collection/components/checkbox/test/checkbox.spec.js +20 -0
- package/dist/collection/components/datetime/datetime.js +2 -2
- package/dist/collection/components/datetime/test/a11y/datetime.spec.js +43 -0
- package/dist/collection/components/datetime/test/comparison.spec.js +43 -0
- package/dist/collection/components/datetime/test/data.spec.js +456 -0
- package/dist/collection/components/datetime/test/format.spec.js +124 -0
- package/dist/collection/components/datetime/test/helpers.spec.js +72 -0
- package/dist/collection/components/datetime/test/manipulation.spec.js +433 -0
- package/dist/collection/components/datetime/test/parse.spec.js +222 -0
- package/dist/collection/components/datetime/test/state.spec.js +114 -0
- package/dist/collection/components/infinite-scroll-content/test/infinite-scroll-content.spec.js +37 -0
- package/dist/collection/components/input/test/input.spec.js +85 -0
- package/dist/collection/components/input/test/item/input.spec.js +24 -0
- package/dist/collection/components/item/test/a11y/item.spec.js +48 -0
- package/dist/collection/components/loading/test/basic/loading.spec.js +16 -0
- package/dist/collection/components/loading/test/loading-id.spec.js +32 -0
- package/dist/collection/components/loading/test/loading.spec.js +37 -0
- package/dist/collection/components/modal/test/a11y/modal.spec.js +22 -0
- package/dist/collection/components/modal/test/basic/modal.spec.js +16 -0
- package/dist/collection/components/modal/test/can-dismiss/modal.spec.js +191 -0
- package/dist/collection/components/modal/test/modal-id.spec.js +32 -0
- package/dist/collection/components/nav/test/nav-controller.spec.js +749 -0
- package/dist/collection/components/picker/test/picker-id.spec.js +32 -0
- package/dist/collection/components/picker-column/test/picker-column-aria.spec.js +35 -0
- package/dist/collection/components/picker-column/test/picker-column-dynamic.spec.js +29 -0
- package/dist/collection/components/picker-column/test/picker-column.spec.js +17 -0
- package/dist/collection/components/popover/test/basic/popover.spec.js +16 -0
- package/dist/collection/components/popover/test/popover-id.spec.js +32 -0
- package/dist/collection/components/popover/test/util.spec.js +53 -0
- package/dist/collection/components/radio/test/radio.spec.js +46 -0
- package/dist/collection/components/range/test/label/range.spec.js +23 -0
- package/dist/collection/components/range/test/range.spec.js +205 -0
- package/dist/collection/components/refresher-content/test/refresher-content.spec.js +46 -0
- package/dist/collection/components/router/test/matching.spec.js +250 -0
- package/dist/collection/components/router/test/parser.spec.js +133 -0
- package/dist/collection/components/router/test/path.spec.js +218 -0
- package/dist/collection/components/router/test/router.spec.js +55 -0
- package/dist/collection/components/searchbar/test/searchbar.spec.js +15 -0
- package/dist/collection/components/segment/test/segment.spec.js +37 -0
- package/dist/collection/components/select/test/select.spec.js +59 -0
- package/dist/collection/components/textarea/test/textarea.spec.js +59 -0
- package/dist/collection/components/toast/test/toast-id.spec.js +32 -0
- package/dist/collection/components/toast/test/toast.spec.js +120 -0
- package/dist/collection/components/toggle/test/toggle.spec.js +55 -0
- package/dist/collection/global/test/config-controller.spec.js +77 -0
- package/dist/collection/utils/animation/test/animation.spec.js +431 -0
- package/dist/collection/utils/keyboard/test/keyboard-controller.spec.js +21 -0
- package/dist/collection/utils/keyboard/test/keyboard.spec.js +214 -0
- package/dist/collection/utils/sanitization/test/sanitization.spec.js +43 -0
- package/dist/collection/utils/test/aria.spec.js +79 -0
- package/dist/collection/utils/test/attributes.spec.js +53 -0
- package/dist/collection/utils/test/hardware-back-button.spec.js +53 -0
- package/dist/collection/utils/test/overlays/overlays.spec.js +102 -0
- package/dist/collection/utils/test/platform.spec.js +132 -0
- package/dist/collection/utils/test/ready.spec.js +39 -0
- package/dist/collection/utils/test/theme.spec.js +56 -0
- package/dist/docs.json +21 -21
- package/dist/esm/ion-datetime_3.entry.js +2 -2
- package/dist/esm-es5/ion-datetime_3.entry.js +1 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-40903d34.system.js +1 -1
- package/dist/ionic/p-ad61e508.entry.js +4 -0
- package/dist/ionic/p-d91e93ac.system.entry.js +4 -0
- package/hydrate/index.js +2 -2
- package/package.json +2 -1
- package/dist/ionic/p-b76c6241.system.entry.js +0 -4
- package/dist/ionic/p-b781d6b2.entry.js +0 -4
|
@@ -1000,7 +1000,7 @@ const Datetime = /*@__PURE__*/ proxyCustomElement(class Datetime extends HTMLEle
|
|
|
1000
1000
|
* so we need to re-init behavior with the new elements.
|
|
1001
1001
|
*/
|
|
1002
1002
|
componentDidRender() {
|
|
1003
|
-
const { presentation, prevPresentation, calendarBodyRef, minParts, preferWheel,
|
|
1003
|
+
const { presentation, prevPresentation, calendarBodyRef, minParts, preferWheel, forceRenderDate } = this;
|
|
1004
1004
|
/**
|
|
1005
1005
|
* TODO(FW-2165)
|
|
1006
1006
|
* Remove this when https://bugs.webkit.org/show_bug.cgi?id=235960 is fixed.
|
|
@@ -1030,7 +1030,7 @@ const Datetime = /*@__PURE__*/ proxyCustomElement(class Datetime extends HTMLEle
|
|
|
1030
1030
|
* the scroll callback in this file does not fire,
|
|
1031
1031
|
* and the resolveForceDateScrolling promise never resolves.
|
|
1032
1032
|
*/
|
|
1033
|
-
if (workingMonth &&
|
|
1033
|
+
if (workingMonth && forceRenderDate === undefined) {
|
|
1034
1034
|
calendarBodyRef.scrollLeft = workingMonth.clientWidth * (isRTL(this.el) ? -1 : 1);
|
|
1035
1035
|
}
|
|
1036
1036
|
}
|
|
@@ -999,7 +999,7 @@ const Datetime = class {
|
|
|
999
999
|
* so we need to re-init behavior with the new elements.
|
|
1000
1000
|
*/
|
|
1001
1001
|
componentDidRender() {
|
|
1002
|
-
const { presentation, prevPresentation, calendarBodyRef, minParts, preferWheel,
|
|
1002
|
+
const { presentation, prevPresentation, calendarBodyRef, minParts, preferWheel, forceRenderDate } = this;
|
|
1003
1003
|
/**
|
|
1004
1004
|
* TODO(FW-2165)
|
|
1005
1005
|
* Remove this when https://bugs.webkit.org/show_bug.cgi?id=235960 is fixed.
|
|
@@ -1029,7 +1029,7 @@ const Datetime = class {
|
|
|
1029
1029
|
* the scroll callback in this file does not fire,
|
|
1030
1030
|
* and the resolveForceDateScrolling promise never resolves.
|
|
1031
1031
|
*/
|
|
1032
|
-
if (workingMonth &&
|
|
1032
|
+
if (workingMonth && forceRenderDate === undefined) {
|
|
1033
1033
|
calendarBodyRef.scrollLeft = workingMonth.clientWidth * (dir.isRTL(this.el) ? -1 : 1);
|
|
1034
1034
|
}
|
|
1035
1035
|
}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
"entries": [
|
|
3
3
|
"components/accordion/accordion.js",
|
|
4
4
|
"components/accordion-group/accordion-group.js",
|
|
5
|
+
"components/item/item.js",
|
|
5
6
|
"components/action-sheet/action-sheet.js",
|
|
6
7
|
"components/alert/alert.js",
|
|
7
8
|
"components/app/app.js",
|
|
@@ -34,14 +35,15 @@
|
|
|
34
35
|
"components/infinite-scroll/infinite-scroll.js",
|
|
35
36
|
"components/infinite-scroll-content/infinite-scroll-content.js",
|
|
36
37
|
"components/input/input.js",
|
|
37
|
-
"components/
|
|
38
|
+
"components/list/list.js",
|
|
39
|
+
"components/radio-group/radio-group.js",
|
|
40
|
+
"components/radio/radio.js",
|
|
38
41
|
"components/item-divider/item-divider.js",
|
|
39
42
|
"components/item-group/item-group.js",
|
|
40
43
|
"components/item-option/item-option.js",
|
|
41
44
|
"components/item-options/item-options.js",
|
|
42
45
|
"components/item-sliding/item-sliding.js",
|
|
43
46
|
"components/label/label.js",
|
|
44
|
-
"components/list/list.js",
|
|
45
47
|
"components/list-header/list-header.js",
|
|
46
48
|
"components/loading/loading.js",
|
|
47
49
|
"components/menu/menu.js",
|
|
@@ -57,8 +59,6 @@
|
|
|
57
59
|
"components/picker-internal/picker-internal.js",
|
|
58
60
|
"components/popover/popover.js",
|
|
59
61
|
"components/progress-bar/progress-bar.js",
|
|
60
|
-
"components/radio/radio.js",
|
|
61
|
-
"components/radio-group/radio-group.js",
|
|
62
62
|
"components/range/range.js",
|
|
63
63
|
"components/refresher/refresher.js",
|
|
64
64
|
"components/refresher-content/refresher-content.js",
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { AccordionGroup } from "../../accordion-group/accordion-group";
|
|
6
|
+
import { Item } from "../../item/item";
|
|
7
|
+
import { Accordion } from "../accordion";
|
|
8
|
+
it('should open correct accordions when accordion group value is set', async () => {
|
|
9
|
+
const page = await newSpecPage({
|
|
10
|
+
components: [Item, Accordion, AccordionGroup],
|
|
11
|
+
html: `
|
|
12
|
+
<ion-accordion-group animated="false">
|
|
13
|
+
<ion-accordion value="first">
|
|
14
|
+
<ion-item slot="header">Label</ion-item>
|
|
15
|
+
<div slot="content">Content</div>
|
|
16
|
+
</ion-accordion>
|
|
17
|
+
<ion-accordion value="second">
|
|
18
|
+
<ion-item slot="header">Label</ion-item>
|
|
19
|
+
<div slot="content">Content</div>
|
|
20
|
+
</ion-accordion>
|
|
21
|
+
<ion-accordion value="third">
|
|
22
|
+
<ion-item slot="header">Label</ion-item>
|
|
23
|
+
<div slot="content">Content</div>
|
|
24
|
+
</ion-accordion>
|
|
25
|
+
</ion-accordion-group>
|
|
26
|
+
`,
|
|
27
|
+
});
|
|
28
|
+
const accordionGroup = page.body.querySelector('ion-accordion-group');
|
|
29
|
+
const accordions = accordionGroup.querySelectorAll('ion-accordion');
|
|
30
|
+
accordions.forEach((accordion) => {
|
|
31
|
+
expect(accordion.classList.contains('accordion-collapsed')).toEqual(true);
|
|
32
|
+
});
|
|
33
|
+
accordionGroup.value = 'second';
|
|
34
|
+
await page.waitForChanges();
|
|
35
|
+
expect(accordions[0].classList.contains('accordion-collapsed')).toEqual(true);
|
|
36
|
+
expect(accordions[1].classList.contains('accordion-collapsed')).toEqual(false);
|
|
37
|
+
expect(accordions[2].classList.contains('accordion-collapsed')).toEqual(true);
|
|
38
|
+
});
|
|
39
|
+
it('should open correct accordions when accordion value is set', async () => {
|
|
40
|
+
const page = await newSpecPage({
|
|
41
|
+
components: [Item, Accordion, AccordionGroup],
|
|
42
|
+
html: `
|
|
43
|
+
<ion-accordion-group animated="false" value="first">
|
|
44
|
+
<ion-accordion>
|
|
45
|
+
<ion-item slot="header">Label</ion-item>
|
|
46
|
+
<div slot="content">Content</div>
|
|
47
|
+
</ion-accordion>
|
|
48
|
+
<ion-accordion value="second">
|
|
49
|
+
<ion-item slot="header">Label</ion-item>
|
|
50
|
+
<div slot="content">Content</div>
|
|
51
|
+
</ion-accordion>
|
|
52
|
+
<ion-accordion value="third">
|
|
53
|
+
<ion-item slot="header">Label</ion-item>
|
|
54
|
+
<div slot="content">Content</div>
|
|
55
|
+
</ion-accordion>
|
|
56
|
+
</ion-accordion-group>
|
|
57
|
+
`,
|
|
58
|
+
});
|
|
59
|
+
const accordionGroup = page.body.querySelector('ion-accordion-group');
|
|
60
|
+
const accordions = accordionGroup.querySelectorAll('ion-accordion');
|
|
61
|
+
accordions.forEach((accordion) => {
|
|
62
|
+
expect(accordion.classList.contains('accordion-collapsed')).toEqual(true);
|
|
63
|
+
});
|
|
64
|
+
accordions[0].value = 'first';
|
|
65
|
+
await page.waitForChanges();
|
|
66
|
+
expect(accordions[0].classList.contains('accordion-collapsed')).toEqual(false);
|
|
67
|
+
expect(accordions[1].classList.contains('accordion-collapsed')).toEqual(true);
|
|
68
|
+
expect(accordions[2].classList.contains('accordion-collapsed')).toEqual(true);
|
|
69
|
+
});
|
|
70
|
+
it('should open more than one accordion when multiple="true"', async () => {
|
|
71
|
+
const page = await newSpecPage({
|
|
72
|
+
components: [Item, Accordion, AccordionGroup],
|
|
73
|
+
html: `
|
|
74
|
+
<ion-accordion-group multiple="true" animated="false">
|
|
75
|
+
<ion-accordion value="first">
|
|
76
|
+
<ion-item slot="header">Label</ion-item>
|
|
77
|
+
<div slot="content">Content</div>
|
|
78
|
+
</ion-accordion>
|
|
79
|
+
<ion-accordion value="second">
|
|
80
|
+
<ion-item slot="header">Label</ion-item>
|
|
81
|
+
<div slot="content">Content</div>
|
|
82
|
+
</ion-accordion>
|
|
83
|
+
<ion-accordion value="third">
|
|
84
|
+
<ion-item slot="header">Label</ion-item>
|
|
85
|
+
<div slot="content">Content</div>
|
|
86
|
+
</ion-accordion>
|
|
87
|
+
</ion-accordion-group>
|
|
88
|
+
`,
|
|
89
|
+
});
|
|
90
|
+
const accordionGroup = page.body.querySelector('ion-accordion-group');
|
|
91
|
+
const accordions = accordionGroup.querySelectorAll('ion-accordion');
|
|
92
|
+
accordions.forEach((accordion) => {
|
|
93
|
+
expect(accordion.classList.contains('accordion-collapsed')).toEqual(true);
|
|
94
|
+
});
|
|
95
|
+
accordionGroup.value = ['first', 'second'];
|
|
96
|
+
await page.waitForChanges();
|
|
97
|
+
expect(accordions[0].classList.contains('accordion-collapsed')).toEqual(false);
|
|
98
|
+
expect(accordions[1].classList.contains('accordion-collapsed')).toEqual(false);
|
|
99
|
+
expect(accordions[2].classList.contains('accordion-collapsed')).toEqual(true);
|
|
100
|
+
});
|
|
101
|
+
it('should render with accordion open', async () => {
|
|
102
|
+
const page = await newSpecPage({
|
|
103
|
+
components: [Item, Accordion, AccordionGroup],
|
|
104
|
+
html: `
|
|
105
|
+
<ion-accordion-group value="first" animated="false">
|
|
106
|
+
<ion-accordion value="first">
|
|
107
|
+
<ion-item slot="header">Label</ion-item>
|
|
108
|
+
<div slot="content">Content</div>
|
|
109
|
+
</ion-accordion>
|
|
110
|
+
<ion-accordion value="second">
|
|
111
|
+
<ion-item slot="header">Label</ion-item>
|
|
112
|
+
<div slot="content">Content</div>
|
|
113
|
+
</ion-accordion>
|
|
114
|
+
<ion-accordion value="third">
|
|
115
|
+
<ion-item slot="header">Label</ion-item>
|
|
116
|
+
<div slot="content">Content</div>
|
|
117
|
+
</ion-accordion>
|
|
118
|
+
</ion-accordion-group>
|
|
119
|
+
`,
|
|
120
|
+
});
|
|
121
|
+
const accordionGroup = page.body.querySelector('ion-accordion-group');
|
|
122
|
+
const accordions = accordionGroup.querySelectorAll('ion-accordion');
|
|
123
|
+
expect(accordions[0].classList.contains('accordion-collapsed')).toEqual(false);
|
|
124
|
+
expect(accordions[1].classList.contains('accordion-collapsed')).toEqual(true);
|
|
125
|
+
expect(accordions[2].classList.contains('accordion-collapsed')).toEqual(true);
|
|
126
|
+
});
|
|
127
|
+
it('should accept a string when multiple="true"', async () => {
|
|
128
|
+
const page = await newSpecPage({
|
|
129
|
+
components: [Item, Accordion, AccordionGroup],
|
|
130
|
+
html: `
|
|
131
|
+
<ion-accordion-group multiple="true" value="first" animated="false">
|
|
132
|
+
<ion-accordion value="first">
|
|
133
|
+
<ion-item slot="header">Label</ion-item>
|
|
134
|
+
<div slot="content">Content</div>
|
|
135
|
+
</ion-accordion>
|
|
136
|
+
<ion-accordion value="second">
|
|
137
|
+
<ion-item slot="header">Label</ion-item>
|
|
138
|
+
<div slot="content">Content</div>
|
|
139
|
+
</ion-accordion>
|
|
140
|
+
<ion-accordion value="third">
|
|
141
|
+
<ion-item slot="header">Label</ion-item>
|
|
142
|
+
<div slot="content">Content</div>
|
|
143
|
+
</ion-accordion>
|
|
144
|
+
</ion-accordion-group>
|
|
145
|
+
`,
|
|
146
|
+
});
|
|
147
|
+
const accordionGroup = page.body.querySelector('ion-accordion-group');
|
|
148
|
+
const accordions = accordionGroup.querySelectorAll('ion-accordion');
|
|
149
|
+
expect(accordions[0].classList.contains('accordion-collapsed')).toEqual(false);
|
|
150
|
+
expect(accordions[1].classList.contains('accordion-collapsed')).toEqual(true);
|
|
151
|
+
expect(accordions[2].classList.contains('accordion-collapsed')).toEqual(true);
|
|
152
|
+
});
|
|
153
|
+
it('should set default values if not provided', async () => {
|
|
154
|
+
const page = await newSpecPage({
|
|
155
|
+
components: [Item, Accordion, AccordionGroup],
|
|
156
|
+
html: `
|
|
157
|
+
<ion-accordion-group animated="false">
|
|
158
|
+
<ion-accordion>
|
|
159
|
+
<ion-item slot="header">Label</ion-item>
|
|
160
|
+
<div slot="content">Content</div>
|
|
161
|
+
</ion-accordion>
|
|
162
|
+
</ion-accordion-group>
|
|
163
|
+
`,
|
|
164
|
+
});
|
|
165
|
+
const accordionGroup = page.body.querySelector('ion-accordion-group');
|
|
166
|
+
const accordion = accordionGroup.querySelector('ion-accordion');
|
|
167
|
+
/**
|
|
168
|
+
* ID is determined via an auto incrementing counter
|
|
169
|
+
* so do not hard code ion-accordion-0 as it might
|
|
170
|
+
* change depending on how many accordions
|
|
171
|
+
* are used in these tests.
|
|
172
|
+
*/
|
|
173
|
+
expect(accordion.value).toContain('ion-accordion-');
|
|
174
|
+
accordionGroup.value = accordion.value;
|
|
175
|
+
await page.waitForChanges();
|
|
176
|
+
expect(accordion.classList.contains('accordion-collapsed')).toEqual(false);
|
|
177
|
+
});
|
|
178
|
+
// Verifies fix for https://github.com/ionic-team/ionic-framework/issues/27047
|
|
179
|
+
it('should not have animated class when animated="false"', async () => {
|
|
180
|
+
const page = await newSpecPage({
|
|
181
|
+
components: [Item, Accordion, AccordionGroup],
|
|
182
|
+
html: `
|
|
183
|
+
<ion-accordion-group animated="false">
|
|
184
|
+
<ion-accordion>
|
|
185
|
+
<ion-item slot="header">Label</ion-item>
|
|
186
|
+
<div slot="content">Content</div>
|
|
187
|
+
</ion-accordion>
|
|
188
|
+
</ion-accordion-group>
|
|
189
|
+
`,
|
|
190
|
+
});
|
|
191
|
+
const accordionGroup = page.body.querySelector('ion-accordion-group');
|
|
192
|
+
const accordion = accordionGroup.querySelector('ion-accordion');
|
|
193
|
+
expect(accordionGroup.animated).toEqual(false);
|
|
194
|
+
expect(accordion.classList.contains('accordion-animated')).toEqual(false);
|
|
195
|
+
});
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { ActionSheet } from "../action-sheet";
|
|
6
|
+
it('action sheet should be assigned an incrementing id', async () => {
|
|
7
|
+
const page = await newSpecPage({
|
|
8
|
+
components: [ActionSheet],
|
|
9
|
+
html: `<ion-action-sheet is-open="true"></ion-action-sheet>`,
|
|
10
|
+
});
|
|
11
|
+
let actionSheet;
|
|
12
|
+
actionSheet = page.body.querySelector('ion-action-sheet');
|
|
13
|
+
expect(actionSheet).not.toBe(null);
|
|
14
|
+
expect(actionSheet.getAttribute('id')).toBe('ion-overlay-1');
|
|
15
|
+
// Remove the action sheet from the DOM
|
|
16
|
+
actionSheet.remove();
|
|
17
|
+
await page.waitForChanges();
|
|
18
|
+
// Create a new action sheet to verify the id is incremented
|
|
19
|
+
actionSheet = document.createElement('ion-action-sheet');
|
|
20
|
+
actionSheet.isOpen = true;
|
|
21
|
+
page.body.appendChild(actionSheet);
|
|
22
|
+
await page.waitForChanges();
|
|
23
|
+
actionSheet = page.body.querySelector('ion-action-sheet');
|
|
24
|
+
expect(actionSheet.getAttribute('id')).toBe('ion-overlay-2');
|
|
25
|
+
// Presenting the same action sheet again should reuse the existing id
|
|
26
|
+
actionSheet.isOpen = false;
|
|
27
|
+
await page.waitForChanges();
|
|
28
|
+
actionSheet.isOpen = true;
|
|
29
|
+
await page.waitForChanges();
|
|
30
|
+
actionSheet = page.body.querySelector('ion-action-sheet');
|
|
31
|
+
expect(actionSheet.getAttribute('id')).toBe('ion-overlay-2');
|
|
32
|
+
});
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { h } from "@stencil/core";
|
|
5
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
6
|
+
import { ActionSheet } from "../../action-sheet";
|
|
7
|
+
describe('action sheet: htmlAttributes inheritance', () => {
|
|
8
|
+
it('should correctly inherit attributes on host', async () => {
|
|
9
|
+
const page = await newSpecPage({
|
|
10
|
+
components: [ActionSheet],
|
|
11
|
+
template: () => (h("ion-action-sheet", { htmlAttributes: {
|
|
12
|
+
'data-testid': 'basic-action-sheet',
|
|
13
|
+
}, overlayIndex: 1 })),
|
|
14
|
+
});
|
|
15
|
+
const actionSheet = page.body.querySelector('ion-action-sheet');
|
|
16
|
+
await expect(actionSheet.getAttribute('data-testid')).toBe('basic-action-sheet');
|
|
17
|
+
});
|
|
18
|
+
});
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { Alert } from "../alert";
|
|
6
|
+
it('alert should be assigned an incrementing id', async () => {
|
|
7
|
+
const page = await newSpecPage({
|
|
8
|
+
components: [Alert],
|
|
9
|
+
html: `<ion-alert is-open="true"></ion-alert>`,
|
|
10
|
+
});
|
|
11
|
+
let alert;
|
|
12
|
+
alert = page.body.querySelector('ion-alert');
|
|
13
|
+
expect(alert).not.toBe(null);
|
|
14
|
+
expect(alert.getAttribute('id')).toBe('ion-overlay-1');
|
|
15
|
+
// Remove the alert from the DOM
|
|
16
|
+
alert.remove();
|
|
17
|
+
await page.waitForChanges();
|
|
18
|
+
// Create a new alert to verify the id is incremented
|
|
19
|
+
alert = document.createElement('ion-alert');
|
|
20
|
+
alert.isOpen = true;
|
|
21
|
+
page.body.appendChild(alert);
|
|
22
|
+
await page.waitForChanges();
|
|
23
|
+
alert = page.body.querySelector('ion-alert');
|
|
24
|
+
expect(alert.getAttribute('id')).toBe('ion-overlay-2');
|
|
25
|
+
// Presenting the same alert again should reuse the existing id
|
|
26
|
+
alert.isOpen = false;
|
|
27
|
+
await page.waitForChanges();
|
|
28
|
+
alert.isOpen = true;
|
|
29
|
+
await page.waitForChanges();
|
|
30
|
+
alert = page.body.querySelector('ion-alert');
|
|
31
|
+
expect(alert.getAttribute('id')).toBe('ion-overlay-2');
|
|
32
|
+
});
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { config } from "../../../global/config";
|
|
6
|
+
import { Alert } from "../alert";
|
|
7
|
+
describe('alert: custom html', () => {
|
|
8
|
+
it('should not allow for custom html by default', async () => {
|
|
9
|
+
const page = await newSpecPage({
|
|
10
|
+
components: [Alert],
|
|
11
|
+
html: `<ion-alert message="<button class='custom-html'>Custom Text</button>"></ion-alert>`,
|
|
12
|
+
});
|
|
13
|
+
const content = page.body.querySelector('.alert-message');
|
|
14
|
+
expect(content.textContent).toContain('Custom Text');
|
|
15
|
+
expect(content.querySelector('button.custom-html')).toBe(null);
|
|
16
|
+
});
|
|
17
|
+
it('should allow for custom html', async () => {
|
|
18
|
+
config.reset({ innerHTMLTemplatesEnabled: true });
|
|
19
|
+
const page = await newSpecPage({
|
|
20
|
+
components: [Alert],
|
|
21
|
+
html: `<ion-alert message="<button class='custom-html'>Custom Text</button>"></ion-alert>`,
|
|
22
|
+
});
|
|
23
|
+
const content = page.body.querySelector('.alert-message');
|
|
24
|
+
expect(content.textContent).toContain('Custom Text');
|
|
25
|
+
expect(content.querySelector('button.custom-html')).not.toBe(null);
|
|
26
|
+
});
|
|
27
|
+
it('should not allow for custom html', async () => {
|
|
28
|
+
config.reset({ innerHTMLTemplatesEnabled: false });
|
|
29
|
+
const page = await newSpecPage({
|
|
30
|
+
components: [Alert],
|
|
31
|
+
html: `<ion-alert message="<button class='custom-html'>Custom Text</button>"></ion-alert>`,
|
|
32
|
+
});
|
|
33
|
+
const content = page.body.querySelector('.alert-message');
|
|
34
|
+
expect(content.textContent).toContain('Custom Text');
|
|
35
|
+
expect(content.querySelector('button.custom-html')).toBe(null);
|
|
36
|
+
});
|
|
37
|
+
});
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { setMode } from "@stencil/core";
|
|
5
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
6
|
+
import { arrowBackSharp, chevronBack } from "ionicons/icons";
|
|
7
|
+
import { config } from "../../../global/config";
|
|
8
|
+
import { BackButton } from "../back-button";
|
|
9
|
+
describe('back button', () => {
|
|
10
|
+
beforeEach(() => {
|
|
11
|
+
config.reset({});
|
|
12
|
+
});
|
|
13
|
+
const newBackButton = async (mode = 'md') => {
|
|
14
|
+
setMode(() => mode);
|
|
15
|
+
const { rootInstance } = await newSpecPage({
|
|
16
|
+
components: [BackButton],
|
|
17
|
+
html: `<ion-back-button></ion-back-button>`,
|
|
18
|
+
});
|
|
19
|
+
return rootInstance;
|
|
20
|
+
};
|
|
21
|
+
describe('backButtonIcon', () => {
|
|
22
|
+
it('set custom icon on the instance, override config', async () => {
|
|
23
|
+
const bb = await newBackButton();
|
|
24
|
+
bb.icon = 'custom-icon-instance';
|
|
25
|
+
config.reset({
|
|
26
|
+
backButtonIcon: 'custom-icon-config',
|
|
27
|
+
});
|
|
28
|
+
expect(bb.backButtonIcon).toBe('custom-icon-instance');
|
|
29
|
+
});
|
|
30
|
+
it('set custom icon in the config', async () => {
|
|
31
|
+
const bb = await newBackButton();
|
|
32
|
+
config.reset({
|
|
33
|
+
backButtonIcon: 'custom-icon-config',
|
|
34
|
+
});
|
|
35
|
+
expect(bb.backButtonIcon).toBe('custom-icon-config');
|
|
36
|
+
});
|
|
37
|
+
it('set custom icon on the instance', async () => {
|
|
38
|
+
const bb = await newBackButton();
|
|
39
|
+
bb.icon = 'custom-icon-instance';
|
|
40
|
+
expect(bb.backButtonIcon).toBe('custom-icon-instance');
|
|
41
|
+
});
|
|
42
|
+
it('default icon for ios mode', async () => {
|
|
43
|
+
const bb = await newBackButton('ios');
|
|
44
|
+
expect(bb.backButtonIcon).toBe(chevronBack);
|
|
45
|
+
});
|
|
46
|
+
it('default icon', async () => {
|
|
47
|
+
const bb = await newBackButton();
|
|
48
|
+
expect(bb.backButtonIcon).toBe(arrowBackSharp);
|
|
49
|
+
});
|
|
50
|
+
});
|
|
51
|
+
describe('backButtonText', () => {
|
|
52
|
+
it('default text for ios mode', async () => {
|
|
53
|
+
const bb = await newBackButton('ios');
|
|
54
|
+
expect(bb.backButtonText).toBe('Back');
|
|
55
|
+
});
|
|
56
|
+
it('default text', async () => {
|
|
57
|
+
const bb = await newBackButton();
|
|
58
|
+
expect(bb.backButtonText).toBe(null);
|
|
59
|
+
});
|
|
60
|
+
});
|
|
61
|
+
describe('backButtonDefaultHref', () => {
|
|
62
|
+
it('set custom defaultHref in the config', async () => {
|
|
63
|
+
config.reset({
|
|
64
|
+
backButtonDefaultHref: 'custom-default-href-config',
|
|
65
|
+
});
|
|
66
|
+
const bb = await newBackButton();
|
|
67
|
+
expect(bb.defaultHref).toBe('custom-default-href-config');
|
|
68
|
+
});
|
|
69
|
+
it('set custom defaultHref on the instance', async () => {
|
|
70
|
+
const bb = await newBackButton();
|
|
71
|
+
bb.defaultHref = 'custom-default-href';
|
|
72
|
+
expect(bb.defaultHref).toBe('custom-default-href');
|
|
73
|
+
});
|
|
74
|
+
it('set custom defaultHref on the instance, override config', async () => {
|
|
75
|
+
const bb = await newBackButton();
|
|
76
|
+
bb.defaultHref = 'custom-default-href';
|
|
77
|
+
config.reset({
|
|
78
|
+
backButtonDefaultHref: 'custom-default-href-config',
|
|
79
|
+
});
|
|
80
|
+
expect(bb.defaultHref).toBe('custom-default-href');
|
|
81
|
+
const bb2 = await newBackButton();
|
|
82
|
+
bb2.defaultHref = 'custom-default-href-second';
|
|
83
|
+
expect(bb2.defaultHref).toBe('custom-default-href-second');
|
|
84
|
+
});
|
|
85
|
+
});
|
|
86
|
+
});
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { Breadcrumb } from "../breadcrumb";
|
|
6
|
+
describe('breadcrumb: collapsed indicator', () => {
|
|
7
|
+
it('should have an aria-label', async () => {
|
|
8
|
+
const page = await newSpecPage({
|
|
9
|
+
components: [Breadcrumb],
|
|
10
|
+
/**
|
|
11
|
+
* `showCollapsedIndicator` is an internal API used by `ion-breadcrumbs`.
|
|
12
|
+
* This test makes use of it to render the collapsed indicator.
|
|
13
|
+
*/
|
|
14
|
+
html: `<ion-breadcrumb show-collapsed-indicator="true">Text</ion-breadcrumb>`,
|
|
15
|
+
});
|
|
16
|
+
const collapsedIndicator = page.body
|
|
17
|
+
.querySelector('ion-breadcrumb')
|
|
18
|
+
.shadowRoot.querySelector('.breadcrumbs-collapsed-indicator');
|
|
19
|
+
const ariaLabel = collapsedIndicator.getAttribute('aria-label');
|
|
20
|
+
expect(ariaLabel).toEqual('Show more breadcrumbs');
|
|
21
|
+
});
|
|
22
|
+
});
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { Breadcrumb } from "../../breadcrumb/breadcrumb";
|
|
6
|
+
import { Breadcrumbs } from "../breadcrumbs";
|
|
7
|
+
it('should correctly provide the collapsed breadcrumbs in the event payload', async () => {
|
|
8
|
+
const page = await newSpecPage({
|
|
9
|
+
components: [Breadcrumbs, Breadcrumb],
|
|
10
|
+
html: `
|
|
11
|
+
<ion-breadcrumbs max-items="2" items-before-collapse="1" items-after-collapse="1">
|
|
12
|
+
<ion-breadcrumb>First</ion-breadcrumb>
|
|
13
|
+
<ion-breadcrumb>Second</ion-breadcrumb>
|
|
14
|
+
<ion-breadcrumb>Third</ion-breadcrumb>
|
|
15
|
+
<ion-breadcrumb>Fourth</ion-breadcrumb>
|
|
16
|
+
<ion-breadcrumb>Fifth</ion-breadcrumb>
|
|
17
|
+
</ion-breadcrumbs>
|
|
18
|
+
`,
|
|
19
|
+
});
|
|
20
|
+
const onCollapsedClick = jest.fn((ev) => ev);
|
|
21
|
+
const breadcrumbs = page.body.querySelector('ion-breadcrumbs');
|
|
22
|
+
const breadcrumb = page.body.querySelectorAll('ion-breadcrumb');
|
|
23
|
+
breadcrumbs.addEventListener('ionCollapsedClick', onCollapsedClick);
|
|
24
|
+
const event = new CustomEvent('collapsedClick');
|
|
25
|
+
breadcrumbs.dispatchEvent(event);
|
|
26
|
+
expect(onCollapsedClick).toHaveBeenCalledTimes(1);
|
|
27
|
+
const collapsedBreadcrumbs = onCollapsedClick.mock.calls[0][0].detail.collapsedBreadcrumbs;
|
|
28
|
+
expect(collapsedBreadcrumbs.length).toEqual(3);
|
|
29
|
+
expect(collapsedBreadcrumbs[0]).toBe(breadcrumb[1]);
|
|
30
|
+
expect(collapsedBreadcrumbs[1]).toBe(breadcrumb[2]);
|
|
31
|
+
expect(collapsedBreadcrumbs[2]).toBe(breadcrumb[3]);
|
|
32
|
+
});
|
|
33
|
+
it('should exclude the separator from narrators', async () => {
|
|
34
|
+
const page = await newSpecPage({
|
|
35
|
+
components: [Breadcrumbs, Breadcrumb],
|
|
36
|
+
html: `
|
|
37
|
+
<ion-breadcrumbs>
|
|
38
|
+
<ion-breadcrumb>First</ion-breadcrumb>
|
|
39
|
+
<ion-breadcrumb>Second</ion-breadcrumb>
|
|
40
|
+
</ion-breadcrumbs>
|
|
41
|
+
`,
|
|
42
|
+
});
|
|
43
|
+
const firstBreadcrumb = page.body.querySelector('ion-breadcrumb:first-of-type');
|
|
44
|
+
const separator = firstBreadcrumb.shadowRoot.querySelector('[part="separator"]');
|
|
45
|
+
expect(separator.getAttribute('aria-hidden')).toBe('true');
|
|
46
|
+
});
|
|
47
|
+
it('should have color attribute', async () => {
|
|
48
|
+
const page = await newSpecPage({
|
|
49
|
+
components: [Breadcrumb, Breadcrumbs],
|
|
50
|
+
html: `
|
|
51
|
+
<ion-breadcrumbs color="danger">
|
|
52
|
+
<ion-breadcrumb>First</ion-breadcrumb>
|
|
53
|
+
</ion-breadcrumbs>
|
|
54
|
+
`,
|
|
55
|
+
});
|
|
56
|
+
const breadcrumbs = page.body.querySelector('ion-breadcrumbs');
|
|
57
|
+
expect(breadcrumbs.hasAttribute('color')).toBe(true);
|
|
58
|
+
});
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { Button } from "../../button";
|
|
6
|
+
describe('Button: Hidden Form Button', () => {
|
|
7
|
+
it('should not add multiple buttons to the form', async () => {
|
|
8
|
+
const page = await newSpecPage({
|
|
9
|
+
components: [Button],
|
|
10
|
+
html: `
|
|
11
|
+
<form id="my-form"></form>
|
|
12
|
+
<ion-button form="my-form" type="submit">Submit</ion-button>
|
|
13
|
+
`,
|
|
14
|
+
});
|
|
15
|
+
const getButtons = () => {
|
|
16
|
+
return page.body.querySelectorAll('form button');
|
|
17
|
+
};
|
|
18
|
+
const button = page.body.querySelector('ion-button');
|
|
19
|
+
await page.waitForChanges();
|
|
20
|
+
expect(getButtons().length).toEqual(1);
|
|
21
|
+
// Re-render the component
|
|
22
|
+
button.color = 'danger';
|
|
23
|
+
await page.waitForChanges();
|
|
24
|
+
expect(getButtons().length).toEqual(1);
|
|
25
|
+
});
|
|
26
|
+
});
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { Card } from "../card";
|
|
6
|
+
describe('card: button', () => {
|
|
7
|
+
it('should reflect aria-label to button', async () => {
|
|
8
|
+
const page = await newSpecPage({
|
|
9
|
+
components: [Card],
|
|
10
|
+
html: `<ion-card button="true" aria-label="Test"></ion-card>`,
|
|
11
|
+
});
|
|
12
|
+
const button = page.body.querySelector('ion-card').shadowRoot.querySelector('button');
|
|
13
|
+
const ariaLabel = button.getAttribute('aria-label');
|
|
14
|
+
expect(ariaLabel).toEqual('Test');
|
|
15
|
+
});
|
|
16
|
+
});
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
|
+
*/
|
|
4
|
+
import { newSpecPage } from "@stencil/core/testing";
|
|
5
|
+
import { Checkbox } from "../checkbox";
|
|
6
|
+
describe('ion-checkbox: disabled', () => {
|
|
7
|
+
it('clicking disabled checkbox should not toggle checked state', async () => {
|
|
8
|
+
const page = await newSpecPage({
|
|
9
|
+
components: [Checkbox],
|
|
10
|
+
html: `
|
|
11
|
+
<ion-checkbox disabled="true">Checkbox</ion-checkbox>
|
|
12
|
+
`,
|
|
13
|
+
});
|
|
14
|
+
const checkbox = page.body.querySelector('ion-checkbox');
|
|
15
|
+
expect(checkbox.checked).toBe(false);
|
|
16
|
+
checkbox.click();
|
|
17
|
+
await page.waitForChanges();
|
|
18
|
+
expect(checkbox.checked).toBe(false);
|
|
19
|
+
});
|
|
20
|
+
});
|
|
@@ -837,7 +837,7 @@ export class Datetime {
|
|
|
837
837
|
* so we need to re-init behavior with the new elements.
|
|
838
838
|
*/
|
|
839
839
|
componentDidRender() {
|
|
840
|
-
const { presentation, prevPresentation, calendarBodyRef, minParts, preferWheel,
|
|
840
|
+
const { presentation, prevPresentation, calendarBodyRef, minParts, preferWheel, forceRenderDate } = this;
|
|
841
841
|
/**
|
|
842
842
|
* TODO(FW-2165)
|
|
843
843
|
* Remove this when https://bugs.webkit.org/show_bug.cgi?id=235960 is fixed.
|
|
@@ -867,7 +867,7 @@ export class Datetime {
|
|
|
867
867
|
* the scroll callback in this file does not fire,
|
|
868
868
|
* and the resolveForceDateScrolling promise never resolves.
|
|
869
869
|
*/
|
|
870
|
-
if (workingMonth &&
|
|
870
|
+
if (workingMonth && forceRenderDate === undefined) {
|
|
871
871
|
calendarBodyRef.scrollLeft = workingMonth.clientWidth * (isRTL(this.el) ? -1 : 1);
|
|
872
872
|
}
|
|
873
873
|
}
|