Skip to content

Commit e535c92

Browse files
author
marker dao ®
committed
Chat: Add screenshot tests for MessageBubble and MessageBox
1 parent 3feac2c commit e535c92

File tree

5 files changed

+74
-127
lines changed

5 files changed

+74
-127
lines changed

‎e2e/testcafe-devextreme/helpers/createWidget.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,6 @@ export interface CreateWidgetOptions {
55
disableFxAnimation: boolean;
66
}
77

8-
declare const $;
9-
108
const DEFAULT_SELECTOR = '#container';
119
const DEFAULT_OPTIONS: CreateWidgetOptions = {
1210
disableFxAnimation: true,

‎e2e/testcafe-devextreme/tests/editors/chat/messageBox.ts‎

Lines changed: 71 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -11,77 +11,77 @@ import { appendElementTo } from '../../../helpers/domUtils';
1111
fixture.disablePageReloads`ChatMessageBox`
1212
.page(url(__dirname, '../../container.html'));
1313

14-
// test('Chat: messagebox', async (t) => {
15-
// const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
16-
17-
// const chat = new Chat('#chat');
18-
19-
// const shortText = getShortText();
20-
// const longText = getLongText(false, 5);
21-
22-
// await chat.focus();
23-
// await testScreenshot(t, takeScreenshot, 'Messagebox when chat has focus.png', { element: '#chat' });
24-
25-
// await t.typeText(chat.getInput(), shortText);
26-
// await testScreenshot(t, takeScreenshot, 'Messagebox when input contains short text.png', { element: '#chat' });
27-
28-
// await t.typeText(chat.getInput(), longText);
29-
// await testScreenshot(t, takeScreenshot, 'Messagebox when input contains long text.png', { element: '#chat' });
30-
31-
// await t.pressKey('tab');
32-
// await testScreenshot(t, takeScreenshot, 'Messagebox when send button has focus.png', { element: '#chat' });
33-
34-
// await t
35-
// .expect(compareResults.isValid())
36-
// .ok(compareResults.errorMessages());
37-
// }).before(async () => {
38-
// await appendElementTo('#container', 'div', 'chat');
39-
40-
// return createWidget('dxChat', {
41-
// width: 400,
42-
// height: 600,
43-
// }, '#chat');
44-
// });
45-
46-
// test('Chat: messagebox with editing preview', async (t) => {
47-
// const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
48-
49-
// const chat = new Chat('#chat');
50-
51-
// await t.rightClick(chat.getMessage(0));
52-
// await t.click(chat.getContextMenuItem(0));
53-
54-
// await testScreenshot(t, takeScreenshot, 'Messagebox with editing preview.png', {
55-
// element: '#chat',
56-
// });
57-
58-
// await t
59-
// .expect(compareResults.isValid())
60-
// .ok(compareResults.errorMessages());
61-
// }).before(async () => {
62-
// await appendElementTo('#container', 'div', 'chat');
63-
64-
// const userFirst = createUser(1, 'First');
65-
// const userSecond = createUser(2, 'Second');
66-
67-
// const items = [{
68-
// author: userFirst,
69-
// text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
70-
// }, {
71-
// author: userSecond,
72-
// text: 'Short message',
73-
// }];
74-
75-
// return createWidget('dxChat', {
76-
// items,
77-
// user: userFirst,
78-
// editing: {
79-
// allowUpdating: true,
80-
// },
81-
// width: 400,
82-
// height: 600,
83-
// }, '#chat');
84-
// });
14+
test('Chat: messagebox', async (t) => {
15+
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
16+
17+
const chat = new Chat('#chat');
18+
19+
const shortText = getShortText();
20+
const longText = getLongText(false, 5);
21+
22+
await chat.focus();
23+
await testScreenshot(t, takeScreenshot, 'Messagebox when chat has focus.png', { element: '#chat' });
24+
25+
await t.typeText(chat.getInput(), shortText);
26+
await testScreenshot(t, takeScreenshot, 'Messagebox when input contains short text.png', { element: '#chat' });
27+
28+
await t.typeText(chat.getInput(), longText);
29+
await testScreenshot(t, takeScreenshot, 'Messagebox when input contains long text.png', { element: '#chat' });
30+
31+
await t.pressKey('tab');
32+
await testScreenshot(t, takeScreenshot, 'Messagebox when send button has focus.png', { element: '#chat' });
33+
34+
await t
35+
.expect(compareResults.isValid())
36+
.ok(compareResults.errorMessages());
37+
}).before(async () => {
38+
await appendElementTo('#container', 'div', 'chat');
39+
40+
return createWidget('dxChat', {
41+
width: 400,
42+
height: 600,
43+
}, '#chat');
44+
});
45+
46+
test('Chat: messagebox with editing preview', async (t) => {
47+
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
48+
49+
const chat = new Chat('#chat');
50+
51+
await t.rightClick(chat.getMessage(0));
52+
await t.click(chat.getContextMenuItem(0));
53+
54+
await testScreenshot(t, takeScreenshot, 'Messagebox with editing preview.png', {
55+
element: '#chat',
56+
});
57+
58+
await t
59+
.expect(compareResults.isValid())
60+
.ok(compareResults.errorMessages());
61+
}).before(async () => {
62+
await appendElementTo('#container', 'div', 'chat');
63+
64+
const userFirst = createUser(1, 'First');
65+
const userSecond = createUser(2, 'Second');
66+
67+
const items = [{
68+
author: userFirst,
69+
text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
70+
}, {
71+
author: userSecond,
72+
text: 'Short message',
73+
}];
74+
75+
return createWidget('dxChat', {
76+
items,
77+
user: userFirst,
78+
editing: {
79+
allowUpdating: true,
80+
},
81+
width: 400,
82+
height: 600,
83+
}, '#chat');
84+
});
8585

8686
test('Chat: messagebox with attachments and informer', async (t) => {
8787
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
@@ -100,7 +100,6 @@ test('Chat: messagebox with attachments and informer', async (t) => {
100100
});
101101

102102
await chat.focus();
103-
await t.debug();
104103
await testScreenshot(t, takeScreenshot, 'Messagebox with attachments and informer.png', { element: '#chat' });
105104

106105
await t

‎packages/devextreme/playground/jquery.html‎

Lines changed: 3 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -52,55 +52,9 @@ <h1 style="position: fixed; left: 0; top: 0; clip: rect(1px, 1px, 1px, 1px);">Te
5252
<div id="button"></div>
5353
<script>
5454
$(() => {
55-
$("#button").dxChat({
56-
fileUploaderOptions: {
57-
// value: [
58-
// {
59-
// name: '1',
60-
// size: 1,
61-
// },
62-
// {
63-
// name: '1',
64-
// size: 1,
65-
// },
66-
// {
67-
// name: '1',
68-
// size: 1,
69-
// },
70-
// {
71-
// name: '1',
72-
// size: 1,
73-
// },
74-
// {
75-
// name: '1',
76-
// size: 1,
77-
// },
78-
// {
79-
// name: '1',
80-
// size: 1,
81-
// },
82-
// {
83-
// name: '1',
84-
// size: 1,
85-
// },
86-
// {
87-
// name: '1',
88-
// size: 1,
89-
// },
90-
// {
91-
// name: '1',
92-
// size: 1,
93-
// },
94-
// {
95-
// name: '1',
96-
// size: 1,
97-
// },
98-
// {
99-
// name: '1',
100-
// size: 1,
101-
// },
102-
// ],
103-
},
55+
$("#button").dxButton({
56+
text: 'Click me!',
57+
onClick: () => { alert("clicked"); }
10458
});
10559
});
10660
</script>

‎packages/testcafe-models/internal/widget.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,6 @@ import { Selector, ClientFunction } from 'testcafe';
22
import type { WidgetName } from '../types';
33
import { isObject } from 'devextreme/core/utils/type';
44

5-
declare const $;
6-
75
function getComponentInstance(
86
selector: Selector,
97
name?: string,

‎packages/testcafe-models/scrollView/internal/scrollbar.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,6 @@ const CLASS = {
66
scrollableScroll: 'dx-scrollable-scroll',
77
};
88

9-
declare const $;
10-
119
export default class Scrollbar {
1210
element: Selector;
1311

0 commit comments

Comments
 (0)