Skip to content

Commit 2986fa9

Browse files
compulimcompulim
authored
Better props validation and standardize component template (#5476)
* Move from propTypes to valibot * Fix mark activity as spoken * Fix flaky tests * Fix hero card * Fix disabled props * Fix optional image * Fix object in props * Fix test * Relax valibot restriction * Fix TypeScript default * Allow date/number/string for Timestamp * Allow value of any * Upgrade test * Upgrade tests * Add simple offline test sample * Print ValiError * Print ValiError with prefix * Allow alt to be optional * Add TODO * Fully upgrade bubbleNub test * Fix flakiness * Move to validateProps * Remove default value from optional() * Remove remaining default value * Use strict isolation mode for fallback * Validate props * Validate props * Validate props * Validate props * Validate props * Validate props * Validate props * Validate props * Validate props * Validate props * Validate props * Fix nullable refObject * Validate props * Validate props * Validate props * Validate props * Validate props * Fix flaky * Fix flaky test * Fix flaky test * Update entry * Use exact version * Simplify * Clean up * Clean up * Add TODO * Clean up * Memoize
1 parent 488ce72 commit 2986fa9

File tree

121 files changed

+2728
-1655
lines changed

Some content is hidden

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

121 files changed

+2728
-1655
lines changed

‎CHANGELOG.md‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,7 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/
112112
- Switched math block syntax from `$$` to Tex-style `\[ \]` and `\( \)` delimiters with improved rendering and error handling, in PR [#5353](https://github.com/microsoft/BotFramework-WebChat/pull/5353), by [@OEvgeny](https://github.com/OEvgeny)
113113
- Improved avatar display and grouping behavior by fixing rendering issues and activity sender identification, in PR [#5346](https://github.com/microsoft/BotFramework-WebChat/pull/5346), by [@OEvgeny](https://github.com/OEvgeny)
114114
- Activity "copy" button will use `outerHTML` and `textContent` for clipboard content, in PR [#5378](https://github.com/microsoft/BotFramework-WebChat/pull/5378), by [@compulim](https://github.com/compulim)
115-
- Bumped dependencies to the latest versions, by [@compulim](https://github.com/compulim) in PR [#5385](https://github.com/microsoft/BotFramework-WebChat/pull/5385), [#5400](https://github.com/microsoft/BotFramework-WebChat/pull/5400), and [#5426](https://github.com/microsoft/BotFramework-WebChat/pull/5426)
115+
- Bumped dependencies to the latest versions, by [@compulim](https://github.com/compulim) in PR [#5385](https://github.com/microsoft/BotFramework-WebChat/pull/5385), [#5400](https://github.com/microsoft/BotFramework-WebChat/pull/5400), [#5426](https://github.com/microsoft/BotFramework-WebChat/pull/5426), and [#5476](https://github.com/microsoft/BotFramework-WebChat/pull/5476)
116116
- Production dependencies
117117
- [`web-speech-cognitive-services@8.1.0`](https://npmjs.com/package/web-speech-cognitive-services)
118118
- [`react-dictate-button@4.0.0`](https://npmjs.com/package/react-dictate-button)
@@ -135,7 +135,7 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/
135135
- [`shiki@2.3.2`](https://npmjs.com/package/shiki/)
136136
- [`use-propagate@0.2.1`](https://npmjs.com/package/use-propagate/)
137137
- [`use-state-with-ref@0.1.0`](https://npmjs.com/package/use-state-with-ref/)
138-
- [`valibot@0.42.1`](https://npmjs.com/package/valibot/)
138+
- [`valibot@1.1.0`](https://npmjs.com/package/valibot/)
139139
- [`web-speech-cognitive-services@8.1.1`](https://npmjs.com/package/web-speech-cognitive-services/)
140140
- Development dependencies
141141
- [`@biomejs/biome@1.9.4`](https://npmjs.com/package/@biomejs/biome/)
@@ -191,6 +191,7 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/
191191
- [`webpack-cli@6.0.1`](https://npmjs.com/package/webpack-cli/)
192192
- [`webpack@5.98.0`](https://npmjs.com/package/webpack/)
193193
- Fixed [#5446](https://github.com/microsoft/BotFramework-WebChat/issues/5446). Embedded `uuid` so `microsoft-cognitiveservices-speech-sdk` do not need to use dynamic loading, as this could fail in Webpack 4 environment, in PR [#5445](https://github.com/microsoft/BotFramework-WebChat/pull/5445), by [@compulim](https://github.com/compulim)
194+
- Fixed [#5476](https://github.com/microsoft/BotFramework-WebChat/issues/5476). Modernizing components through memoization and use [`valibot`](https://npmjs.com/package/valibot) for props validation, by [@compulim](https://github.com/compulim)
194195

195196
### Fixed
196197

‎__tests__/bubbleNub.js‎

Lines changed: 0 additions & 216 deletions
This file was deleted.

‎__tests__/html/sendAttachmentOn/useSendFiles.deprecation.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,8 @@
2929
await pageObjects.runHook(({ useSendFiles }) => useSendFiles()([fileBlob]));
3030

3131
// THEN: It should send the file.
32-
await pageConditions.allOutgoingActivitiesSent();
3332
await pageConditions.numActivitiesShown(3);
33+
await pageConditions.allOutgoingActivitiesSent();
3434
await host.snapshot();
3535

3636
// THEN: Should print deprecation warning.

‎__tests__/html/upload.image.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,8 @@
2121

2222
await pageConditions.uiConnected();
2323
await pageObjects.uploadFile('seaofthieves.jpg');
24-
await pageConditions.allOutgoingActivitiesSent();
2524
await pageConditions.numActivitiesShown(2);
25+
await pageConditions.allOutgoingActivitiesSent();
2626

2727
await host.snapshot();
2828
});

‎__tests__/html2/bubble/nub/carousel.html‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
<!doctype html>
2+
<html lang="en-US">
3+
<head>
4+
<link href="/assets/index.css" rel="stylesheet" type="text/css" />
5+
<script crossorigin="anonymous" src="/test-harness.js"></script>
6+
<script crossorigin="anonymous" src="/test-page-object.js"></script>
7+
<script crossorigin="anonymous" src="/__dist__/webchat-es5.js"></script>
8+
</head>
9+
<body>
10+
<main id="webchat"></main>
11+
<script>
12+
run(async function () {
13+
await host.windowSize(1080, 1920);
14+
15+
document.getElementById('webchat').style.zoom = 3;
16+
17+
WebChat.renderWebChat(
18+
{
19+
directLine: WebChat.createDirectLine({ token: await testHelpers.token.fetchDirectLineToken() }),
20+
store: testHelpers.createStore(),
21+
styleOptions: {
22+
bubbleNubOffset: 0,
23+
bubbleNubSize: 10,
24+
bubbleFromUserNubOffset: 0,
25+
bubbleFromUserNubSize: 10
26+
}
27+
},
28+
document.getElementById('webchat')
29+
);
30+
31+
await pageConditions.uiConnected();
32+
33+
await pageObjects.sendMessageViaSendBox('layout carousel');
34+
await pageConditions.numActivitiesShown(2);
35+
await pageConditions.allImagesLoaded();
36+
37+
await host.snapshot('local');
38+
});
39+
</script>
40+
</body>
41+
</html>

__tests__/__image_snapshots__/chrome-docker/bubble-nub-js-bubble-nub-with-standard-setup-1-snap.png renamed to __tests__/html2/bubble/nub/carousel.html.snap-1.png

File renamed without changes.

‎__tests__/html2/bubble/nub/offset/flipped.html‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<!doctype html>
2+
<html lang="en-US">
3+
<head>
4+
<link href="/assets/index.css" rel="stylesheet" type="text/css" />
5+
<script crossorigin="anonymous" src="/test-harness.js"></script>
6+
<script crossorigin="anonymous" src="/test-page-object.js"></script>
7+
<script crossorigin="anonymous" src="/__dist__/webchat-es5.js"></script>
8+
</head>
9+
<body>
10+
<main id="webchat"></main>
11+
<script>
12+
run(async function () {
13+
await host.windowSize(1080, 1920);
14+
15+
document.getElementById('webchat').style.zoom = 3;
16+
17+
WebChat.renderWebChat(
18+
{
19+
directLine: WebChat.createDirectLine({ token: await testHelpers.token.fetchDirectLineToken() }),
20+
store: testHelpers.createStore(),
21+
styleOptions: {
22+
bubbleBorderColor: 'red',
23+
bubbleBorderRadius: 10,
24+
bubbleBorderWidth: 2,
25+
bubbleFromUserBorderColor: 'green',
26+
bubbleFromUserBorderRadius: 10,
27+
bubbleFromUserBorderWidth: 2,
28+
bubbleFromUserNubOffset: 'bottom',
29+
bubbleFromUserNubSize: 10,
30+
bubbleNubOffset: 'bottom',
31+
bubbleNubSize: 10
32+
}
33+
},
34+
document.getElementById('webchat')
35+
);
36+
37+
await pageConditions.uiConnected();
38+
39+
await pageObjects.sendMessageViaSendBox('Hello, World!');
40+
await pageConditions.numActivitiesShown(2);
41+
42+
await host.snapshot('local');
43+
});
44+
</script>
45+
</body>
46+
</html>

__tests__/__image_snapshots__/chrome-docker/bubble-nub-js-bubble-nub-at-corner-with-offset-at-bottom-should-have-flipped-nub-1-snap.png renamed to __tests__/html2/bubble/nub/offset/flipped.html.snap-1.png

File renamed without changes.

‎__tests__/html2/bubble/nub/offset/negative10.html‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<!doctype html>
2+
<html lang="en-US">
3+
<head>
4+
<link href="/assets/index.css" rel="stylesheet" type="text/css" />
5+
<script crossorigin="anonymous" src="/test-harness.js"></script>
6+
<script crossorigin="anonymous" src="/test-page-object.js"></script>
7+
<script crossorigin="anonymous" src="/__dist__/webchat-es5.js"></script>
8+
</head>
9+
<body>
10+
<main id="webchat"></main>
11+
<script>
12+
run(async function () {
13+
await host.windowSize(1080, 1920);
14+
15+
document.getElementById('webchat').style.zoom = 3;
16+
17+
WebChat.renderWebChat(
18+
{
19+
directLine: WebChat.createDirectLine({ token: await testHelpers.token.fetchDirectLineToken() }),
20+
store: testHelpers.createStore(),
21+
styleOptions: {
22+
bubbleBorderColor: 'red',
23+
bubbleBorderRadius: 10,
24+
bubbleBorderWidth: 2,
25+
bubbleFromUserBorderColor: 'green',
26+
bubbleFromUserBorderRadius: 10,
27+
bubbleFromUserBorderWidth: 2,
28+
bubbleFromUserNubOffset: -10,
29+
bubbleFromUserNubSize: 10,
30+
bubbleNubOffset: -10,
31+
bubbleNubSize: 10
32+
}
33+
},
34+
document.getElementById('webchat')
35+
);
36+
37+
await pageConditions.uiConnected();
38+
39+
await pageObjects.sendMessageViaSendBox('Hello, World!');
40+
await pageConditions.numActivitiesShown(2);
41+
42+
await host.snapshot('local');
43+
});
44+
</script>
45+
</body>
46+
</html>

__tests__/__image_snapshots__/chrome-docker/bubble-nub-js-bubble-nub-at-corner-with-offset-of-minus-10-px-should-have-corner-radius-of-10-px-and-flipped-nub-1-snap.png renamed to __tests__/html2/bubble/nub/offset/negative10.html.snap-1.png

File renamed without changes.

0 commit comments

Comments
 (0)