Skip to content

Commit 22403b7

Browse files
compulimcompulim
committed
Add test
1 parent 494b95b commit 22403b7

2 files changed

Lines changed: 127 additions & 0 deletions

File tree

‎__tests__/html2/middleware/avatar/backwardCompatibility.html‎

Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
<!doctype html>
2+
<html lang="en-US">
3+
<head>
4+
<link href="/assets/index.css" rel="stylesheet" type="text/css" />
5+
</head>
6+
<body>
7+
<main id="webchat"></main>
8+
<script type="importmap">
9+
{
10+
"imports": {
11+
"botframework-webchat": "/__dist__/packages/bundle/static/botframework-webchat.js",
12+
"botframework-webchat/middleware": "/__dist__/packages/bundle/static/botframework-webchat/middleware.js",
13+
"react": "/__dist__/packages/bundle/static/react.js",
14+
"react-dom": "/__dist__/packages/bundle/static/react-dom.js"
15+
}
16+
}
17+
</script>
18+
<script type="module">
19+
import '/test-harness.mjs';
20+
import '/test-page-object.mjs';
21+
22+
import { createStoreWithOptions, renderWebChat, testIds } from 'botframework-webchat';
23+
import { avatarComponent, createAvatarPolymiddleware } from 'botframework-webchat/middleware';
24+
import { createElement } from 'react';
25+
26+
const {
27+
testHelpers: { createDirectLineEmulator }
28+
} = window;
29+
30+
testHelpers.hideKnownError();
31+
32+
// TODO: Should find ways to eliminate this line.
33+
window.WebChat = { createStoreWithOptions, testIds };
34+
35+
run(async function () {
36+
const { directLine, store } = createDirectLineEmulator();
37+
38+
const MiddlewareAvatar = ({ activity, children }) => {
39+
expect(activity).toHaveProperty('text', 'Hello, World!');
40+
41+
return createElement(
42+
'div',
43+
{
44+
style: {
45+
borderRadius: 40,
46+
height: 40,
47+
outline: 'dashed 2px green',
48+
outlineOffset: 2,
49+
overflow: 'hidden',
50+
width: 40
51+
}
52+
},
53+
children
54+
);
55+
};
56+
57+
const PolymiddlewareAvatar = ({ activity, children }) => {
58+
expect(activity).toHaveProperty('text', 'Hello, World!');
59+
60+
return createElement(
61+
'div',
62+
{
63+
style: {
64+
borderRadius: 32,
65+
height: 32,
66+
margin: 4,
67+
outline: 'dotted 2px red',
68+
outlineOffset: 2,
69+
overflow: 'hidden',
70+
width: 32
71+
}
72+
},
73+
children
74+
);
75+
};
76+
77+
renderWebChat(
78+
{
79+
avatarMiddleware: [
80+
() => next => request => {
81+
const children = next(request);
82+
83+
expect(Object.getOwnPropertyNames(request)).toEqual(['activity', 'fromUser', 'styleOptions']);
84+
expect(request.activity).toHaveProperty('text', 'Hello, World!');
85+
expect(request).toHaveProperty('fromUser', false);
86+
expect(request.styleOptions).toHaveProperty('botAvatarInitials', 'WC');
87+
88+
return (...args) => createElement(MiddlewareAvatar, { activity: request.activity }, children(...args));
89+
}
90+
],
91+
directLine,
92+
polymiddleware: Object.freeze([
93+
createAvatarPolymiddleware(next => request => {
94+
expect('styleOptions' in request).toBe(false);
95+
expect(Object.getOwnPropertyNames(request)).toEqual(['activity']);
96+
expect(request.activity).toHaveProperty('text', 'Hello, World!');
97+
98+
const children = next(request)?.render();
99+
100+
return avatarComponent(PolymiddlewareAvatar, { activity: request.activity, children });
101+
})
102+
]),
103+
store,
104+
styleOptions: {
105+
botAvatarInitials: 'WC',
106+
botAvatarImage: '/assets/bot-avatar.jpg',
107+
userAvatarInitials: 'WW'
108+
}
109+
},
110+
document.getElementById('webchat')
111+
);
112+
113+
await pageConditions.uiConnected();
114+
115+
directLine.emulateIncomingActivity({
116+
from: { role: 'bot' },
117+
text: 'Hello, World!',
118+
type: 'message'
119+
});
120+
121+
// THEN: Should show an image with a green outside border with a red inside border.
122+
// Legacy middleware has higher priority than polymiddleware.
123+
await host.snapshot('local');
124+
});
125+
</script>
126+
</body>
127+
</html>

‎__tests__/html2/middleware/avatar/backwardCompatibility.html.snap-1.png‎

11.9 KB
Loading

0 commit comments

Comments
 (0)