Skip to content

Commit 3feac2c

Browse files
author
marker dao ®
committed
stash
1 parent 002885a commit 3feac2c

File tree

10 files changed

+188
-76
lines changed

10 files changed

+188
-76
lines changed

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

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

8+
declare const $;
9+
810
const DEFAULT_SELECTOR = '#container';
911
const DEFAULT_OPTIONS: CreateWidgetOptions = {
1012
disableFxAnimation: true,
@@ -21,11 +23,11 @@ const createWidgetCore = <TWidgetName extends WidgetName>(
2123
) => {
2224
if (isShadowDom) {
2325
return new (window as any).DevExpress.ui[widgetName](
24-
($(selector) as any).get(0),
26+
($(selector)).get(0),
2527
widgetOptions,
2628
);
2729
}
28-
return ($(`${selector}`) as any)[widgetName](widgetOptions)[widgetName]('instance');
30+
return ($(`${selector}`))[widgetName](widgetOptions)[widgetName]('instance');
2931
};
3032

3133
export const createWidget = async<TWidgetName extends WidgetName>(

‎e2e/testcafe-devextreme/tests/editors/chat/data/index.ts‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,18 @@ interface User {
44
avatarUrl: string;
55
}
66

7+
interface Attachment {
8+
name: string;
9+
size: number;
10+
}
11+
712
interface Message {
813
timestamp: Date;
914
author: User;
1015
type?: 'image' | 'text';
1116
src?: string;
1217
text?: string;
18+
attachments?: Attachment[];
1319
}
1420

1521
export const avatarUrl = 'data:image/png;base64,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';
@@ -75,3 +81,29 @@ export const generateImageMessage = (
7581
type: 'image',
7682
src,
7783
});
84+
85+
export const attachments = [
86+
{
87+
name: '9138cf2e-ced3-426a-bb53-4478536f690b.zip',
88+
size: 1024,
89+
},
90+
{
91+
name: '9138cf2e-ced3-426a-bb53-4478536f690b.png',
92+
size: 10240,
93+
},
94+
{
95+
name: '9138cf2e-ced3-426a-bb53-4478536f690b.jpeg',
96+
size: 102400,
97+
},
98+
{
99+
name: '9138cf2e-ced3-426a-bb53-4478536f690b.zip',
100+
size: 1024000,
101+
},
102+
];
103+
104+
export const generateFileMessage = (author: User, longText = false): Message => ({
105+
text: longText ? getLongText() : getShortText(),
106+
timestamp,
107+
author,
108+
attachments,
109+
});

‎e2e/testcafe-devextreme/tests/editors/chat/etalons/Bubbles with image (fluent.blue.light).png‎

-44.1 KB
Binary file not shown.

‎e2e/testcafe-devextreme/tests/editors/chat/etalons/Bubbles with small image (fluent.blue.light).png‎

-12.4 KB
Binary file not shown.

‎e2e/testcafe-devextreme/tests/editors/chat/etalons/Messagebox with attach button (fluent.blue.light).png‎

-17.4 KB
Binary file not shown.

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

Lines changed: 73 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import { createScreenshotsComparer } from 'devextreme-screenshot-comparer';
22
import Chat from 'devextreme-testcafe-models/chat';
3-
import { getShortText, getLongText, createUser } from './data';
3+
import {
4+
getShortText, getLongText, createUser, attachments,
5+
} from './data';
46
import url from '../../../helpers/getPageUrl';
57
import { createWidget } from '../../../helpers/createWidget';
68
import { testScreenshot } from '../../../helpers/themeUtils';
@@ -9,85 +11,97 @@ import { appendElementTo } from '../../../helpers/domUtils';
911
fixture.disablePageReloads`ChatMessageBox`
1012
.page(url(__dirname, '../../container.html'));
1113

12-
test('Chat: messagebox', async (t) => {
13-
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
14+
// test('Chat: messagebox', async (t) => {
15+
// const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
1416

15-
const chat = new Chat('#chat');
17+
// const chat = new Chat('#chat');
1618

17-
const shortText = getShortText();
18-
const longText = getLongText(false, 5);
19+
// const shortText = getShortText();
20+
// const longText = getLongText(false, 5);
1921

20-
await chat.focus();
21-
await testScreenshot(t, takeScreenshot, 'Messagebox when chat has focus.png', { element: '#chat' });
22+
// await chat.focus();
23+
// await testScreenshot(t, takeScreenshot, 'Messagebox when chat has focus.png', { element: '#chat' });
2224

23-
await t.typeText(chat.getInput(), shortText);
24-
await testScreenshot(t, takeScreenshot, 'Messagebox when input contains short text.png', { element: '#chat' });
25+
// await t.typeText(chat.getInput(), shortText);
26+
// await testScreenshot(t, takeScreenshot, 'Messagebox when input contains short text.png', { element: '#chat' });
2527

26-
await t.typeText(chat.getInput(), longText);
27-
await testScreenshot(t, takeScreenshot, 'Messagebox when input contains long text.png', { element: '#chat' });
28+
// await t.typeText(chat.getInput(), longText);
29+
// await testScreenshot(t, takeScreenshot, 'Messagebox when input contains long text.png', { element: '#chat' });
2830

29-
await t.pressKey('tab');
30-
await testScreenshot(t, takeScreenshot, 'Messagebox when send button has focus.png', { element: '#chat' });
31+
// await t.pressKey('tab');
32+
// await testScreenshot(t, takeScreenshot, 'Messagebox when send button has focus.png', { element: '#chat' });
3133

32-
await t
33-
.expect(compareResults.isValid())
34-
.ok(compareResults.errorMessages());
35-
}).before(async () => {
36-
await appendElementTo('#container', 'div', 'chat');
34+
// await t
35+
// .expect(compareResults.isValid())
36+
// .ok(compareResults.errorMessages());
37+
// }).before(async () => {
38+
// await appendElementTo('#container', 'div', 'chat');
3739

38-
return createWidget('dxChat', {
39-
width: 400,
40-
height: 600,
41-
}, '#chat');
42-
});
40+
// return createWidget('dxChat', {
41+
// width: 400,
42+
// height: 600,
43+
// }, '#chat');
44+
// });
4345

44-
test('Chat: messagebox with editing preview', async (t) => {
45-
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
46+
// test('Chat: messagebox with editing preview', async (t) => {
47+
// const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
4648

47-
const chat = new Chat('#chat');
49+
// const chat = new Chat('#chat');
4850

49-
await t.rightClick(chat.getMessage(0));
50-
await t.click(chat.getContextMenuItem(0));
51+
// await t.rightClick(chat.getMessage(0));
52+
// await t.click(chat.getContextMenuItem(0));
5153

52-
await testScreenshot(t, takeScreenshot, 'Messagebox with editing preview.png', {
53-
element: '#chat',
54-
});
54+
// await testScreenshot(t, takeScreenshot, 'Messagebox with editing preview.png', {
55+
// element: '#chat',
56+
// });
5557

56-
await t
57-
.expect(compareResults.isValid())
58-
.ok(compareResults.errorMessages());
59-
}).before(async () => {
60-
await appendElementTo('#container', 'div', 'chat');
58+
// await t
59+
// .expect(compareResults.isValid())
60+
// .ok(compareResults.errorMessages());
61+
// }).before(async () => {
62+
// await appendElementTo('#container', 'div', 'chat');
6163

62-
const userFirst = createUser(1, 'First');
63-
const userSecond = createUser(2, 'Second');
64+
// const userFirst = createUser(1, 'First');
65+
// const userSecond = createUser(2, 'Second');
6466

65-
const items = [{
66-
author: userFirst,
67-
text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
68-
}, {
69-
author: userSecond,
70-
text: 'Short message',
71-
}];
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+
// }];
7274

73-
return createWidget('dxChat', {
74-
items,
75-
user: userFirst,
76-
editing: {
77-
allowUpdating: true,
78-
},
79-
width: 400,
80-
height: 600,
81-
}, '#chat');
82-
});
75+
// return createWidget('dxChat', {
76+
// items,
77+
// user: userFirst,
78+
// editing: {
79+
// allowUpdating: true,
80+
// },
81+
// width: 400,
82+
// height: 600,
83+
// }, '#chat');
84+
// });
8385

84-
test('Chat: messagebox with attach button', async (t) => {
86+
test('Chat: messagebox with attachments and informer', async (t) => {
8587
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
8688

8789
const chat = new Chat('#chat');
8890

91+
await t.typeText(chat.getInput(), getLongText(false, 4));
92+
await chat.option({
93+
fileUploaderOptions: {
94+
value: [
95+
...attachments,
96+
...attachments,
97+
...attachments,
98+
],
99+
},
100+
});
101+
89102
await chat.focus();
90-
await testScreenshot(t, takeScreenshot, 'Messagebox with attach button.png', { element: '#chat' });
103+
await t.debug();
104+
await testScreenshot(t, takeScreenshot, 'Messagebox with attachments and informer.png', { element: '#chat' });
91105

92106
await t
93107
.expect(compareResults.isValid())
@@ -96,8 +110,7 @@ test('Chat: messagebox with attach button', async (t) => {
96110
await appendElementTo('#container', 'div', 'chat');
97111

98112
return createWidget('dxChat', {
99-
width: 400,
113+
width: 812,
100114
height: 600,
101-
fileUploaderOptions: {},
102115
}, '#chat');
103116
});

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

Lines changed: 26 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
import { createScreenshotsComparer } from 'devextreme-screenshot-comparer';
22
import Chat from 'devextreme-testcafe-models/chat';
3-
import { createUser, generateImageMessage, generateMessages } from './data';
3+
import {
4+
createUser,
5+
generateImageMessage,
6+
generateMessages,
7+
generateFileMessage,
8+
} from './data';
49
import url from '../../../helpers/getPageUrl';
510
import { createWidget } from '../../../helpers/createWidget';
611
import { testScreenshot } from '../../../helpers/themeUtils';
@@ -39,21 +44,31 @@ test('Chat: messagebubble', async (t) => {
3944
}, '#chat');
4045
});
4146

42-
test('Chat: messagebubble - image rendering with size variations', async (t) => {
47+
test('Chat: messagebubble with images and files', async (t) => {
4348
const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
4449
const chat = new Chat('#chat');
4550

4651
const user = createUser(1, 'ImageUser');
4752

48-
let imageMessages = generateImageMessage(user, '../../../apps/demos/images/products/1.png');
49-
50-
await chat.option({ items: [imageMessages] });
51-
await testScreenshot(t, takeScreenshot, 'Bubbles with image.png', { element: '#chat' });
52-
53-
imageMessages = generateImageMessage(user, '../../../apps/demos/images/products/1-small.png');
54-
55-
await chat.option({ items: [imageMessages] });
56-
await testScreenshot(t, takeScreenshot, 'Bubbles with small image.png', { element: '#chat' });
53+
const imageMessages = [
54+
generateImageMessage(user, '../../../apps/demos/images/products/1.png'),
55+
generateImageMessage(user, '../../../apps/demos/images/products/1-small.png'),
56+
];
57+
58+
await chat.option({ items: imageMessages });
59+
await testScreenshot(t, takeScreenshot, 'Bubbles with images.png', { element: '#chat' });
60+
61+
const fileMessages = [
62+
generateFileMessage(user),
63+
generateFileMessage(user, true),
64+
];
65+
66+
await chat.option({
67+
width: 700,
68+
height: 720,
69+
items: fileMessages,
70+
});
71+
await testScreenshot(t, takeScreenshot, 'Bubbles with files.png', { element: '#chat' });
5772

5873
await t.expect(compareResults.isValid()).ok(compareResults.errorMessages());
5974
}).before(async () => {

‎packages/devextreme/playground/jquery.html‎

Lines changed: 49 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,9 +52,55 @@ <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").dxButton({
56-
text: 'Click me!',
57-
onClick: () => { alert("clicked"); }
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+
},
58104
});
59105
});
60106
</script>

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

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

5+
declare const $;
6+
57
function getComponentInstance(
68
selector: Selector,
79
name?: string,

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

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

9+
declare const $;
10+
911
export default class Scrollbar {
1012
element: Selector;
1113

0 commit comments

Comments
 (0)