CoCalc -- updateImageSize.test.ts

GitHub Repository: microsoft/vscode
Path: blob/main/extensions/emmet/src/test/updateImageSize.test.ts
⁴⁷⁷⁴ views
1
/*---------------------------------------------------------------------------------------------
2
 *  Copyright (c) Microsoft Corporation. All rights reserved.
3
 *  Licensed under the MIT License. See License.txt in the project root for license information.
4
 *--------------------------------------------------------------------------------------------*/
5

6
import 'mocha';
7
import * as assert from 'assert';
8
import { Selection } from 'vscode';
9
import { withRandomFileEditor, closeAllEditors } from './testUtils';
10
import { updateImageSize } from '../updateImageSize';
11

12
suite('Tests for Emmet actions on html tags', () => {
13
	teardown(closeAllEditors);
14

15
	const imageUrl = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAAHYcAAB2HAY/l8WUAAAATSURBVBhXY/jPwADGDP////8PAB/uBfuDMzhuAAAAAElFTkSuQmCC';
16
	const imageWidth = 2;
17
	const imageHeight = 2;
18

19
	test('update image css with multiple cursors in css file', () => {
20
		const cssContents = `
21
		.one {
22
			margin: 10px;
23
			padding: 10px;
24
			background-image: url('${imageUrl}');
25
		}
26
		.two {
27
			background-image: url('${imageUrl}');
28
			height: 42px;
29
		}
30
		.three {
31
			background-image: url('${imageUrl}');
32
			width: 42px;
33
		}
34
	`;
35
		const expectedContents = `
36
		.one {
37
			margin: 10px;
38
			padding: 10px;
39
			background-image: url('${imageUrl}');
40
			width: ${imageWidth}px;
41
			height: ${imageHeight}px;
42
		}
43
		.two {
44
			background-image: url('${imageUrl}');
45
			width: ${imageWidth}px;
46
			height: ${imageHeight}px;
47
		}
48
		.three {
49
			background-image: url('${imageUrl}');
50
			height: ${imageHeight}px;
51
			width: ${imageWidth}px;
52
		}
53
	`;
54
		return withRandomFileEditor(cssContents, 'css', (editor, doc) => {
55
			editor.selections = [
56
				new Selection(4, 50, 4, 50),
57
				new Selection(7, 50, 7, 50),
58
				new Selection(11, 50, 11, 50)
59
			];
60

61
			return updateImageSize()!.then(() => {
62
				assert.strictEqual(doc.getText(), expectedContents);
63
				return Promise.resolve();
64
			});
65
		});
66
	});
67

68
	test('update image size in css in html file with multiple cursors', () => {
69
		const htmlWithCssContents = `
70
		<html>
71
			<style>
72
				.one {
73
					margin: 10px;
74
					padding: 10px;
75
					background-image: url('${imageUrl}');
76
				}
77
				.two {
78
					background-image: url('${imageUrl}');
79
					height: 42px;
80
				}
81
				.three {
82
					background-image: url('${imageUrl}');
83
					width: 42px;
84
				}
85
			</style>
86
		</html>
87
	`;
88
		const expectedContents = `
89
		<html>
90
			<style>
91
				.one {
92
					margin: 10px;
93
					padding: 10px;
94
					background-image: url('${imageUrl}');
95
					width: ${imageWidth}px;
96
					height: ${imageHeight}px;
97
				}
98
				.two {
99
					background-image: url('${imageUrl}');
100
					width: ${imageWidth}px;
101
					height: ${imageHeight}px;
102
				}
103
				.three {
104
					background-image: url('${imageUrl}');
105
					height: ${imageHeight}px;
106
					width: ${imageWidth}px;
107
				}
108
			</style>
109
		</html>
110
	`;
111
		return withRandomFileEditor(htmlWithCssContents, 'html', (editor, doc) => {
112
			editor.selections = [
113
				new Selection(6, 50, 6, 50),
114
				new Selection(9, 50, 9, 50),
115
				new Selection(13, 50, 13, 50)
116
			];
117

118
			return updateImageSize()!.then(() => {
119
				assert.strictEqual(doc.getText(), expectedContents);
120
				return Promise.resolve();
121
			});
122
		});
123
	});
124

125
	test('update image size in img tag in html file with multiple cursors', () => {
126
		const htmlwithimgtag = `
127
		<html>
128
			<img id="one" src="${imageUrl}" />
129
			<img id="two" src="${imageUrl}" width="56" />
130
			<img id="three" src="${imageUrl}" height="56" />
131
		</html>
132
	`;
133
		const expectedContents = `
134
		<html>
135
			<img id="one" src="${imageUrl}" width="${imageWidth}" height="${imageHeight}" />
136
			<img id="two" src="${imageUrl}" width="${imageWidth}" height="${imageHeight}" />
137
			<img id="three" src="${imageUrl}" height="${imageHeight}" width="${imageWidth}" />
138
		</html>
139
	`;
140
		return withRandomFileEditor(htmlwithimgtag, 'html', (editor, doc) => {
141
			editor.selections = [
142
				new Selection(2, 50, 2, 50),
143
				new Selection(3, 50, 3, 50),
144
				new Selection(4, 50, 4, 50)
145
			];
146

147
			return updateImageSize()!.then(() => {
148
				assert.strictEqual(doc.getText(), expectedContents);
149
				return Promise.resolve();
150
			});
151
		});
152
	});
153
});
154

155
Product

Resources

Company
