Skip to content

Commit

Permalink
chore: improve jest tests with more precise assertions (#1912)
Browse files Browse the repository at this point in the history
  • Loading branch information
jdufresne committed Dec 28, 2023
1 parent db05c57 commit f6a2ca2
Show file tree
Hide file tree
Showing 10 changed files with 149 additions and 137 deletions.
44 changes: 22 additions & 22 deletions lib/path.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,55 +8,55 @@ const { parsePathData, stringifyPathData } = require('./path.js');

describe('parse path data', () => {
it('should allow spaces between commands', () => {
expect(parsePathData('M0 10 L \n\r\t20 30')).toEqual([
expect(parsePathData('M0 10 L \n\r\t20 30')).toStrictEqual([
{ command: 'M', args: [0, 10] },
{ command: 'L', args: [20, 30] },
]);
});
it('should allow spaces and commas between arguments', () => {
expect(parsePathData('M0 , 10 L 20 \n\r\t30,40,50')).toEqual([
expect(parsePathData('M0 , 10 L 20 \n\r\t30,40,50')).toStrictEqual([
{ command: 'M', args: [0, 10] },
{ command: 'L', args: [20, 30] },
{ command: 'L', args: [40, 50] },
]);
});
it('should forbid commas before commands', () => {
expect(parsePathData(', M0 10')).toEqual([]);
expect(parsePathData(', M0 10')).toStrictEqual([]);
});
it('should forbid commas between commands', () => {
expect(parsePathData('M0,10 , L 20,30')).toEqual([
expect(parsePathData('M0,10 , L 20,30')).toStrictEqual([
{ command: 'M', args: [0, 10] },
]);
});
it('should forbid commas between command name and argument', () => {
expect(parsePathData('M0,10 L,20,30')).toEqual([
expect(parsePathData('M0,10 L,20,30')).toStrictEqual([
{ command: 'M', args: [0, 10] },
]);
});
it('should forbid multiple commas in a row', () => {
expect(parsePathData('M0 , , 10')).toEqual([]);
expect(parsePathData('M0 , , 10')).toStrictEqual([]);
});
it('should stop when unknown char appears', () => {
expect(parsePathData('M0 10 , L 20 #40')).toEqual([
expect(parsePathData('M0 10 , L 20 #40')).toStrictEqual([
{ command: 'M', args: [0, 10] },
]);
});
it('should stop when not enough arguments', () => {
expect(parsePathData('M0 10 L 20 L 30 40')).toEqual([
expect(parsePathData('M0 10 L 20 L 30 40')).toStrictEqual([
{ command: 'M', args: [0, 10] },
]);
});
it('should stop if moveto not the first command', () => {
expect(parsePathData('L 10 20')).toEqual([]);
expect(parsePathData('10 20')).toEqual([]);
expect(parsePathData('L 10 20')).toStrictEqual([]);
expect(parsePathData('10 20')).toStrictEqual([]);
});
it('should stop on invalid scientific notation', () => {
expect(parsePathData('M 0 5e++1 L 0 0')).toEqual([
expect(parsePathData('M 0 5e++1 L 0 0')).toStrictEqual([
{ command: 'M', args: [0, 5] },
]);
});
it('should stop on invalid numbers', () => {
expect(parsePathData('M ...')).toEqual([]);
expect(parsePathData('M ...')).toStrictEqual([]);
});
it('should handle arcs', () => {
expect(
Expand All @@ -71,7 +71,7 @@ describe('parse path data', () => {
l 50,-25
`,
),
).toEqual([
).toStrictEqual([
{ command: 'M', args: [600, 350] },
{ command: 'l', args: [50, -25] },
{ command: 'a', args: [25, 25, -30, 0, 1, 50, -25] },
Expand All @@ -96,7 +96,7 @@ describe('stringify path data', () => {
{ command: 'H', args: [50] },
],
}),
).toEqual('M0 0h10 20 30H40 50');
).toBe('M0 0h10 20 30H40 50');
});
it('should not combine sequence of moveto', () => {
expect(
Expand All @@ -108,7 +108,7 @@ describe('stringify path data', () => {
{ command: 'm', args: [40, 50] },
],
}),
).toEqual('M0 0M10 10m20 30m40 50');
).toBe('M0 0M10 10m20 30m40 50');
});
it('should combine moveto and sequence of lineto', () => {
expect(
Expand All @@ -122,15 +122,15 @@ describe('stringify path data', () => {
{ command: 'L', args: [10, 10] },
],
}),
).toEqual('m0 0 10 10M0 0l10 10M0 0 10 10');
).toBe('m0 0 10 10M0 0l10 10M0 0 10 10');
expect(
stringifyPathData({
pathData: [
{ command: 'm', args: [0, 0] },
{ command: 'L', args: [10, 10] },
],
}),
).toEqual('M0 0 10 10');
).toBe('M0 0 10 10');
});
it('should avoid space before first, negative and decimals', () => {
expect(
Expand All @@ -142,7 +142,7 @@ describe('stringify path data', () => {
{ command: 'L', args: [7, 0.8] },
],
}),
).toEqual('M0-1.2.3 4 5-.6 7 .8');
).toBe('M0-1.2.3 4 5-.6 7 .8');
});
it('should configure precision', () => {
/**
Expand All @@ -159,13 +159,13 @@ describe('stringify path data', () => {
pathData,
precision: 3,
}),
).toEqual('M0-1.988.3 3.142-.3-3.142 100 200');
).toBe('M0-1.988.3 3.142-.3-3.142 100 200');
expect(
stringifyPathData({
pathData,
precision: 0,
}),
).toEqual('M0-2 0 3 0-3 100 200');
).toBe('M0-2 0 3 0-3 100 200');
});
it('allows to avoid spaces after arc flags', () => {
/**
Expand All @@ -182,12 +182,12 @@ describe('stringify path data', () => {
pathData,
disableSpaceAfterFlags: false,
}),
).toEqual('M0 0A50 50 10 1 0 .2 20a50 50 10 1 0 .2 20 50 50 10 1 0 .2 20');
).toBe('M0 0A50 50 10 1 0 .2 20a50 50 10 1 0 .2 20 50 50 10 1 0 .2 20');
expect(
stringifyPathData({
pathData,
disableSpaceAfterFlags: true,
}),
).toEqual('M0 0A50 50 10 10.2 20a50 50 10 10.2 20 50 50 10 10.2 20');
).toBe('M0 0A50 50 10 10.2 20a50 50 10 10.2 20 50 50 10 10.2 20');
});
});
102 changes: 61 additions & 41 deletions lib/style.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -58,31 +58,35 @@ it('collects styles', () => {
</svg>
`);
const stylesheet = collectStylesheet(root);
expect(computeStyle(stylesheet, getElementById(root, 'class'))).toEqual({
fill: { type: 'static', inherited: false, value: 'red' },
});
expect(computeStyle(stylesheet, getElementById(root, 'two-classes'))).toEqual(
expect(computeStyle(stylesheet, getElementById(root, 'class'))).toStrictEqual(
{
fill: { type: 'static', inherited: false, value: 'green' },
stroke: { type: 'static', inherited: false, value: 'black' },
fill: { type: 'static', inherited: false, value: 'red' },
},
);
expect(computeStyle(stylesheet, getElementById(root, 'attribute'))).toEqual({
expect(
computeStyle(stylesheet, getElementById(root, 'two-classes')),
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'green' },
stroke: { type: 'static', inherited: false, value: 'black' },
});
expect(
computeStyle(stylesheet, getElementById(root, 'attribute')),
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'purple' },
});
expect(
computeStyle(stylesheet, getElementById(root, 'inline-style')),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'grey' },
});
expect(computeStyle(stylesheet, getElementById(root, 'inheritance'))).toEqual(
{
fill: { type: 'static', inherited: true, value: 'yellow' },
},
);
expect(
computeStyle(stylesheet, getElementById(root, 'inheritance')),
).toStrictEqual({
fill: { type: 'static', inherited: true, value: 'yellow' },
});
expect(
computeStyle(stylesheet, getElementById(root, 'nested-inheritance')),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: true, value: 'blue' },
});
});
Expand All @@ -107,33 +111,33 @@ it('prioritizes different kinds of styles', () => {
const stylesheet = collectStylesheet(root);
expect(
computeStyle(stylesheet, getElementById(root, 'complex-selector')),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'red' },
});
expect(
computeStyle(stylesheet, getElementById(root, 'override-selector')),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'blue' },
});
expect(
computeStyle(
stylesheet,
getElementById(root, 'attribute-over-inheritance'),
),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'orange' },
});
expect(
computeStyle(stylesheet, getElementById(root, 'style-rule-over-attribute')),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'blue' },
});
expect(
computeStyle(
stylesheet,
getElementById(root, 'inline-style-over-style-rule'),
),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'purple' },
});
});
Expand All @@ -153,23 +157,23 @@ it('prioritizes important styles', () => {
const stylesheet = collectStylesheet(root);
expect(
computeStyle(stylesheet, getElementById(root, 'complex-selector')),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'green' },
});
expect(
computeStyle(
stylesheet,
getElementById(root, 'style-rule-over-inline-style'),
),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'green' },
});
expect(
computeStyle(
stylesheet,
getElementById(root, 'inline-style-over-style-rule'),
),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'purple' },
});
});
Expand All @@ -195,23 +199,29 @@ it('treats at-rules and pseudo-classes as dynamic styles', () => {
</svg>
`);
const stylesheet = collectStylesheet(root);
expect(computeStyle(stylesheet, getElementById(root, 'media-query'))).toEqual(
expect(
computeStyle(stylesheet, getElementById(root, 'media-query')),
).toStrictEqual({
fill: { type: 'dynamic', inherited: false },
});
expect(computeStyle(stylesheet, getElementById(root, 'hover'))).toStrictEqual(
{
fill: { type: 'dynamic', inherited: false },
},
);
expect(computeStyle(stylesheet, getElementById(root, 'hover'))).toEqual({
fill: { type: 'dynamic', inherited: false },
});
expect(computeStyle(stylesheet, getElementById(root, 'inherited'))).toEqual({
expect(
computeStyle(stylesheet, getElementById(root, 'inherited')),
).toStrictEqual({
fill: { type: 'dynamic', inherited: true },
});
expect(
computeStyle(stylesheet, getElementById(root, 'inherited-overriden')),
).toEqual({
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'blue' },
});
expect(computeStyle(stylesheet, getElementById(root, 'static'))).toEqual({
expect(
computeStyle(stylesheet, getElementById(root, 'static')),
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'black' },
});
});
Expand All @@ -234,17 +244,19 @@ it('considers <style> media attribute', () => {
</svg>
`);
const stylesheet = collectStylesheet(root);
expect(computeStyle(stylesheet, getElementById(root, 'media-query'))).toEqual(
{
fill: { type: 'dynamic', inherited: false },
},
);
expect(
computeStyle(stylesheet, getElementById(root, 'media-query')),
).toStrictEqual({
fill: { type: 'dynamic', inherited: false },
});
expect(
computeStyle(stylesheet, getElementById(root, 'kinda-static')),
).toEqual({
).toStrictEqual({
fill: { type: 'dynamic', inherited: false },
});
expect(computeStyle(stylesheet, getElementById(root, 'static'))).toEqual({
expect(
computeStyle(stylesheet, getElementById(root, 'static')),
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'blue' },
});
});
Expand All @@ -267,15 +279,19 @@ it('ignores <style> with invalid type', () => {
</svg>
`);
const stylesheet = collectStylesheet(root);
expect(computeStyle(stylesheet, getElementById(root, 'valid-type'))).toEqual({
expect(
computeStyle(stylesheet, getElementById(root, 'valid-type')),
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'red' },
});
expect(computeStyle(stylesheet, getElementById(root, 'empty-type'))).toEqual({
expect(
computeStyle(stylesheet, getElementById(root, 'empty-type')),
).toStrictEqual({
fill: { type: 'static', inherited: false, value: 'green' },
});
expect(
computeStyle(stylesheet, getElementById(root, 'invalid-type')),
).toEqual({});
).toStrictEqual({});
});

it('ignores keyframes atrule', () => {
Expand All @@ -301,7 +317,9 @@ it('ignores keyframes atrule', () => {
</svg>
`);
const stylesheet = collectStylesheet(root);
expect(computeStyle(stylesheet, getElementById(root, 'element'))).toEqual({
expect(
computeStyle(stylesheet, getElementById(root, 'element')),
).toStrictEqual({
animation: {
type: 'static',
inherited: false,
Expand Down Expand Up @@ -330,7 +348,9 @@ it('ignores @-webkit-keyframes atrule', () => {
</svg>
`);
const stylesheet = collectStylesheet(root);
expect(computeStyle(stylesheet, getElementById(root, 'element'))).toEqual({
expect(
computeStyle(stylesheet, getElementById(root, 'element')),
).toStrictEqual({
animation: {
type: 'static',
inherited: false,
Expand Down

0 comments on commit f6a2ca2

Please sign in to comment.