Skip to content

Commit 8ea17fa

Browse files
test(attributes-to-props): refactor existing CSS to JS tests
1 parent c3028a7 commit 8ea17fa

File tree

2 files changed

+35
-50
lines changed

2 files changed

+35
-50
lines changed
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`attributes to props style parses CSS to JS 1`] = `
4+
Object {
5+
"style": Object {
6+
"--custom-property": "#f00",
7+
"MozBorderRadiusBottomleft": "20px'",
8+
"WebkitBorderTopRightRadius": "10rem",
9+
"background": "url(data:image/png; base64,ivborw0kggoaaaansaaaabgdbtueaalgpc/xhbqaaaafzmuexurczmzpf399fx1+bm5mzy9avzxbesmgces5/p8/t9furvcrmu73jwlzosgsiizurcjo/ad+eqjjb4hv8bft+idpqocx1wjosbfhh2xssxeiyn3uli/6mnree07uiwjev8u8czwyuqdlkpg1bkb4nnm+veanfhqn1k4+gpt6ugqcvu2h2ovuif)",
10+
"borderBottomLeftRadius": "1em",
11+
"borderRightStyle": "solid",
12+
"color": "#f00",
13+
"fontSize": "42px",
14+
"zIndex": "-1",
15+
},
16+
}
17+
`;

test/attributes-to-props.test.js

Lines changed: 18 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -160,62 +160,30 @@ describe('attributes to props', () => {
160160

161161
// cssToJs
162162
describe('style', () => {
163-
it('parses empty inline style to object', () => {
164-
expect(attributesToProps({ style: '' })).toEqual({ style: {} });
163+
const propsEmptyStyle = { style: {} };
164+
165+
it.each([undefined, null])('does not parse invalid value: %s', style => {
166+
expect(attributesToProps({ style })).toEqual({ style });
165167
});
166168

167169
it('does not parse CSS comment', () => {
168-
expect(attributesToProps({ style: '/* comment */' })).toEqual({
169-
style: {}
170-
});
170+
const style = '/* comment */';
171+
expect(attributesToProps({ style })).toEqual(propsEmptyStyle);
171172
});
172173

173-
it('parses inline style to object', () => {
174-
expect(
175-
attributesToProps({
176-
style:
177-
'color: #f00; font-size: 42px; z-index: -1; -moz-border-radius-topright: 10px; background: url(data:image/png; base64,ivborw0kggoaaaansaaaabgdbtueaalgpc/xhbqaaaafzmuexurczmzpf399fx1+bm5mzy9avzxbesmgces5/p8/t9furvcrmu73jwlzosgsiizurcjo/ad+eqjjb4hv8bft+idpqocx1wjosbfhh2xssxeiyn3uli/6mnree07uiwjev8u8czwyuqdlkpg1bkb4nnm+veanfhqn1k4+gpt6ugqcvu2h2ovuif)'
178-
})
179-
).toEqual({
180-
style: {
181-
color: '#f00',
182-
fontSize: '42px',
183-
zIndex: '-1',
184-
MozBorderRadiusTopright: '10px',
185-
background:
186-
'url(data:image/png; base64,ivborw0kggoaaaansaaaabgdbtueaalgpc/xhbqaaaafzmuexurczmzpf399fx1+bm5mzy9avzxbesmgces5/p8/t9furvcrmu73jwlzosgsiizurcjo/ad+eqjjb4hv8bft+idpqocx1wjosbfhh2xssxeiyn3uli/6mnree07uiwjev8u8czwyuqdlkpg1bkb4nnm+veanfhqn1k4+gpt6ugqcvu2h2ovuif)'
187-
}
188-
});
189-
190-
expect(
191-
attributesToProps({
192-
style:
193-
'border-bottom-left-radius:1em;border-right-style:solid;Z-Index:-1;-moz-border-radius-bottomleft:20px'
194-
})
195-
).toEqual({
196-
style: {
197-
borderBottomLeftRadius: '1em',
198-
borderRightStyle: 'solid',
199-
zIndex: '-1',
200-
MozBorderRadiusBottomleft: '20px'
201-
}
202-
});
203-
204-
expect(
205-
attributesToProps({
206-
style: null
207-
})
208-
).toEqual({
209-
style: null
210-
});
174+
it('parses "" to {}', () => {
175+
const style = '';
176+
expect(attributesToProps({ style })).toEqual(propsEmptyStyle);
177+
});
211178

212-
expect(
213-
attributesToProps({
214-
style: undefined
215-
})
216-
).toEqual({
217-
style: undefined
218-
});
179+
it('parses CSS to JS', () => {
180+
const style = `
181+
color: #f00; font-size: 42px; z-index: -1; -webkit-border-top-right-radius: 10rem; background: url(data:image/png; base64,ivborw0kggoaaaansaaaabgdbtueaalgpc/xhbqaaaafzmuexurczmzpf399fx1+bm5mzy9avzxbesmgces5/p8/t9furvcrmu73jwlzosgsiizurcjo/ad+eqjjb4hv8bft+idpqocx1wjosbfhh2xssxeiyn3uli/6mnree07uiwjev8u8czwyuqdlkpg1bkb4nnm+veanfhqn1k4+gpt6ugqcvu2h2ovuif);
182+
/* display: block; */
183+
--custom-property: #f00;
184+
border-bottom-left-radius:1em;border-right-style:solid;Z-Index:-1;-moz-border-radius-bottomleft:20px'
185+
`;
186+
expect(attributesToProps({ style })).toMatchSnapshot();
219187
});
220188
});
221189

0 commit comments

Comments
 (0)