cssstyle 1.3.0 → 1.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (114) hide show
  1. package/.eslintignore +0 -1
  2. package/.eslintrc.js +0 -5
  3. package/.travis.yml +4 -6
  4. package/{LICENSE → MIT-LICENSE.txt} +0 -0
  5. package/README.md +19 -7
  6. package/lib/allProperties.js +13 -53
  7. package/lib/implementedProperties.js +1 -1
  8. package/lib/parsers.js +4 -15
  9. package/lib/properties/fontSize.js +1 -11
  10. package/lib/properties.js +2 -9
  11. package/package.json +27 -21
  12. package/tests/tests.js +669 -0
  13. package/AUTHORS +0 -31
  14. package/coverage/clover.xml +0 -2150
  15. package/coverage/coverage-final.json +0 -86
  16. package/coverage/lcov-report/base.css +0 -224
  17. package/coverage/lcov-report/block-navigation.js +0 -79
  18. package/coverage/lcov-report/index.html +0 -123
  19. package/coverage/lcov-report/lib/CSSStyleDeclaration.js.html +0 -834
  20. package/coverage/lcov-report/lib/allExtraProperties.js.html +0 -813
  21. package/coverage/lcov-report/lib/allProperties.js.html +0 -1560
  22. package/coverage/lcov-report/lib/constants.js.html +0 -87
  23. package/coverage/lcov-report/lib/index.html +0 -149
  24. package/coverage/lcov-report/lib/parsers.js.html +0 -2193
  25. package/coverage/lcov-report/lib/properties/azimuth.js.html +0 -270
  26. package/coverage/lcov-report/lib/properties/background.js.html +0 -126
  27. package/coverage/lcov-report/lib/properties/backgroundAttachment.js.html +0 -141
  28. package/coverage/lcov-report/lib/properties/backgroundColor.js.html +0 -177
  29. package/coverage/lcov-report/lib/properties/backgroundImage.js.html +0 -165
  30. package/coverage/lcov-report/lib/properties/backgroundPosition.js.html +0 -243
  31. package/coverage/lcov-report/lib/properties/backgroundRepeat.js.html +0 -165
  32. package/coverage/lcov-report/lib/properties/border.js.html +0 -168
  33. package/coverage/lcov-report/lib/properties/borderBottom.js.html +0 -120
  34. package/coverage/lcov-report/lib/properties/borderBottomColor.js.html +0 -117
  35. package/coverage/lcov-report/lib/properties/borderBottomStyle.js.html +0 -132
  36. package/coverage/lcov-report/lib/properties/borderBottomWidth.js.html +0 -117
  37. package/coverage/lcov-report/lib/properties/borderCollapse.js.html +0 -147
  38. package/coverage/lcov-report/lib/properties/borderColor.js.html +0 -159
  39. package/coverage/lcov-report/lib/properties/borderLeft.js.html +0 -120
  40. package/coverage/lcov-report/lib/properties/borderLeftColor.js.html +0 -117
  41. package/coverage/lcov-report/lib/properties/borderLeftStyle.js.html +0 -132
  42. package/coverage/lcov-report/lib/properties/borderLeftWidth.js.html +0 -117
  43. package/coverage/lcov-report/lib/properties/borderRight.js.html +0 -120
  44. package/coverage/lcov-report/lib/properties/borderRightColor.js.html +0 -117
  45. package/coverage/lcov-report/lib/properties/borderRightStyle.js.html +0 -132
  46. package/coverage/lcov-report/lib/properties/borderRightWidth.js.html +0 -117
  47. package/coverage/lcov-report/lib/properties/borderSpacing.js.html +0 -192
  48. package/coverage/lcov-report/lib/properties/borderStyle.js.html +0 -183
  49. package/coverage/lcov-report/lib/properties/borderTop.js.html +0 -120
  50. package/coverage/lcov-report/lib/properties/borderTopColor.js.html +0 -117
  51. package/coverage/lcov-report/lib/properties/borderTopStyle.js.html +0 -132
  52. package/coverage/lcov-report/lib/properties/borderTopWidth.js.html +0 -120
  53. package/coverage/lcov-report/lib/properties/borderWidth.js.html +0 -207
  54. package/coverage/lcov-report/lib/properties/bottom.js.html +0 -111
  55. package/coverage/lcov-report/lib/properties/clear.js.html +0 -117
  56. package/coverage/lcov-report/lib/properties/clip.js.html +0 -210
  57. package/coverage/lcov-report/lib/properties/color.js.html +0 -111
  58. package/coverage/lcov-report/lib/properties/cssFloat.js.html +0 -105
  59. package/coverage/lcov-report/lib/properties/flex.js.html +0 -204
  60. package/coverage/lcov-report/lib/properties/flexBasis.js.html +0 -153
  61. package/coverage/lcov-report/lib/properties/flexGrow.js.html +0 -126
  62. package/coverage/lcov-report/lib/properties/flexShrink.js.html +0 -126
  63. package/coverage/lcov-report/lib/properties/float.js.html +0 -105
  64. package/coverage/lcov-report/lib/properties/floodColor.js.html +0 -111
  65. package/coverage/lcov-report/lib/properties/font.js.html +0 -198
  66. package/coverage/lcov-report/lib/properties/fontFamily.js.html +0 -168
  67. package/coverage/lcov-report/lib/properties/fontSize.js.html +0 -183
  68. package/coverage/lcov-report/lib/properties/fontStyle.js.html +0 -123
  69. package/coverage/lcov-report/lib/properties/fontVariant.js.html +0 -123
  70. package/coverage/lcov-report/lib/properties/fontWeight.js.html +0 -168
  71. package/coverage/lcov-report/lib/properties/height.js.html +0 -141
  72. package/coverage/lcov-report/lib/properties/index.html +0 -1111
  73. package/coverage/lcov-report/lib/properties/left.js.html +0 -111
  74. package/coverage/lcov-report/lib/properties/lightingColor.js.html +0 -111
  75. package/coverage/lcov-report/lib/properties/lineHeight.js.html +0 -147
  76. package/coverage/lcov-report/lib/properties/margin.js.html +0 -273
  77. package/coverage/lcov-report/lib/properties/marginBottom.js.html +0 -108
  78. package/coverage/lcov-report/lib/properties/marginLeft.js.html +0 -108
  79. package/coverage/lcov-report/lib/properties/marginRight.js.html +0 -108
  80. package/coverage/lcov-report/lib/properties/marginTop.js.html +0 -108
  81. package/coverage/lcov-report/lib/properties/opacity.js.html +0 -111
  82. package/coverage/lcov-report/lib/properties/outlineColor.js.html +0 -111
  83. package/coverage/lcov-report/lib/properties/padding.js.html +0 -252
  84. package/coverage/lcov-report/lib/properties/paddingBottom.js.html +0 -108
  85. package/coverage/lcov-report/lib/properties/paddingLeft.js.html +0 -108
  86. package/coverage/lcov-report/lib/properties/paddingRight.js.html +0 -108
  87. package/coverage/lcov-report/lib/properties/paddingTop.js.html +0 -108
  88. package/coverage/lcov-report/lib/properties/right.js.html +0 -111
  89. package/coverage/lcov-report/lib/properties/stopColor.js.html +0 -111
  90. package/coverage/lcov-report/lib/properties/textLineThroughColor.js.html +0 -111
  91. package/coverage/lcov-report/lib/properties/textOverlineColor.js.html +0 -111
  92. package/coverage/lcov-report/lib/properties/textUnderlineColor.js.html +0 -111
  93. package/coverage/lcov-report/lib/properties/top.js.html +0 -111
  94. package/coverage/lcov-report/lib/properties/webkitBorderAfterColor.js.html +0 -111
  95. package/coverage/lcov-report/lib/properties/webkitBorderBeforeColor.js.html +0 -111
  96. package/coverage/lcov-report/lib/properties/webkitBorderEndColor.js.html +0 -111
  97. package/coverage/lcov-report/lib/properties/webkitBorderStartColor.js.html +0 -111
  98. package/coverage/lcov-report/lib/properties/webkitColumnRuleColor.js.html +0 -111
  99. package/coverage/lcov-report/lib/properties/webkitMatchNearestMailBlockquoteColor.js.html +0 -111
  100. package/coverage/lcov-report/lib/properties/webkitTapHighlightColor.js.html +0 -111
  101. package/coverage/lcov-report/lib/properties/webkitTextEmphasisColor.js.html +0 -111
  102. package/coverage/lcov-report/lib/properties/webkitTextFillColor.js.html +0 -111
  103. package/coverage/lcov-report/lib/properties/webkitTextStrokeColor.js.html +0 -111
  104. package/coverage/lcov-report/lib/properties/width.js.html +0 -141
  105. package/coverage/lcov-report/lib/utils/getBasicPropertyDescriptor.js.html +0 -111
  106. package/coverage/lcov-report/lib/utils/index.html +0 -97
  107. package/coverage/lcov-report/prettify.css +0 -1
  108. package/coverage/lcov-report/prettify.js +0 -2
  109. package/coverage/lcov-report/sort-arrow-sprite.png +0 -0
  110. package/coverage/lcov-report/sorter.js +0 -170
  111. package/coverage/lcov.info +0 -3711
  112. package/jest.config.js +0 -10
  113. package/lib/CSSStyleDeclaration.test.js +0 -521
  114. package/lib/parsers.test.js +0 -98
package/jest.config.js DELETED
@@ -1,10 +0,0 @@
1
- module.exports = {
2
- "verbose": true,
3
- "collectCoverage": true,
4
- "collectCoverageFrom": [
5
- "lib/**/*.js",
6
- "!lib/implementedProperties.js",
7
- "!lib/properties.js",
8
- ],
9
- "coverageDirectory": "coverage",
10
- };
@@ -1,521 +0,0 @@
1
- 'use strict';
2
-
3
- var { CSSStyleDeclaration } = require('./CSSStyleDeclaration');
4
-
5
- var allProperties = require('./allProperties');
6
- var allExtraProperties = require('./allExtraProperties');
7
- var implementedProperties = require('./implementedProperties');
8
- var parsers = require('./parsers');
9
-
10
- var dashedProperties = [...allProperties, ...allExtraProperties];
11
- var allowedProperties = dashedProperties.map(parsers.dashedToCamelCase);
12
- implementedProperties = Array.from(implementedProperties).map(parsers.dashedToCamelCase);
13
- var invalidProperties = implementedProperties.filter(prop => !allowedProperties.includes(prop));
14
-
15
- describe('CSSStyleDeclaration', () => {
16
- test('has only valid properties implemented', () => {
17
- expect(invalidProperties.length).toEqual(0);
18
- });
19
-
20
- test('has all properties', () => {
21
- var style = new CSSStyleDeclaration();
22
- allProperties.forEach(property => {
23
- expect(style.__lookupGetter__(property)).toBeTruthy();
24
- expect(style.__lookupSetter__(property)).toBeTruthy();
25
- });
26
- });
27
-
28
- test('has dashed properties', () => {
29
- var style = new CSSStyleDeclaration();
30
- dashedProperties.forEach(property => {
31
- expect(style.__lookupGetter__(property)).toBeTruthy();
32
- expect(style.__lookupSetter__(property)).toBeTruthy();
33
- });
34
- });
35
-
36
- test('has all functions', () => {
37
- var style = new CSSStyleDeclaration();
38
-
39
- expect(typeof style.item).toEqual('function');
40
- expect(typeof style.getPropertyValue).toEqual('function');
41
- expect(typeof style.setProperty).toEqual('function');
42
- expect(typeof style.getPropertyPriority).toEqual('function');
43
- expect(typeof style.removeProperty).toEqual('function');
44
-
45
- // TODO - deprecated according to MDN and not implemented at all, can we remove?
46
- expect(typeof style.getPropertyCSSValue).toEqual('function');
47
- });
48
-
49
- test('has special properties', () => {
50
- var style = new CSSStyleDeclaration();
51
-
52
- expect(style.__lookupGetter__('cssText')).toBeTruthy();
53
- expect(style.__lookupSetter__('cssText')).toBeTruthy();
54
- expect(style.__lookupGetter__('length')).toBeTruthy();
55
- expect(style.__lookupSetter__('length')).toBeTruthy();
56
- expect(style.__lookupGetter__('parentRule')).toBeTruthy();
57
- });
58
-
59
- test('from style string', () => {
60
- var style = new CSSStyleDeclaration();
61
- style.cssText = 'color: blue; background-color: red; width: 78%; height: 50vh;';
62
- expect(style.length).toEqual(4);
63
- expect(style.cssText).toEqual('color: blue; background-color: red; width: 78%; height: 50vh;');
64
- expect(style.getPropertyValue('color')).toEqual('blue');
65
- expect(style.item(0)).toEqual('color');
66
- expect(style[1]).toEqual('background-color');
67
- expect(style.backgroundColor).toEqual('red');
68
- style.cssText = '';
69
- expect(style.cssText).toEqual('');
70
- expect(style.length).toEqual(0);
71
- });
72
-
73
- test('from properties', () => {
74
- var style = new CSSStyleDeclaration();
75
- style.color = 'blue';
76
- expect(style.length).toEqual(1);
77
- expect(style[0]).toEqual('color');
78
- expect(style.cssText).toEqual('color: blue;');
79
- expect(style.item(0)).toEqual('color');
80
- expect(style.color).toEqual('blue');
81
- style.backgroundColor = 'red';
82
- expect(style.length).toEqual(2);
83
- expect(style[0]).toEqual('color');
84
- expect(style[1]).toEqual('background-color');
85
- expect(style.cssText).toEqual('color: blue; background-color: red;');
86
- expect(style.backgroundColor).toEqual('red');
87
- style.removeProperty('color');
88
- expect(style[0]).toEqual('background-color');
89
- });
90
-
91
- test('shorthand properties', () => {
92
- var style = new CSSStyleDeclaration();
93
- style.background = 'blue url(http://www.example.com/some_img.jpg)';
94
- expect(style.backgroundColor).toEqual('blue');
95
- expect(style.backgroundImage).toEqual('url(http://www.example.com/some_img.jpg)');
96
- expect(style.background).toEqual('blue url(http://www.example.com/some_img.jpg)');
97
- style.border = '0 solid black';
98
- expect(style.borderWidth).toEqual('0px');
99
- expect(style.borderStyle).toEqual('solid');
100
- expect(style.borderColor).toEqual('black');
101
- expect(style.borderTopWidth).toEqual('0px');
102
- expect(style.borderLeftStyle).toEqual('solid');
103
- expect(style.borderBottomColor).toEqual('black');
104
- style.font = '12em monospace';
105
- expect(style.fontSize).toEqual('12em');
106
- expect(style.fontFamily).toEqual('monospace');
107
- });
108
-
109
- test('width and height properties and null and empty strings', () => {
110
- var style = new CSSStyleDeclaration();
111
- style.height = 6;
112
- expect(style.height).toEqual('');
113
- style.width = 0;
114
- expect(style.width).toEqual('0px');
115
- style.height = '34%';
116
- expect(style.height).toEqual('34%');
117
- style.height = '100vh';
118
- expect(style.height).toEqual('100vh');
119
- style.height = '100vw';
120
- expect(style.height).toEqual('100vw');
121
- style.height = '';
122
- expect(1).toEqual(style.length);
123
- expect(style.cssText).toEqual('width: 0px;');
124
- style.width = null;
125
- expect(0).toEqual(style.length);
126
- expect(style.cssText).toEqual('');
127
- });
128
-
129
- test('implicit properties', () => {
130
- var style = new CSSStyleDeclaration();
131
- style.borderWidth = 0;
132
- expect(style.length).toEqual(1);
133
- expect(style.borderWidth).toEqual('0px');
134
- expect(style.borderTopWidth).toEqual('0px');
135
- expect(style.borderBottomWidth).toEqual('0px');
136
- expect(style.borderLeftWidth).toEqual('0px');
137
- expect(style.borderRightWidth).toEqual('0px');
138
- expect(style.cssText).toEqual('border-width: 0px;');
139
- });
140
-
141
- test('top, left, right, bottom properties', () => {
142
- var style = new CSSStyleDeclaration();
143
- style.top = 0;
144
- style.left = '0%';
145
- style.right = '5em';
146
- style.bottom = '12pt';
147
- expect(style.top).toEqual('0px');
148
- expect(style.left).toEqual('0%');
149
- expect(style.right).toEqual('5em');
150
- expect(style.bottom).toEqual('12pt');
151
- expect(style.length).toEqual(4);
152
- expect(style.cssText).toEqual('top: 0px; left: 0%; right: 5em; bottom: 12pt;');
153
- });
154
-
155
- test('clear and clip properties', () => {
156
- var style = new CSSStyleDeclaration();
157
- style.clear = 'none';
158
- expect(style.clear).toEqual('none');
159
- style.clear = 'lfet';
160
- expect(style.clear).toEqual('none');
161
- style.clear = 'left';
162
- expect(style.clear).toEqual('left');
163
- style.clear = 'right';
164
- expect(style.clear).toEqual('right');
165
- style.clear = 'both';
166
- expect(style.clear).toEqual('both');
167
- style.clip = 'elipse(5px, 10px)';
168
- expect(style.clip).toEqual('');
169
- expect(style.length).toEqual(1);
170
- style.clip = 'rect(0, 3Em, 2pt, 50%)';
171
- expect(style.clip).toEqual('rect(0px, 3em, 2pt, 50%)');
172
- expect(style.length).toEqual(2);
173
- expect(style.cssText).toEqual('clear: both; clip: rect(0px, 3em, 2pt, 50%);');
174
- });
175
-
176
- test('colors', () => {
177
- var style = new CSSStyleDeclaration();
178
- style.color = 'rgba(0,0,0,0)';
179
- expect(style.color).toEqual('rgba(0, 0, 0, 0)');
180
- style.color = 'rgba(5%, 10%, 20%, 0.4)';
181
- expect(style.color).toEqual('rgba(12, 25, 51, 0.4)');
182
- style.color = 'rgb(33%, 34%, 33%)';
183
- expect(style.color).toEqual('rgb(84, 86, 84)');
184
- style.color = 'rgba(300, 200, 100, 1.5)';
185
- expect(style.color).toEqual('rgb(255, 200, 100)');
186
- style.color = 'hsla(0, 1%, 2%, 0.5)';
187
- expect(style.color).toEqual('hsla(0, 1%, 2%, 0.5)');
188
- style.color = 'hsl(0, 1%, 2%)';
189
- expect(style.color).toEqual('hsl(0, 1%, 2%)');
190
- style.color = 'rebeccapurple';
191
- expect(style.color).toEqual('rebeccapurple');
192
- style.color = 'transparent';
193
- expect(style.color).toEqual('transparent');
194
- style.color = 'currentcolor';
195
- expect(style.color).toEqual('currentcolor');
196
- style.color = '#ffffffff';
197
- expect(style.color).toEqual('rgba(255, 255, 255, 1)');
198
- style.color = '#fffa';
199
- expect(style.color).toEqual('rgba(255, 255, 255, 0.667)');
200
- style.color = '#ffffff66';
201
- expect(style.color).toEqual('rgba(255, 255, 255, 0.4)');
202
- });
203
-
204
- test('short hand properties with embedded spaces', () => {
205
- var style = new CSSStyleDeclaration();
206
- style.background = 'rgb(0, 0, 0) url(/something/somewhere.jpg)';
207
- expect(style.backgroundColor).toEqual('rgb(0, 0, 0)');
208
- expect(style.backgroundImage).toEqual('url(/something/somewhere.jpg)');
209
- expect(style.cssText).toEqual('background: rgb(0, 0, 0) url(/something/somewhere.jpg);');
210
- style = new CSSStyleDeclaration();
211
- style.border = ' 1px solid black ';
212
- expect(style.border).toEqual('1px solid black');
213
- });
214
-
215
- test('setting shorthand properties to an empty string should clear all dependent properties', () => {
216
- var style = new CSSStyleDeclaration();
217
- style.borderWidth = '1px';
218
- expect(style.cssText).toEqual('border-width: 1px;');
219
- style.border = '';
220
- expect(style.cssText).toEqual('');
221
- });
222
-
223
- test('setting implicit properties to an empty string should clear all dependent properties', () => {
224
- var style = new CSSStyleDeclaration();
225
- style.borderTopWidth = '1px';
226
- expect(style.cssText).toEqual('border-top-width: 1px;');
227
- style.borderWidth = '';
228
- expect(style.cssText).toEqual('');
229
- });
230
-
231
- test('setting a shorthand property, whose shorthands are implicit properties, to an empty string should clear all dependent properties', () => {
232
- var style = new CSSStyleDeclaration();
233
- style.borderTopWidth = '1px';
234
- expect(style.cssText).toEqual('border-top-width: 1px;');
235
- style.border = '';
236
- expect(style.cssText).toEqual('');
237
- style.borderTop = '1px solid black';
238
- expect(style.cssText).toEqual('border-top: 1px solid black;');
239
- style.border = '';
240
- expect(style.cssText).toEqual('');
241
- });
242
-
243
- test('setting border values to "none" should clear dependent values', () => {
244
- var style = new CSSStyleDeclaration();
245
- style.borderTopWidth = '1px';
246
- expect(style.cssText).toEqual('border-top-width: 1px;');
247
- style.border = 'none';
248
- expect(style.cssText).toEqual('');
249
- style.borderTopWidth = '1px';
250
- expect(style.cssText).toEqual('border-top-width: 1px;');
251
- style.borderTopStyle = 'none';
252
- expect(style.cssText).toEqual('');
253
- style.borderTopWidth = '1px';
254
- expect(style.cssText).toEqual('border-top-width: 1px;');
255
- style.borderTop = 'none';
256
- expect(style.cssText).toEqual('');
257
- style.borderTopWidth = '1px';
258
- style.borderLeftWidth = '1px';
259
- expect(style.cssText).toEqual('border-top-width: 1px; border-left-width: 1px;');
260
- style.borderTop = 'none';
261
- expect(style.cssText).toEqual('border-left-width: 1px;');
262
- });
263
-
264
- test('setting border to 0 should be okay', () => {
265
- var style = new CSSStyleDeclaration();
266
- style.border = 0;
267
- expect(style.cssText).toEqual('border: 0px;');
268
- });
269
-
270
- test('setting values implicit and shorthand properties via csstext and setproperty should propagate to dependent properties', () => {
271
- var style = new CSSStyleDeclaration();
272
- style.cssText = 'border: 1px solid black;';
273
- expect(style.cssText).toEqual('border: 1px solid black;');
274
- expect(style.borderTop).toEqual('1px solid black');
275
- style.border = '';
276
- expect(style.cssText).toEqual('');
277
- style.setProperty('border', '1px solid black');
278
- expect(style.cssText).toEqual('border: 1px solid black;');
279
- });
280
-
281
- test('setting opacity should work', () => {
282
- var style = new CSSStyleDeclaration();
283
- style.setProperty('opacity', 0.75);
284
- expect(style.cssText).toEqual('opacity: 0.75;');
285
- style.opacity = '0.50';
286
- expect(style.cssText).toEqual('opacity: 0.5;');
287
- style.opacity = 1;
288
- expect(style.cssText).toEqual('opacity: 1;');
289
- });
290
-
291
- test('width and height of auto should work', () => {
292
- var style = new CSSStyleDeclaration();
293
- style.width = 'auto';
294
- expect(style.cssText).toEqual('width: auto;');
295
- expect(style.width).toEqual('auto');
296
- style = new CSSStyleDeclaration();
297
- style.height = 'auto';
298
- expect(style.cssText).toEqual('height: auto;');
299
- expect(style.height).toEqual('auto');
300
- });
301
-
302
- test('padding and margin should set/clear shorthand properties', () => {
303
- var style = new CSSStyleDeclaration();
304
- var parts = ['Top', 'Right', 'Bottom', 'Left'];
305
- var testParts = function(name, v, V) {
306
- style[name] = v;
307
- for (var i = 0; i < 4; i++) {
308
- var part = name + parts[i];
309
- expect(style[part]).toEqual(V[i]);
310
- }
311
-
312
- expect(style[name]).toEqual(v);
313
- style[name] = '';
314
- };
315
- testParts('padding', '1px', ['1px', '1px', '1px', '1px']);
316
- testParts('padding', '1px 2%', ['1px', '2%', '1px', '2%']);
317
- testParts('padding', '1px 2px 3px', ['1px', '2px', '3px', '2px']);
318
- testParts('padding', '1px 2px 3px 4px', ['1px', '2px', '3px', '4px']);
319
- style.paddingTop = style.paddingRight = style.paddingBottom = style.paddingLeft = '1px';
320
- testParts('padding', '', ['', '', '', '']);
321
- testParts('margin', '1px', ['1px', '1px', '1px', '1px']);
322
- testParts('margin', '1px auto', ['1px', 'auto', '1px', 'auto']);
323
- testParts('margin', '1px 2% 3px', ['1px', '2%', '3px', '2%']);
324
- testParts('margin', '1px 2px 3px 4px', ['1px', '2px', '3px', '4px']);
325
- style.marginTop = style.marginRight = style.marginBottom = style.marginLeft = '1px';
326
- testParts('margin', '', ['', '', '', '']);
327
- });
328
-
329
- test('padding and margin shorthands should set main properties', () => {
330
- var style = new CSSStyleDeclaration();
331
- var parts = ['Top', 'Right', 'Bottom', 'Left'];
332
- var testParts = function(name, v, V) {
333
- var expected;
334
- for (var i = 0; i < 4; i++) {
335
- style[name] = v;
336
- style[name + parts[i]] = V;
337
- expected = v.split(/ /);
338
- expected[i] = V;
339
- expected = expected.join(' ');
340
-
341
- expect(style[name]).toEqual(expected);
342
- }
343
- };
344
- testParts('padding', '1px 2px 3px 4px', '10px');
345
- testParts('margin', '1px 2px 3px 4px', '10px');
346
- testParts('margin', '1px 2px 3px 4px', 'auto');
347
- });
348
-
349
- test('setting a value to 0 should return the string value', () => {
350
- var style = new CSSStyleDeclaration();
351
- style.setProperty('fill-opacity', 0);
352
- expect(style.fillOpacity).toEqual('0');
353
- });
354
-
355
- test('onchange callback should be called when the csstext changes', () => {
356
- var style = new CSSStyleDeclaration(function(cssText) {
357
- expect(cssText).toEqual('opacity: 0;');
358
- });
359
- style.setProperty('opacity', 0);
360
- });
361
-
362
- test('setting float should work the same as cssfloat', () => {
363
- var style = new CSSStyleDeclaration();
364
- style.float = 'left';
365
- expect(style.cssFloat).toEqual('left');
366
- });
367
-
368
- test('setting improper css to csstext should not throw', () => {
369
- var style = new CSSStyleDeclaration();
370
- style.cssText = 'color: ';
371
- expect(style.cssText).toEqual('');
372
- style.color = 'black';
373
- style.cssText = 'float: ';
374
- expect(style.cssText).toEqual('');
375
- });
376
-
377
- test('url parsing works with quotes', () => {
378
- var style = new CSSStyleDeclaration();
379
- style.backgroundImage = 'url(http://some/url/here1.png)';
380
- expect(style.backgroundImage).toEqual('url(http://some/url/here1.png)');
381
- style.backgroundImage = "url('http://some/url/here2.png')";
382
- expect(style.backgroundImage).toEqual('url(http://some/url/here2.png)');
383
- style.backgroundImage = 'url("http://some/url/here3.png")';
384
- expect(style.backgroundImage).toEqual('url(http://some/url/here3.png)');
385
- });
386
-
387
- test('setting 0 to a padding or margin works', () => {
388
- var style = new CSSStyleDeclaration();
389
- style.padding = 0;
390
- expect(style.cssText).toEqual('padding: 0px;');
391
- style.margin = '1em';
392
- style.marginTop = '0';
393
- expect(style.marginTop).toEqual('0px');
394
- });
395
-
396
- test('setting ex units to a padding or margin works', () => {
397
- var style = new CSSStyleDeclaration();
398
- style.padding = '1ex';
399
- expect(style.cssText).toEqual('padding: 1ex;');
400
- style.margin = '1em';
401
- style.marginTop = '0.5ex';
402
- expect(style.marginTop).toEqual('0.5ex');
403
- });
404
-
405
- test('setting null to background works', () => {
406
- var style = new CSSStyleDeclaration();
407
- style.background = 'red';
408
- expect(style.cssText).toEqual('background: red;');
409
- style.background = null;
410
- expect(style.cssText).toEqual('');
411
- });
412
-
413
- test('flex properties should keep their values', () => {
414
- var style = new CSSStyleDeclaration();
415
- style.flexDirection = 'column';
416
- expect(style.cssText).toEqual('flex-direction: column;');
417
- style.flexDirection = 'row';
418
- expect(style.cssText).toEqual('flex-direction: row;');
419
- });
420
-
421
- test('camelcase properties are not assigned with `.setproperty()`', () => {
422
- var style = new CSSStyleDeclaration();
423
- style.setProperty('fontSize', '12px');
424
- expect(style.cssText).toEqual('');
425
- });
426
-
427
- test('casing is ignored in `.setproperty()`', () => {
428
- var style = new CSSStyleDeclaration();
429
- style.setProperty('FoNt-SiZe', '12px');
430
- expect(style.fontSize).toEqual('12px');
431
- expect(style.getPropertyValue('font-size')).toEqual('12px');
432
- });
433
-
434
- test('support non string entries in border-spacing', () => {
435
- var style = new CSSStyleDeclaration();
436
- style.borderSpacing = 0;
437
- expect(style.cssText).toEqual('border-spacing: 0px;');
438
- });
439
-
440
- test('float should be valid property for `.setproperty()`', () => {
441
- var style = new CSSStyleDeclaration();
442
- style.setProperty('float', 'left');
443
- expect(style.float).toEqual('left');
444
- expect(style.getPropertyValue('float')).toEqual('left');
445
- });
446
-
447
- test('flex-shrink works', () => {
448
- var style = new CSSStyleDeclaration();
449
- style.setProperty('flex-shrink', 0);
450
- expect(style.getPropertyValue('flex-shrink')).toEqual('0');
451
- style.setProperty('flex-shrink', 1);
452
- expect(style.getPropertyValue('flex-shrink')).toEqual('1');
453
- expect(style.cssText).toEqual('flex-shrink: 1;');
454
- });
455
-
456
- test('flex-grow works', () => {
457
- var style = new CSSStyleDeclaration();
458
- style.setProperty('flex-grow', 2);
459
- expect(style.getPropertyValue('flex-grow')).toEqual('2');
460
- expect(style.cssText).toEqual('flex-grow: 2;');
461
- });
462
-
463
- test('flex-basis works', () => {
464
- var style = new CSSStyleDeclaration();
465
- style.setProperty('flex-basis', 0);
466
- expect(style.getPropertyValue('flex-basis')).toEqual('0px');
467
- style.setProperty('flex-basis', '250px');
468
- expect(style.getPropertyValue('flex-basis')).toEqual('250px');
469
- style.setProperty('flex-basis', '10em');
470
- expect(style.getPropertyValue('flex-basis')).toEqual('10em');
471
- style.setProperty('flex-basis', '30%');
472
- expect(style.getPropertyValue('flex-basis')).toEqual('30%');
473
- expect(style.cssText).toEqual('flex-basis: 30%;');
474
- });
475
-
476
- test('shorthand flex works', () => {
477
- var style = new CSSStyleDeclaration();
478
- style.setProperty('flex', 'none');
479
- expect(style.getPropertyValue('flex-grow')).toEqual('0');
480
- expect(style.getPropertyValue('flex-shrink')).toEqual('0');
481
- expect(style.getPropertyValue('flex-basis')).toEqual('auto');
482
- style.removeProperty('flex');
483
- style.removeProperty('flex-basis');
484
- style.setProperty('flex', 'auto');
485
- expect(style.getPropertyValue('flex-grow')).toEqual('');
486
- expect(style.getPropertyValue('flex-shrink')).toEqual('');
487
- expect(style.getPropertyValue('flex-basis')).toEqual('auto');
488
- style.removeProperty('flex');
489
- style.setProperty('flex', '0 1 250px');
490
- expect(style.getPropertyValue('flex')).toEqual('0 1 250px');
491
- expect(style.getPropertyValue('flex-grow')).toEqual('0');
492
- expect(style.getPropertyValue('flex-shrink')).toEqual('1');
493
- expect(style.getPropertyValue('flex-basis')).toEqual('250px');
494
- style.removeProperty('flex');
495
- style.setProperty('flex', '2');
496
- expect(style.getPropertyValue('flex-grow')).toEqual('2');
497
- expect(style.getPropertyValue('flex-shrink')).toEqual('');
498
- expect(style.getPropertyValue('flex-basis')).toEqual('');
499
- style.removeProperty('flex');
500
- style.setProperty('flex', '20%');
501
- expect(style.getPropertyValue('flex-grow')).toEqual('');
502
- expect(style.getPropertyValue('flex-shrink')).toEqual('');
503
- expect(style.getPropertyValue('flex-basis')).toEqual('20%');
504
- style.removeProperty('flex');
505
- style.setProperty('flex', '2 2');
506
- expect(style.getPropertyValue('flex-grow')).toEqual('2');
507
- expect(style.getPropertyValue('flex-shrink')).toEqual('2');
508
- expect(style.getPropertyValue('flex-basis')).toEqual('');
509
- style.removeProperty('flex');
510
- });
511
-
512
- test('font-size get a valid value', () => {
513
- var style = new CSSStyleDeclaration();
514
- const invalidValue = '1r5px';
515
- style.cssText = 'font-size: 15px';
516
- expect(1).toEqual(style.length);
517
- style.cssText = `font-size: ${invalidValue}`;
518
- expect(0).toEqual(style.length);
519
- expect(undefined).toEqual(style[0]);
520
- });
521
- });
@@ -1,98 +0,0 @@
1
- 'use strict';
2
-
3
- const parsers = require('./parsers');
4
-
5
- describe('valueType', () => {
6
- it('returns color for red', () => {
7
- let input = 'red';
8
- let output = parsers.valueType(input);
9
-
10
- expect(output).toEqual(parsers.TYPES.COLOR);
11
- });
12
-
13
- it('returns color for #nnnnnn', () => {
14
- let input = '#fefefe';
15
- let output = parsers.valueType(input);
16
-
17
- expect(output).toEqual(parsers.TYPES.COLOR);
18
- });
19
-
20
- it('returns color for rgb(n, n, n)', () => {
21
- let input = 'rgb(10, 10, 10)';
22
- let output = parsers.valueType(input);
23
-
24
- expect(output).toEqual(parsers.TYPES.COLOR);
25
- });
26
-
27
- it('returns color for rgb(p, p, p)', () => {
28
- let input = 'rgb(10%, 10%, 10%)';
29
- let output = parsers.valueType(input);
30
-
31
- expect(output).toEqual(parsers.TYPES.COLOR);
32
- });
33
-
34
- it('returns color for rgba(n, n, n, n)', () => {
35
- let input = 'rgba(10, 10, 10, 1)';
36
- let output = parsers.valueType(input);
37
-
38
- expect(output).toEqual(parsers.TYPES.COLOR);
39
- });
40
-
41
- it('returns color for rgba(p, p, p, n)', () => {
42
- let input = 'rgba(10%, 10%, 10%, 1)';
43
- let output = parsers.valueType(input);
44
-
45
- expect(output).toEqual(parsers.TYPES.COLOR);
46
- });
47
- });
48
- describe('parseInteger', () => {
49
- it.todo('test');
50
- });
51
- describe('parseNumber', () => {
52
- it.todo('test');
53
- });
54
- describe('parseLength', () => {
55
- it.todo('test');
56
- });
57
- describe('parsePercent', () => {
58
- it.todo('test');
59
- });
60
- describe('parseMeasurement', () => {
61
- it.todo('test');
62
- });
63
- describe('parseUrl', () => {
64
- it.todo('test');
65
- });
66
- describe('parseString', () => {
67
- it.todo('test');
68
- });
69
- describe('parseColor', () => {
70
- it.todo('test');
71
- });
72
- describe('parseAngle', () => {
73
- it.todo('test');
74
- });
75
- describe('parseKeyword', () => {
76
- it.todo('test');
77
- });
78
- describe('dashedToCamelCase', () => {
79
- it.todo('test');
80
- });
81
- describe('shorthandParser', () => {
82
- it.todo('test');
83
- });
84
- describe('shorthandSetter', () => {
85
- it.todo('test');
86
- });
87
- describe('shorthandGetter', () => {
88
- it.todo('test');
89
- });
90
- describe('implicitSetter', () => {
91
- it.todo('test');
92
- });
93
- describe('subImplicitSetter', () => {
94
- it.todo('test');
95
- });
96
- describe('camelToDashed', () => {
97
- it.todo('test');
98
- });