Skip to content

Commit 1fc6ab4

Browse files
author
Corina
authored
Add word-wrap to messageActivity (#1832)
* Add word-wrap to messageActivity * Update CHANGELOG.md * Add test for break-all * Add keep-all test
1 parent 1512fe6 commit 1fc6ab4

7 files changed

Lines changed: 51 additions & 2 deletions

File tree

‎CHANGELOG.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
2121
### Fixed
2222
- Fix [#1423](https://github.com/Microsoft/BotFramework-WebChat/issues/1423). Added sample for hosting WebChat in Angular, by [@omarsourour](https://github.com/omarsourour) in PR [#1813](https://github.com/Microsoft/BotFramework-WebChat/pull/1813)
2323
- Fix [#1767](https://github.com/Microsoft/BotFramework-WebChat/issues/1767). Remove `cursor: pointer` from buttons, by [@corinagum](https://github.com/corinagum) in PR [#1819](https://github.com/Microsoft/BotFramework-WebChat/pull/1819)
24+
- Fix [#1774](https://github.com/Microsoft/BotFramework-WebChat/issues/1774). Add `styleSetOption` to allow word break. Default to `break-word`, by [@corinagum](https://github.com/corinagum) in PR [#1832](https://github.com/Microsoft/BotFramework-WebChat/pull/1832)
2425

2526
## [4.3.0] - 2019-03-04
2627

‎__tests__/__image_snapshots__/chrome-docker/basic-js-long-ur-ls-with-break-all-1-snap.png‎

25.5 KB
Loading

‎__tests__/__image_snapshots__/chrome-docker/basic-js-long-ur-ls-with-break-word-1-snap.png‎

25.7 KB
Loading

‎__tests__/__image_snapshots__/chrome-docker/basic-js-long-ur-ls-with-keep-all-1-snap.png‎

23.3 KB
Loading

‎__tests__/basic.js‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,3 +20,46 @@ test('setup', async () => {
2020

2121
expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
2222
});
23+
24+
test('long URLs with break-word', async () => {
25+
const { driver, pageObjects} = await setupWebDriver();
26+
27+
await pageObjects.sendMessageViaSendBox('https://subdomain.domain.com/pathname0/pathname1/pathname2/pathname3/pathname4/')
28+
29+
await driver.wait(minNumActivitiesShown(2), 2000);
30+
await driver.wait(allImagesLoaded(), 2000);
31+
32+
const base64PNG = await driver.takeScreenshot();
33+
34+
expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
35+
});
36+
37+
test('long URLs with break-all', async () => {
38+
const WEB_CHAT_PROPS = { styleOptions: { messageActivityWordBreak: 'break-all' } };
39+
40+
const { driver, pageObjects} = await setupWebDriver({ props: WEB_CHAT_PROPS });
41+
42+
await pageObjects.sendMessageViaSendBox('https://subdomain.domain.com/pathname0/pathname1/pathname2/pathname3/pathname4/')
43+
44+
await driver.wait(minNumActivitiesShown(2), 2000);
45+
await driver.wait(allImagesLoaded(), 2000);
46+
47+
const base64PNG = await driver.takeScreenshot();
48+
49+
expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
50+
});
51+
52+
test('long URLs with keep-all', async () => {
53+
const WEB_CHAT_PROPS = { styleOptions: { messageActivityWordBreak: 'keep-all' } };
54+
55+
const { driver, pageObjects} = await setupWebDriver({ props: WEB_CHAT_PROPS });
56+
57+
await pageObjects.sendMessageViaSendBox('箸より重いものを持ったことがない箸より重いものを持ったことがない')
58+
59+
await driver.wait(minNumActivitiesShown(2), 2000);
60+
await driver.wait(allImagesLoaded(), 2000);
61+
62+
const base64PNG = await driver.takeScreenshot();
63+
64+
expect(base64PNG).toMatchImageSnapshot(imageSnapshotOptions);
65+
});

‎packages/component/src/Styles/StyleSet/Bubble.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,13 @@ export default function createBubbleStyle({
88
bubbleFromUserTextColor,
99
bubbleMaxWidth,
1010
bubbleMinHeight,
11-
bubbleTextColor
11+
bubbleTextColor,
12+
messageActivityWordBreak
1213
}) {
1314
return {
1415
maxWidth: bubbleMaxWidth,
1516
minHeight: bubbleMinHeight,
17+
wordBreak: messageActivityWordBreak,
1618

1719
'&:not(.from-user)': {
1820
background: bubbleBackground,

‎packages/component/src/Styles/defaultStyleSetOptions.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,9 @@ const DEFAULT_OPTIONS = {
1414
paddingWide: 20,
1515
subtle: DEFAULT_SUBTLE,
1616

17+
// Word break
18+
messageActivityWordBreak: 'break-word', // 'normal' || 'break-all' || 'break-word' || 'keep-all'
19+
1720
// fonts
1821
primaryFont: fontFamily(['Calibri', 'Helvetica Neue', 'Arial', 'sans-serif']),
1922
monospaceFont: fontFamily(['Consolas', 'Courier New', 'monospace']),
@@ -43,7 +46,7 @@ const DEFAULT_OPTIONS = {
4346
// Root
4447
rootHeight: '100%',
4548
rootWidth: '100%',
46-
49+
4750
// Send box
4851
hideSendBox: false,
4952
hideUploadButton: false,

0 commit comments

Comments
 (0)