Skip to content

Commit c6efa3c

Browse files
committed
fix(ui5-tokenizer): sync popover list items with token text changes
fix cypress tests
1 parent 2e84b47 commit c6efa3c

File tree

145 files changed

+369
-16
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

145 files changed

+369
-16
lines changed

packages/main/cypress/specs/Tokenizer.cy.tsx

Lines changed: 13 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -222,28 +222,25 @@ describe("Tokenizer - Popover List Item Text Updates", () => {
222222
</Tokenizer>
223223
);
224224

225-
cy.get("#test-token-text-update")
225+
cy.get<Tokenizer>("[ui5-tokenizer]")
226226
.shadow()
227227
.find(".ui5-tokenizer-more-text")
228228
.realClick();
229229

230-
cy.get("#test-token-text-update")
230+
cy.get<Tokenizer>("[ui5-tokenizer]")
231231
.shadow()
232232
.find("[ui5-responsive-popover]")
233233
.should("be.visible");
234234

235-
cy.get("#test-token-text-update")
235+
cy.get<Tokenizer>("[ui5-tokenizer]")
236236
.shadow()
237237
.find("[ui5-responsive-popover] [ui5-list] [ui5-li]")
238238
.eq(0)
239239
.should("have.attr", "text", "Original Text");
240240

241-
cy.get("#token-to-modify").then($token => {
242-
const token = $token.get(0) as Token;
243-
token.text = "Updated Text";
244-
});
241+
cy.get("#token-to-modify").invoke("prop", "text", "Updated Text");
245242

246-
cy.get("#test-token-text-update")
243+
cy.get<Tokenizer>("[ui5-tokenizer]")
247244
.shadow()
248245
.find("[ui5-responsive-popover] [ui5-list] [ui5-li]")
249246
.eq(0)
@@ -267,47 +264,47 @@ describe("Tokenizer - Popover List Item Text Updates", () => {
267264
</Tokenizer>
268265
);
269266

270-
cy.get("#test-multiple-token-updates")
267+
cy.get<Tokenizer>("[ui5-tokenizer]")
271268
.shadow()
272269
.find(".ui5-tokenizer-more-text")
273270
.realClick();
274271

275-
cy.get("#test-multiple-token-updates")
272+
cy.get<Tokenizer>("[ui5-tokenizer]")
276273
.shadow()
277274
.find("[ui5-responsive-popover] [ui5-list] [ui5-li]")
278275
.eq(0)
279276
.should("have.attr", "text", "Token 1");
280277

281-
cy.get("#test-multiple-token-updates")
278+
cy.get<Tokenizer>("[ui5-tokenizer]")
282279
.shadow()
283280
.find("[ui5-responsive-popover] [ui5-list] [ui5-li]")
284281
.eq(1)
285282
.should("have.attr", "text", "Token 2");
286283

287-
cy.get("#token-1").then($token => {
284+
cy.get<Token>("[ui5-token]").then($token => {
288285
const token = $token.get(0) as Token;
289286
token.text = "Modified Token 1";
290287
});
291288

292-
cy.get("#token-2").then($token => {
289+
cy.get<Token>("[ui5-token]").then($token => {
293290
const token = $token.get(0) as Token;
294291
token.text = "Modified Token 2";
295292
});
296293

297-
cy.get("#test-multiple-token-updates")
294+
cy.get<Tokenizer>("[ui5-tokenizer]")
298295
.shadow()
299296
.find("[ui5-responsive-popover] [ui5-list] [ui5-li]")
300297
.eq(0)
301298
.should("have.attr", "text", "Modified Token 1");
302299

303-
cy.get("#test-multiple-token-updates")
300+
cy.get<Tokenizer>("[ui5-tokenizer]")
304301
.shadow()
305302
.find("[ui5-responsive-popover] [ui5-list] [ui5-li]")
306303
.eq(1)
307304
.should("have.attr", "text", "Modified Token 2");
308305

309306
// Verify unchanged token remains the same
310-
cy.get("#test-multiple-token-updates")
307+
cy.get<Tokenizer>("[ui5-tokenizer]")
311308
.shadow()
312309
.find("[ui5-responsive-popover] [ui5-list] [ui5-li]")
313310
.eq(2)
Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
.busy-indicator-wrapper {
2+
position: relative;
3+
height: 100%;
4+
width: 100%;
5+
}
6+
7+
.busy-indicator-overlay {
8+
display: var(--ui5_web_components_busy_indicator_display);
9+
position: absolute;
10+
inset: 0;
11+
background: var(--ui5_web_components_busy_indicator_background-color);
12+
z-index: 99;
13+
}
14+
15+
.busy-indicator-busy-area {
16+
display: var(--ui5_web_components_busy_indicator_display);
17+
position: absolute;
18+
z-index: 99;
19+
inset: 0;
20+
justify-content: center;
21+
align-items: center;
22+
background-color: inherit;
23+
flex-direction: column;
24+
color: var(--_ui5_busy_indicator_color);
25+
}
26+
27+
:host([__is-busy]) .busy-indicator-wrapper > :not(.busy-indicator-busy-area):not(.busy-indicator-overlay):not([busy-indicator-before-span]) {
28+
--ui5_web_components_busy_indicator_display: none;
29+
}
30+
31+
.busy-indicator-busy-area:focus {
32+
outline: var(--_ui5_busy_indicator_focus_outline);
33+
outline-offset: -.125rem;
34+
}
35+
36+
.busy-indicator-circle {
37+
width: 1rem;
38+
height: 1rem;
39+
display: inline-block;
40+
background-color: currentColor;
41+
border-radius: 50%;
42+
}
43+
44+
.circle-animation-0 {
45+
animation: grow 1.6s infinite cubic-bezier(0.32, 0.06, 0.85, 1.11);
46+
}
47+
48+
.circle-animation-1 {
49+
animation: grow 1.6s infinite cubic-bezier(0.32, 0.06, 0.85, 1.11);
50+
animation-delay: 200ms;
51+
}
52+
53+
.circle-animation-2 {
54+
animation: grow 1.6s infinite cubic-bezier(0.32, 0.06, 0.85, 1.11);
55+
animation-delay: 400ms;
56+
}
57+
58+
.sapUiLocalBusy {
59+
--ui5_web_components_busy_indicator_display: none;
60+
}
61+
62+
.busy-indicator-wrapper [ui5-busy-indicator] {
63+
display: none;
64+
}
65+
66+
@keyframes grow {
67+
0%, 50%, 100% {
68+
-webkit-transform: scale(0.5);
69+
-moz-transform: scale(0.5);
70+
-ms-transform: scale(0.5);
71+
transform: scale(0.5);
72+
}
73+
74+
25% {
75+
-webkit-transform: scale(1);
76+
-moz-transform: scale(1);
77+
-ms-transform: scale(1);
78+
transform: scale(1);
79+
}
80+
}
Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
@font-face {
2+
font-family: "72";
3+
font-style: normal;
4+
font-weight: 400;
5+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Regular.woff2?ui5-webcomponents) format("woff2"), local("72");
6+
unicode-range: U+00, U+0D, U+20-7E, U+A0-FF, U+131, U+152-153, U+161, U+178, U+17D-17E, U+192, U+237, U+2C6, U+2DC, U+3BC, U+1E9E, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122;
7+
}
8+
9+
@font-face {
10+
font-family: "72full";
11+
font-style: normal;
12+
font-weight: 400;
13+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Regular-full.woff2?ui5-webcomponents) format("woff2"), local('72-full');
14+
}
15+
16+
@font-face {
17+
font-family: "72";
18+
font-style: normal;
19+
font-weight: 700;
20+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Bold.woff2?ui5-webcomponents) format("woff2"), local('72-Bold');
21+
unicode-range: U+00, U+0D, U+20-7E, U+A0-FF, U+131, U+152-153, U+161, U+178, U+17D-17E, U+192, U+237, U+2C6, U+2DC, U+3BC, U+1E9E, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122;
22+
}
23+
24+
@font-face {
25+
font-family: "72full";
26+
font-style: normal;
27+
font-weight: 700;
28+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Bold-full.woff2?ui5-webcomponents) format("woff2");
29+
}
30+
31+
@font-face {
32+
font-family: '72-Bold';
33+
font-style: normal;
34+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Bold.woff2?ui5-webcomponents) format("woff2"), local('72-Bold');
35+
unicode-range: U+00, U+0D, U+20-7E, U+A0-FF, U+131, U+152-153, U+161, U+178, U+17D-17E, U+192, U+237, U+2C6, U+2DC, U+3BC, U+1E9E, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122;
36+
}
37+
38+
@font-face {
39+
font-family: '72-Boldfull';
40+
font-style: normal;
41+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Bold-full.woff2?ui5-webcomponents) format("woff2");
42+
}
43+
44+
@font-face {
45+
font-family: '72-Light';
46+
font-style: normal;
47+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Light.woff2?ui5-webcomponents) format("woff2"), local('72-Light');
48+
unicode-range: U+00, U+0D, U+20-7E, U+A0-FF, U+131, U+152-153, U+161, U+178, U+17D-17E, U+192, U+237, U+2C6, U+2DC, U+3BC, U+1E9E, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122;
49+
}
50+
51+
@font-face {
52+
font-family: '72-Lightfull';
53+
font-style: normal;
54+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Light-full.woff2?ui5-webcomponents) format("woff2");
55+
}
56+
57+
@font-face {
58+
font-family: '72Mono';
59+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72Mono-Regular.woff2?ui5-webcomponents) format('woff2'), local('72Mono');
60+
unicode-range: U+00, U+0D, U+20-7E, U+A0-FF, U+131, U+152-153, U+161, U+178, U+17D-17E, U+192, U+237, U+2C6, U+2DC, U+3BC, U+1E9E, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122;
61+
}
62+
63+
@font-face {
64+
font-family: '72Monofull';
65+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72Mono-Regular-full.woff2?ui5-webcomponents) format('woff2');
66+
}
67+
68+
@font-face {
69+
font-family: '72Mono-Bold';
70+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72Mono-Bold.woff2?ui5-webcomponents) format('woff2'), local('72Mono-Bold');
71+
unicode-range: U+00, U+0D, U+20-7E, U+A0-FF, U+131, U+152-153, U+161, U+178, U+17D-17E, U+192, U+237, U+2C6, U+2DC, U+3BC, U+1E9E, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122;
72+
}
73+
74+
@font-face {
75+
font-family: '72Mono-Boldfull';
76+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72Mono-Bold-full.woff2?ui5-webcomponents) format('woff2');
77+
}
78+
79+
@font-face {
80+
font-family: "72Black";
81+
font-style: bold;
82+
font-weight: 900;
83+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff2?ui5-webcomponents) format("woff2"), local('72Black');
84+
unicode-range: U+00, U+0D, U+20-7E, U+A0-FF, U+131, U+152-153, U+161, U+178, U+17D-17E, U+192, U+237, U+2C6, U+2DC, U+3BC, U+1E9E, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122;
85+
}
86+
87+
@font-face {
88+
font-family: '72Blackfull';
89+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-Black-full.woff2?ui5-webcomponents) format('woff2');
90+
}
91+
92+
@font-face {
93+
font-family: "72-SemiboldDuplex";
94+
src: url(https://sdk.openui5.org/resources/sap/ui/core/themes/sap_horizon/fonts/72-SemiboldDuplex.woff2?ui5-webcomponents) format("woff2"), local('72-SemiboldDuplex');
95+
unicode-range: U+00, U+0D, U+20-7E, U+A0-FF, U+131, U+152-153, U+161, U+178, U+17D-17E, U+192, U+237, U+2C6, U+2DC, U+3BC, U+1E9E, U+2013-2014, U+2018-201A, U+201C-201E, U+2020-2022, U+2026, U+2030, U+2039-203A, U+2044, U+20AC, U+2122;
96+
}
Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
/**
2+
* Some diacritics are supported by the 72 font:
3+
* * Grave
4+
* * Acute
5+
* * Circumflex
6+
* * Tilde
7+
*
8+
* However, the following diacritics and the combination of multiple diacritics (including the supported ones) are not supported:
9+
* * Breve
10+
* * Horn
11+
* * Dot below
12+
* * Hook above
13+
*
14+
*
15+
* Override for the characters that aren't covered by the '72' font to other system fonts
16+
*
17+
* U+0102-0103: A and a with Breve
18+
* U+01A0-01A1: O and o with Horn
19+
* U+01AF-01B0: U and u with Horn
20+
* U+1EA0-1EB7: A and a with diacritics that are not supported by the font and combination of multiple diacritics
21+
* U+1EB8-1EC7: E and e with diacritics that are not supported by the font and combination of multiple diacritics
22+
* U+1EC8-1ECB: I and i with diacritics that are not supported by the font and combination of multiple diacritics
23+
* U+1ECC-1EE3: O and o with diacritics that are not supported by the font and combination of multiple diacritics
24+
* U+1EE4-1EF1: U and u with diacritics that are not supported by the font and combination of multiple diacritics
25+
* U+1EF4-1EF7: Y and y with diacritics that are not supported by the font and combination of multiple diacritics
26+
*
27+
*/
28+
@font-face {
29+
font-family: '72override';
30+
unicode-range: U+0102-0103, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EB7, U+1EB8-1EC7, U+1EC8-1ECB, U+1ECC-1EE3, U+1EE4-1EF1, U+1EF4-1EF7;
31+
src: local('Arial'), local('Helvetica'), local('sans-serif');
32+
}
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
:root {
2+
--_ui5_content_density:cozy;
3+
}
4+
5+
[data-ui5-compact-size],
6+
.ui5-content-density-compact,
7+
.sapUiSizeCompact {
8+
--_ui5_content_density:compact;
9+
}

packages/main/test/pages/resources/css/main/themes/Avatar.css

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)