Skip to content

Commit 6c131bb

Browse files
OEvgenyOEvgeny
authored
Fix typing indicator position in copilot variant (#5495)
* Fix typing indicator position in copilot variant * Changelog * Migrate livestream test
1 parent ee2c5f2 commit 6c131bb

23 files changed

+184
-9
lines changed

‎CHANGELOG.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -222,7 +222,7 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/
222222
- Added proper ARIA attributes to link definitions component
223223
- Improved focus management for scroll to end button
224224
- Fixed [#5439](https://github.com/microsoft/BotFramework-WebChat/issues/5439). Fixed batched livestream activities are not recognized in the same session, in PR [#5440](https://github.com/microsoft/BotFramework-WebChat/pull/5440), by [@compulim](https://github.com/compulim)
225-
- Fixed [#5452](https://github.com/microsoft/BotFramework-WebChat/issues/5452). With Fluent/Copilot theme, the typing indicator padding should not be squashed, in PR [#5453](https://github.com/microsoft/BotFramework-WebChat/pull/5453), by [@compulim](https://github.com/compulim)
225+
- Fixed [#5452](https://github.com/microsoft/BotFramework-WebChat/issues/5452). With Fluent/Copilot theme, the typing indicator padding should not be squashed and bottom margin should not grow, in PR [#5453](https://github.com/microsoft/BotFramework-WebChat/pull/5453), by [@compulim](https://github.com/compulim) and in PR [#5495](https://github.com/microsoft/BotFramework-WebChat/pull/5495), by [@OEvgeny](https://github.com/OEvgeny)
226226
- Fixed [#5461](https://github.com/microsoft/BotFramework-WebChat/issues/5461). On macOS and Fluent skinpack applied, using Japanese IME to input some Japanese text should not send them immediately, in PR [#5462](https://github.com/microsoft/BotFramework-WebChat/pull/5462), by [@compulim](https://github.com/compulim)
227227
- Fixed [#5472](https://github.com/microsoft/BotFramework-WebChat/issues/5472), ensure proper inheritance from the outside of Web Chat for visibility CSS property when hidden, in PR [#5473](https://github.com/microsoft/BotFramework-WebChat/pull/5473), by [@OEvgeny](https://github.com/OEvgeny)
228228
- Fixed [#5474](https://github.com/microsoft/BotFramework-WebChat/issues/5474). Disable AMD glue code in bundle, in PR [#5478](https://github.com/microsoft/BotFramework-WebChat/pull/5478), by [@compulim](https://github.com/compulim)

‎__tests__/html2/typing/typingIndicator.fluent.copilot.html‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<script>
5+
location = './typingIndicator?theme=fluent&variant=copilot';
6+
</script>
7+
</head>
8+
<body></body>
9+
</html>

‎__tests__/html2/typing/typingIndicator.fluent.copilot.html.snap-1.png‎

27.7 KB
Loading

‎__tests__/html2/typing/typingIndicator.fluent.copilot.html.snap-2.png‎

26.8 KB
Loading

__tests__/html2/fluentTheme/typingIndicator.livestream.html renamed to __tests__/html2/typing/typingIndicator.fluent.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<html>
33
<head>
44
<script>
5-
location = './typingIndicator?livestream';
5+
location = './typingIndicator?theme=fluent';
66
</script>
77
</head>
88
<body></body>

‎__tests__/html2/typing/typingIndicator.fluent.html.snap-1.png‎

28.4 KB
Loading

‎__tests__/html2/typing/typingIndicator.fluent.html.snap-2.png‎

27.5 KB
Loading

__tests__/html2/fluentTheme/typingIndicator.html renamed to __tests__/html2/typing/typingIndicator.html

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,11 @@
88
<script crossorigin="anonymous" src="/test-page-object.js"></script>
99
<script crossorigin="anonymous" src="/__dist__/webchat-es5.js"></script>
1010
<script crossorigin="anonymous" src="/__dist__/botframework-webchat-fluent-theme.production.min.js"></script>
11+
<style>
12+
#webchat .webchat__typing-indicator {
13+
background-image: url(data:image/gif;base64,R0lGODlhQAAYAPUAAOzv8evu8Ort7+fq7Ons7ujr7eXo6uTn6ebp6+Xn6ezu8OPm6N/i49/i5OHk5uDj5d/h49PV17/BwsLExdja3MvNz72/wL7Awc/S08TGyMDCw9TW2NbZ2tvd39nc3d3f4ens7bO0tbS2t7GztLW3uK6vsMnLzamqq7m7vK2ur6yurp2en6KjpJeXmI2NjpGSkpOUlJiYmZqbmwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQABwD/ACwAAAAAQAAYAAAG8ECAcEgsGo/IpHLJbDqf0Kh0Sq1ar9isdsvtegOGgTAwLBQPRQNAMAw0HGRAPA4gVAMUjWW/KA89IiqCHkJqbHImMS4uKxFjcnVFdgpOeHuXEghCZgAeKYKgHURsiYumHI9DdlQSmHsYkEIooKAoRQErpqYndKpVrXvAFn60tL0QL7qLMWKxQqtSwhbARSXFgkUPycoyIKmRrJfBG36zxRKjACzKLiG94ELNTwwXroecByPFfQCGABAwdHX79owKmQoTMkRYxWlIhkAZEhQSIoDMhxItZJDgR4YMNADNKHkZSbKkyZMoU6pcybKly5dBAAA7); background-color: black;
14+
}
15+
</style>
1116
</head>
1217
<body>
1318
<main id="webchat"></main>
@@ -38,8 +43,8 @@
3843

3944
const { directLine, store } = testHelpers.createDirectLineEmulator();
4045

41-
render(
42-
createElement(FluentThemeProvider, {}, createElement(ReactWebChat, { directLine, store })),
46+
renderWebChat(
47+
{ directLine, store },
4348
document.getElementById('webchat')
4449
);
4550

@@ -49,28 +54,28 @@
4954
await directLine.emulateIncomingActivity({
5055
from: { id: 'u-00001', name: 'Bot', role: 'bot' },
5156
id: 'a-00001',
52-
text: 'In minim amet culpa adipisicing aliqua culpa minim culpa officia culpa laboris non commodo. Velit nisi ut sit amet in sunt eu voluptate Lorem eu do sint proident aute. Nulla nisi commodo consectetur anim id non ut est anim veniam occaecat excepteur dolor nulla. Adipisicing et dolor ex cillum sit ipsum amet labore officia dolor non ad aliquip officia. Irure quis occaecat cupidatat ut commodo culpa eiusmod ipsum pariatur. Excepteur aliqua consectetur anim laborum enim ipsum tempor occaecat voluptate.',
57+
text: 'In minim amet culpa adipisicing aliqua culpa minim culpa officia culpa laboris non commodo.',
5358
type: 'message'
5459
});
5560

5661
await directLine.emulateIncomingActivity({
5762
from: { id: 'u-00001', name: 'Bot', role: 'bot' },
5863
id: 'a-00002',
59-
text: 'Excepteur enim tempor ex do magna elit consectetur elit incididunt. Amet reprehenderit cupidatat amet velit nostrud esse est dolor proident ex ut deserunt. Velit veniam minim esse laboris irure esse duis dolor sint culpa. Sit ullamco eiusmod consectetur enim elit cillum sit elit irure ut commodo ad. Cillum ad mollit est labore culpa proident sunt tempor culpa pariatur elit laborum.',
64+
text: 'Excepteur enim tempor ex do magna elit consectetur elit incididunt.',
6065
type: 'message'
6166
});
6267

6368
await directLine.emulateIncomingActivity({
6469
from: { id: 'u-00001', name: 'Bot', role: 'bot' },
6570
id: 'a-00003',
66-
text: 'Ad minim fugiat sint et laboris consectetur eu ut in nisi fugiat cillum est labore. Et proident tempor veniam ex est incididunt Lorem. Culpa sit id eu voluptate.',
71+
text: 'Ad minim fugiat sint et laboris consectetur eu ut in nisi fugiat cillum est labore.',
6772
type: 'message'
6873
});
6974

7075
await directLine.emulateIncomingActivity({
7176
from: { id: 'u-00001', name: 'Bot', role: 'bot' },
7277
id: 'a-00004',
73-
text: 'Est voluptate eiusmod ad Lorem irure amet sint ea aliqua labore eu do nostrud exercitation. Non adipisicing non amet laborum. Anim fugiat minim cupidatat consequat ipsum minim ex mollit commodo ut aliqua quis consequat dolore. Cupidatat tempor laborum consectetur eiusmod cillum do consequat ad pariatur amet magna aliquip occaecat officia.',
78+
text: 'Est voluptate eiusmod ad Lorem irure amet sint ea aliqua labore eu do nostrud exercitation.',
7479
type: 'message'
7580
});
7681

‎__tests__/html2/typing/typingIndicator.html.snap-1.png‎

29.3 KB
Loading

‎__tests__/html2/typing/typingIndicator.html.snap-2.png‎

28.7 KB
Loading

0 commit comments

Comments
 (0)