CoCalc -- tests.js

Summer of Sage Days 2015: San Diego (sd64.25), etc.
react / wstein / node_modules / jest-cli / node_modules / jsdom / node_modules / cssstyle / tests / tests.js
⁸¹¹⁴¹ views
1
"use strict";
2
var util = require('util');
3
var cssstyle = require('../lib/CSSStyleDeclaration');
4

5
var camelToDashed = require('../lib/parsers').camelToDashed;
6

7
/**
8
 *  These are the required properties
9
 *  see http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSS2Properties
10
 **/
11
var properties = [ 'azimuth', 'background', 'backgroundAttachment', 'backgroundColor', 'backgroundImage', 'backgroundPosition', 'backgroundRepeat', 'border', 'borderCollapse', 'borderColor', 'borderSpacing', 'borderStyle', 'borderTop', 'borderRight', 'borderBottom', 'borderLeft', 'borderTopColor', 'borderRightColor', 'borderBottomColor', 'borderLeftColor', 'borderTopStyle', 'borderRightStyle', 'borderBottomStyle', 'borderLeftStyle', 'borderTopWidth', 'borderRightWidth', 'borderBottomWidth', 'borderLeftWidth', 'borderWidth', 'bottom', 'captionSide', 'clear', 'clip', 'color', 'content', 'counterIncrement', 'counterReset', 'cue', 'cueAfter', 'cueBefore', 'cursor', 'direction', 'display', 'elevation', 'emptyCells', 'cssFloat', 'font', 'fontFamily', 'fontSize', 'fontSizeAdjust', 'fontStretch', 'fontStyle', 'fontVariant', 'fontWeight', 'height', 'left', 'letterSpacing', 'lineHeight', 'listStyle', 'listStyleImage', 'listStylePosition', 'listStyleType', 'margin', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'markerOffset', 'marks', 'maxHeight', 'maxWidth', 'minHeight', 'minWidth', 'orphans', 'outline', 'outlineColor', 'outlineStyle', 'outlineWidth', 'overflow', 'padding', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'page', 'pageBreakAfter', 'pageBreakBefore', 'pageBreakInside', 'pause', 'pauseAfter', 'pauseBefore', 'pitch', 'pitchRange', 'playDuring', 'position', 'quotes', 'richness', 'right', 'size', 'speak', 'speakHeader', 'speakNumeral', 'speakPunctuation', 'speechRate', 'stress', 'tableLayout', 'textAlign', 'textDecoration', 'textIndent', 'textShadow', 'textTransform', 'top', 'unicodeBidi', 'verticalAlign', 'visibility', 'voiceFamily', 'volume', 'whiteSpace', 'widows', 'width', 'wordSpacing', 'zIndex'];
12
var dashed_properties = properties.map(function (property) {
13
    return camelToDashed(property);
14
});
15

16
module.exports = {
17
    'Verify Has Properties': function (test) {
18
        var style = new cssstyle.CSSStyleDeclaration();
19
        test.expect(properties.length * 2);
20
        properties.forEach(function (property) {
21
            test.ok(style.__lookupGetter__(property), 'missing ' + property + ' property');
22
            test.ok(style.__lookupSetter__(property), 'missing ' + property + ' property');
23
        });
24
        test.done();
25
    },
26
    'Verify Has Dashed Properties': function (test) {
27
        var style = new cssstyle.CSSStyleDeclaration();
28
        test.expect(dashed_properties.length * 2);
29
        dashed_properties.forEach(function (property) {
30
            test.ok(style.__lookupGetter__(property), 'missing ' + property + ' property');
31
            test.ok(style.__lookupSetter__(property), 'missing ' + property + ' property');
32
        });
33
        test.done();
34
    },
35
    'Verify Has Functions': function (test) {
36
        var style = new cssstyle.CSSStyleDeclaration();
37
        test.expect(6);
38
        test.ok(typeof style.getPropertyValue === 'function', 'missing getPropertyValue()');
39
        test.ok(typeof style.getPropertyCSSValue === 'function', 'missing getPropertyCSSValue()');
40
        test.ok(typeof style.removeProperty === 'function', 'missing removeProperty()');
41
        test.ok(typeof style.getPropertyPriority === 'function', 'missing getPropertyPriority()');
42
        test.ok(typeof style.setProperty === 'function', 'missing setProperty()');
43
        test.ok(typeof style.item === 'function', 'missing item()');
44
        test.done();
45
    },
46
    'Verify Has Special Properties': function (test) {
47
        var style = new cssstyle.CSSStyleDeclaration();
48
        test.expect(5);
49
        test.ok(style.__lookupGetter__('cssText'), 'missing cssText getter');
50
        test.ok(style.__lookupSetter__('cssText'), 'missing cssText setter');
51
        test.ok(style.__lookupGetter__('length'), 'missing length getter');
52
        test.ok(style.__lookupSetter__('length'), 'missing length setter');
53
        test.ok(style.__lookupGetter__('parentRule'), 'missing parentRule getter');
54
        test.done();
55
    },
56
    'Test From Style String': function (test) {
57
        var style = new cssstyle.CSSStyleDeclaration();
58
        test.expect(8);
59
        style.cssText = 'color: blue; background-color: red; width: 78%';
60
        test.ok(3 === style.length, 'length is not 3');
61
        test.ok('color: blue; background-color: red; width: 78%;' === style.cssText, 'cssText is wrong');
62
        test.ok('blue' === style.getPropertyValue('color'), "getPropertyValue('color') failed");
63
        test.ok('color' === style.item(0), 'item(0) failed');
64
        test.ok('background-color' === style[1], 'style[1] failed');
65
        test.ok('red' === style.backgroundColor, 'style.backgroundColor failed with "' + style.backgroundColor + '"');
66
        style.cssText = '';
67
        test.ok('' === style.cssText, 'cssText is not empty');
68
        test.ok(0 === style.length, 'length is not 0');
69
        test.done();
70
    },
71
    'Test From Properties': function (test) {
72
        var style = new cssstyle.CSSStyleDeclaration();
73
        test.expect(11);
74
        style.color = 'blue';
75
        test.ok(1 === style.length, 'length is not 1');
76
        test.ok('color' === style[0], 'style[0] is not color');
77
        test.ok('color: blue;' === style.cssText, 'cssText is wrong');
78
        test.ok('color' === style.item(0), 'item(0) is not color');
79
        test.ok('blue' === style.color, 'color is not blue');
80
        style.backgroundColor = 'red';
81
        test.ok(2 === style.length, 'length is not 2');
82
        test.ok('color' === style[0], 'style[0] is not color');
83
        test.ok('background-color' === style[1], 'style[1] is not background-color');
84
        test.ok('color: blue; background-color: red;' === style.cssText, 'cssText is wrong');
85
        test.ok('red' === style.backgroundColor, 'backgroundColor is not red');
86
        style.removeProperty('color');
87
        test.ok('background-color' === style[0], 'style[0] is not background-color');
88
        test.done();
89
    },
90
    'Test Shorthand Properties': function (test) {
91
        var style = new cssstyle.CSSStyleDeclaration();
92
        test.expect(11);
93
        style.background = 'blue url(http://www.example.com/some_img.jpg)';
94
        test.ok('blue' === style.backgroundColor, 'backgroundColor is not blue');
95
        test.ok('url(http://www.example.com/some_img.jpg)' === style.backgroundImage, 'backgroundImage is wrong');
96
        test.ok('blue url(http://www.example.com/some_img.jpg)' === style.background, 'background is different');
97
        style.border = '0 solid black';
98
        test.ok('0px' === style.borderWidth, 'borderWidth is not 0px');
99
        test.ok('solid' === style.borderStyle, 'borderStyle is not solid');
100
        test.ok('black' === style.borderColor, 'borderColor is not black');
101
        test.ok('0px' === style.borderTopWidth, 'borderTopWidth is not 0px');
102
        test.ok('solid' === style.borderLeftStyle, 'borderLeftStyle is not solid');
103
        test.ok('black' === style.borderBottomColor, 'borderBottomColor is not black');
104
        style.font = '12em monospace';
105
        test.ok('12em' === style.fontSize, 'fontSize is not 12em');
106
        test.ok('monospace' === style.fontFamily, 'fontFamily is not monospace');
107
        test.done();
108
    },
109
    'Test width and height Properties and null and empty strings': function (test) {
110
        var style = new cssstyle.CSSStyleDeclaration();
111
        test.expect(7);
112
        style.height = 6;
113
        test.ok('' === style.height, 'height does not remain unset');
114
        style.width = 0;
115
        test.ok('0px' === style.width, 'width is not 0px');
116
        style.height = '34%';
117
        test.ok('34%' === style.height, 'height is not 34%');
118
        style.height = '';
119
        test.ok(style.length === 1, 'length is not 1');
120
        test.ok('width: 0px;' === style.cssText, 'cssText is not "width: 0px;"');
121
        style.width = null;
122
        test.ok(style.length === 0, 'length is not 0');
123
        test.ok('' === style.cssText, 'cssText is not empty string');
124
        test.done();
125
    },
126
    'Test Implicit Properties': function (test) {
127
        var style = new cssstyle.CSSStyleDeclaration();
128
        test.expect(7);
129
        style.borderWidth = 0;
130
        test.ok(1 === style.length, 'length is not 1');
131
        test.ok('0px' === style.borderWidth, 'borderWidth is not 0px');
132
        test.ok('0px' === style.borderTopWidth, 'borderTopWidth is not 0px');
133
        test.ok('0px' === style.borderBottomWidth, 'borderBottomWidth is not 0px');
134
        test.ok('0px' === style.borderLeftWidth, 'borderLeftWidth is not 0px');
135
        test.ok('0px' === style.borderRightWidth, 'borderRightWidth is not 0px');
136
        test.ok('border-width: 0px;' === style.cssText, 'cssText is not "border-width: 0px", "' + style.cssText + '"');
137
        test.done();
138
    },
139
    'Test Top, Left, Right, Bottom Properties': function (test) {
140
        var style = new cssstyle.CSSStyleDeclaration();
141
        test.expect(6);
142
        style.top = 0;
143
        style.left = '0%';
144
        style.right = '5em';
145
        style.bottom = '12pt';
146
        test.ok('0px' === style.top, 'top is not 0px');
147
        test.ok('0%' === style.left, 'left is not 0%');
148
        test.ok('5em' === style.right, 'right is not 5em');
149
        test.ok('12pt' === style.bottom, 'bottom is not 12pt');
150
        test.ok(4 === style.length, 'length is not 4');
151
        test.ok('top: 0px; left: 0%; right: 5em; bottom: 12pt;' === style.cssText, 'text is not "top: 0px; left: 0%; right: 5em; bottom: 12pt;"');
152
        test.done();
153
    },
154
    'Test Clear and Clip Properties': function (test) {
155
        var style = new cssstyle.CSSStyleDeclaration();
156
        test.expect(10);
157
        style.clear = 'none';
158
        test.ok('none' === style.clear, 'clear is not none');
159
        style.clear = 'lfet';   // intentionally wrong
160
        test.ok('none' === style.clear, 'clear is not still none');
161
        style.clear = 'left';
162
        test.ok('left' === style.clear, 'clear is not left');
163
        style.clear = 'right';
164
        test.ok('right' === style.clear, 'clear is not right');
165
        style.clear = 'both';
166
        test.ok('both' === style.clear, 'clear is not both');
167
        style.clip = 'elipse(5px, 10px)';
168
        test.ok('' === style.clip, 'clip should not be set');
169
        test.ok(1 === style.length, 'length is not 1');
170
        style.clip = 'rect(0, 3Em, 2pt, 50%)';
171
        test.ok('rect(0px, 3em, 2pt, 50%)' === style.clip, 'clip is not "rect(0px, 3em, 2pt, 50%)", "' + style.clip + '"');
172
        test.ok(2 === style.length, 'length is not 2');
173
        test.ok('clear: both; clip: rect(0px, 3em, 2pt, 50%);' === style.cssText, 'cssText is not "clear: both; clip: rect(0px, 3em, 2pt, 50%);"');
174
        test.done();
175
    },
176
    'Test colors': function (test) {
177
        var style = new cssstyle.CSSStyleDeclaration();
178
        test.expect(4);
179
        style.color = 'rgba(0,0,0,0)';
180
        test.ok('rgba(0, 0, 0, 0)' === style.color, 'color is not rgba(0, 0, 0, 0)');
181
        style.color = 'rgba(5%, 10%, 20%, 0.4)';
182
        test.ok('rgba(12, 25, 51, 0.4)' === style.color, 'color is not rgba(12, 25, 51, 0.4)');
183
        style.color = 'rgb(33%, 34%, 33%)';
184
        test.ok('rgb(84, 86, 84)' === style.color, 'color is not rgb(84, 86, 84)');
185
        style.color = 'rgba(300, 200, 100, 1.5)';
186
        test.ok('rgb(255, 200, 100)' === style.color, 'color is not rgb(255, 200, 100) ' + style.color);
187
        test.done();
188
    },
189
    'Test short hand properties with embedded spaces': function (test) {
190
        var style = new cssstyle.CSSStyleDeclaration();
191
        test.expect(3);
192
        style.background = 'rgb(0, 0, 0) url(/something/somewhere.jpg)';
193
        test.ok('rgb(0, 0, 0)' === style.backgroundColor, 'backgroundColor is not rgb(0, 0, 0): ' + style.backgroundColor);
194
        test.ok('url(/something/somewhere.jpg)' === style.backgroundImage, 'backgroundImage is not url(/something/somewhere.jpg): ' + style.backgroundImage);
195
        test.ok('background: rgb(0, 0, 0) url(/something/somewhere.jpg);' === style.cssText, 'cssText is not correct: ' + style.cssText);
196
        test.done();
197
    },
198
    'Setting shorthand properties to an empty string should clear all dependent properties': function (test) {
199
        var style = new cssstyle.CSSStyleDeclaration();
200
        test.expect(2);
201
        style.borderWidth = '1px';
202
        test.ok('border-width: 1px;' === style.cssText, 'cssText is not "border-width: 1px;": ' + style.cssText);
203
        style.border = '';
204
        test.ok('' === style.cssText, 'cssText is not "": ' + style.cssText);
205
        test.done();
206
    },
207
    'Setting implicit properties to an empty string should clear all dependent properties': function (test) {
208
        var style = new cssstyle.CSSStyleDeclaration();
209
        test.expect(2);
210
        style.borderTopWidth = '1px';
211
        test.ok('border-top-width: 1px;' === style.cssText, 'cssText is not "border-top-width: 1px;": ' + style.cssText);
212
        style.borderWidth = '';
213
        test.ok('' === style.cssText, 'cssText is not "": ' + style.cssText);
214
        test.done();
215
    },
216
    'Setting a shorthand property, whose shorthands are implicit properties, to an empty string should clear all dependent properties': function (test) {
217
        var style = new cssstyle.CSSStyleDeclaration();
218
        test.expect(4);
219
        style.borderTopWidth = '1px';
220
        test.ok('border-top-width: 1px;' === style.cssText, 'cssText is not "border-top-width: 1px;": ' + style.cssText);
221
        style.border = '';
222
        test.ok('' === style.cssText, 'cssText is not "": ' + style.cssText);
223
        style.borderTop = '1px solid black';
224
        test.ok('border-top: 1px solid black;' === style.cssText, 'cssText is not "border-top: 1px solid black;": ' + style.cssText);
225
        style.border = '';
226
        test.ok('' === style.cssText, 'cssText is not "": ' + style.cssText);
227
        test.done();
228
    },
229
    'Setting border values to "none" should clear dependent values': function (test) {
230
        var style = new cssstyle.CSSStyleDeclaration();
231
        test.expect(8);
232
        style.borderTopWidth = '1px';
233
        test.ok('border-top-width: 1px;' === style.cssText, 'cssText is not "border-top-width: 1px;": ' + style.cssText);
234
        style.border = 'none';
235
        test.ok('' === style.cssText, 'cssText is not "": ' + style.cssText);
236
        style.borderTopWidth = '1px';
237
        test.ok('border-top-width: 1px;' === style.cssText, 'cssText is not "border-top-width: 1px;": ' + style.cssText);
238
        style.borderTopStyle = 'none';
239
        test.ok('' === style.cssText, 'cssText is not "": ' + style.cssText);
240
        style.borderTopWidth = '1px';
241
        test.ok('border-top-width: 1px;' === style.cssText, 'cssText is not "border-top-width: 1px;": ' + style.cssText);
242
        style.borderTop = 'none';
243
        test.ok('' === style.cssText, 'cssText is not "": ' + style.cssText);
244
        style.borderTopWidth = '1px';
245
        style.borderLeftWidth = '1px';
246
        test.ok('border-top-width: 1px; border-left-width: 1px;' === style.cssText, 'cssText is not "border-top-width: 1px; border-left-width: 1px;": ' + style.cssText);
247
        style.borderTop = 'none';
248
        test.ok('border-left-width: 1px;' === style.cssText, 'cssText is not "border-left-width: 1px;": ' + style.cssText);
249
        test.done();
250
    },
251
    'Setting border to 0 should be okay': function (test) {
252
        var style = new cssstyle.CSSStyleDeclaration();
253
        test.expect(1);
254
        style.border = 0;
255
        test.ok('border: 0px;' === style.cssText, 'cssText is not "border: 0px;": ' + style.cssText);
256
        test.done();
257
    },
258
    'Setting values implicit and shorthand properties via cssText and setProperty should propagate to dependent properties': function (test) {
259
        var style = new cssstyle.CSSStyleDeclaration();
260
        test.expect(4);
261
        style.cssText = 'border: 1px solid black;';
262
        test.ok('border: 1px solid black;' === style.cssText, 'cssText is not "border: 1px solid black;": ' + style.cssText);
263
        test.ok('1px solid black' === style.borderTop, 'borderTop is not "1px solid black": ' + style.borderTop);
264
        style.border = '';
265
        test.ok('' === style.cssText, 'cssText is not "": ' + style.cssText);
266
        style.setProperty('border', '1px solid black');
267
        test.ok('border: 1px solid black;' === style.cssText, 'cssText is not "border: 1px solid black;": ' + style.cssText);
268
        test.done();
269
    },
270
    'Setting opacity should work': function (test) {
271
        var style = new cssstyle.CSSStyleDeclaration();
272
        test.expect(3);
273
        style.setProperty('opacity', 0.75);
274
        test.ok('opacity: 0.75;' === style.cssText, 'cssText is not "opacity: 0.75;": ' + style.cssText);
275
        style.opacity = '0.50';
276
        test.ok('opacity: 0.5;' === style.cssText, 'cssText is not "opacity: 0.5;": ' + style.cssText);
277
        style.opacity = 1.0;
278
        test.ok('opacity: 1;' === style.cssText, 'cssText is not "opacity: 1;": ' + style.cssText);
279
        test.done();
280
    },
281
    'Setting a value to 0 should return the string value': function (test) {
282
        var style = new cssstyle.CSSStyleDeclaration();
283
        test.expect(1);
284
        style.setProperty('fill-opacity', 0);
285
        test.ok('0' === style.fillOpacity, 'fillOpacity is not "0": ' + style.fillOpacity);
286
        test.done();
287
    },
288
    'onChange callback should be called when the cssText changes': function (test) {
289
        var style = new cssstyle.CSSStyleDeclaration(function (cssText) {
290
            test.ok('opacity: 0;' === cssText, 'cssText is not "opacity: 0;": ' + cssText);
291
            test.done();
292
        });
293
        test.expect(1);
294
        style.setProperty('opacity', 0);
295
    },
296
    'Setting float should work the same as cssFloat': function (test) {
297
        var style = new cssstyle.CSSStyleDeclaration();
298
        test.expect(1);
299
        style.float = 'left';
300
        test.ok('left' === style.cssFloat, 'cssFloat is not "left": ' + style.cssFloat);
301
        test.done();
302
    },
303
    'Setting improper css to cssText should not throw': function (test) {
304
        var style = new cssstyle.CSSStyleDeclaration();
305
        test.expect(2);
306
        style.cssText = 'color: ';
307
        test.ok('' === style.cssText, 'cssText wasn\'t cleared: ' + style.cssText);
308
        style.color = 'black';
309
        style.cssText = 'float: ';
310
        test.ok('' === style.cssText, 'cssText wasn\'t cleared: ' + style.cssText);
311
        test.done();
312
    }
313
};
314

315
Product

Resources

Company
