Skip to content

Commit dfe788c

Browse files
compulimcompulim
authored
Add pre-chat message with starter prompts (#5255)
* Add pre-chat message with starter prompts * Add pre-chat message * useSuggestedActions: add origin activity * Add maxMessageLength.infinity test * Incorp PR changes * Apply PR suggestions * Flush on CSS vars
1 parent 516e73e commit dfe788c

36 files changed

+771
-78
lines changed

‎CHANGELOG.md‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,18 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/
2828

2929
- `styleOptions.bubbleImageHeight` is being deprecated in favor of `styleOptions.bubbleImageMaxHeight` and `styleOptions.bubbleImageMinHeight`. The option will be removed on or after 2026-07-05
3030

31+
### Added
32+
33+
- (Experimental) Added pre-chat message with starter prompts, in PR [#5255](https://github.com/microsoft/BotFramework-WebChat/issues/5255), by [@compulim](https://github.com/compulim)
34+
35+
### Changed
36+
37+
- Updated `useSuggestedActions` to return the activity the suggested actions originated from, in PR [#5255](https://github.com/microsoft/BotFramework-WebChat/issues/5255), by [@compulim](https://github.com/compulim)
38+
39+
### Fixed
40+
41+
- Fixed [#5256](https://github.com/microsoft/BotFramework-WebChat/issues/5256). `styleOptions.maxMessageLength` should support any JavaScript number value including `Infinity`, by [@compulim](https://github.com/compulim), in PR [#5255](https://github.com/microsoft/BotFramework-WebChat/issues/pull/5255)
42+
3143
## [4.18.0] - 2024-07-10
3244

3345
### Added

‎__tests__/__image_snapshots__/html/max-message-length-infinity-js-fluent-theme-applied-handles-max-message-length-of-infinity-1-snap.png‎

8.67 KB
Loading

‎__tests__/__image_snapshots__/html/pre-chat-message-activity-js-fluent-theme-applied-should-display-pre-chat-message-1-snap.png‎

31.7 KB
Loading

‎__tests__/__image_snapshots__/html/pre-chat-message-activity-wide-js-fluent-theme-applied-should-display-pre-chat-message-in-wide-format-1-snap.png‎

43.6 KB
Loading

‎__tests__/html/fluentTheme/maxMessageLength.infinity.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="https://unpkg.com/@babel/standalone/babel.min.js"></script>
6+
<script crossorigin="anonymous" src="https://unpkg.com/react@16.8.6/umd/react.production.min.js"></script>
7+
<script crossorigin="anonymous" src="https://unpkg.com/react-dom@16.8.6/umd/react-dom.production.min.js"></script>
8+
<script crossorigin="anonymous" src="/test-harness.js"></script>
9+
<script crossorigin="anonymous" src="/test-page-object.js"></script>
10+
<script crossorigin="anonymous" src="/__dist__/webchat-es5.js"></script>
11+
<script crossorigin="anonymous" src="/__dist__/botframework-webchat-fluent-theme.production.min.js"></script>
12+
</head>
13+
<body>
14+
<main id="webchat"></main>
15+
<script type="text/babel">
16+
run(async function () {
17+
const {
18+
React,
19+
ReactDOM: { render },
20+
WebChat: { FluentThemeProvider, ReactWebChat }
21+
} = window; // Imports in UMD fashion.
22+
23+
const { directLine, store } = testHelpers.createDirectLineEmulator();
24+
25+
const App = () => (
26+
<ReactWebChat directLine={directLine} store={store} styleOptions={{ maxMessageLength: Infinity }} />
27+
);
28+
29+
render(
30+
<FluentThemeProvider>
31+
<App />
32+
</FluentThemeProvider>,
33+
document.getElementById('webchat')
34+
);
35+
36+
await pageConditions.uiConnected();
37+
38+
document.querySelector(`[data-testid="${WebChat.testIds.sendBoxTextBox}"]`).focus();
39+
await host.sendKeys('Occaecat sunt eu enim tempor cillum laboris esse esse.');
40+
41+
// THEN: Should not show the message length indicator.
42+
await host.snapshot();
43+
});
44+
</script>
45+
</body>
46+
</html>

‎__tests__/html/fluentTheme/maxMessageLength.infinity.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/** @jest-environment ./packages/test/harness/src/host/jest/WebDriverEnvironment.js */
2+
3+
describe('Fluent theme applied', () => {
4+
test('handles max message length of Infinity', () => runHTML('fluentTheme/maxMessageLength.infinity'));
5+
});

‎__tests__/html/fluentTheme/preChatMessageActivity.html‎

Lines changed: 104 additions & 0 deletions
Large diffs are not rendered by default.

‎__tests__/html/fluentTheme/preChatMessageActivity.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/** @jest-environment ./packages/test/harness/src/host/jest/WebDriverEnvironment.js */
2+
3+
describe('Fluent theme applied', () => {
4+
test('should display pre-chat message', () => runHTML('fluentTheme/preChatMessageActivity'));
5+
});

‎__tests__/html/fluentTheme/preChatMessageActivity.wide.html‎

Lines changed: 106 additions & 0 deletions
Large diffs are not rendered by default.

‎__tests__/html/fluentTheme/preChatMessageActivity.wide.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/** @jest-environment ./packages/test/harness/src/host/jest/WebDriverEnvironment.js */
2+
3+
describe('Fluent theme applied', () => {
4+
test('should display pre-chat message in wide format', () => runHTML('fluentTheme/preChatMessageActivity.wide'));
5+
});

0 commit comments

Comments
 (0)