Skip to content

Commit 52ec97e

Browse files
committed
test: Refactor snapshot testing
1 parent c55a69a commit 52ec97e

File tree

10 files changed

+295
-187
lines changed

10 files changed

+295
-187
lines changed

packages/cli/global.d.ts

Lines changed: 0 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,5 @@
11
declare const __webpack_public_path__: string;
22

3-
declare namespace jest {
4-
interface Matchers<R> {
5-
toBeCloseInSize(receivedSize: number, expectedSize: number): R;
6-
toFindMatchingKey(receivedKey: string): R;
7-
}
8-
}
9-
103
// Modified from https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/shelljs/index.d.ts
114
declare module 'shelljs' {
125
const shell: {

packages/cli/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,7 @@
118118
"devDependencies": {
119119
"@types/express": "^4.17.13",
120120
"@types/jest": "^24.9.1",
121+
"directory-tree": "^3.5.1",
121122
"html-looks-like": "^1.0.2",
122123
"jest": "^24.9.0",
123124
"less": "^4.1.1",
Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`preact build builds the \`default\` template 1`] = `
4+
"build
5+
assets
6+
icons
7+
android-chrome-192x192.png: 14058
8+
android-chrome-512x512.png: 51484
9+
apple-touch-icon.png: 12746
10+
favicon-16x16.png: 626
11+
favicon-32x32.png: 1487
12+
mstile-150x150.png: 9050
13+
favicon.ico: 15086
14+
preact-logo-inverse.svg: 649
15+
preact-logo.svg: 645
16+
ssr-build
17+
asset-manifest.json: 178
18+
ssr-bundle.js: 30158
19+
ssr-bundle.js.map: 54671
20+
ssr-bundle.82489.css: 2585
21+
ssr-bundle.82489.css.map: 3680
22+
asset-manifest.json: 1142
23+
bundle.c4895.js: 22552
24+
bundle.c4895.js.map: 113627
25+
bundle.4c6ac.css: 1276
26+
favicon.ico: 15086
27+
index.html: 4162
28+
manifest.json: 455
29+
polyfills.1ea90.js: 6426
30+
polyfills.1ea90.js.map: 21116
31+
preact_prerender_data.json: 11
32+
push-manifest.json: 388
33+
route-home.chunk.5d28d.js: 1174
34+
route-home.chunk.5d28d.js.map: 2028
35+
route-home.chunk.9bcab.css: 821
36+
route-profile.chunk.4c330.js: 3490
37+
route-profile.chunk.4c330.js.map: 15002
38+
"
39+
`;
40+
41+
exports[`preact build builds the \`default\` template with esm 1`] = `
42+
"build
43+
assets
44+
icons
45+
android-chrome-192x192.png: 14058
46+
android-chrome-512x512.png: 51484
47+
apple-touch-icon.png: 12746
48+
favicon-16x16.png: 626
49+
favicon-32x32.png: 1487
50+
mstile-150x150.png: 9050
51+
favicon.ico: 15086
52+
preact-logo-inverse.svg: 649
53+
preact-logo.svg: 645
54+
ssr-build
55+
asset-manifest.json: 178
56+
ssr-bundle.js: 30158
57+
ssr-bundle.js.map: 54671
58+
ssr-bundle.82489.css: 2585
59+
ssr-bundle.82489.css.map: 3680
60+
asset-manifest.json: 1174
61+
bundle.c4895.js: 22552
62+
bundle.c4895.js.map: 113627
63+
bundle.9eeeb.esm.js: 22272
64+
bundle.9eeeb.esm.js.map: 113603
65+
bundle.4c6ac.css: 1276
66+
favicon.ico: 15086
67+
index.html: 4256
68+
manifest.json: 455
69+
polyfills.1ea90.js: 6426
70+
polyfills.1ea90.js.map: 21116
71+
polyfills.bfe9e.esm.js: 5721
72+
polyfills.bfe9e.esm.js.map: 21081
73+
preact_prerender_data.json: 11
74+
push-manifest.json: 404
75+
route-home.chunk.5d28d.js: 1174
76+
route-home.chunk.5d28d.js.map: 2028
77+
route-home.chunk.f8caa.esm.js: 1152
78+
route-home.chunk.f8caa.esm.js.map: 2024
79+
route-home.chunk.9bcab.css: 821
80+
route-profile.chunk.4c330.js: 3490
81+
route-profile.chunk.4c330.js.map: 15002
82+
route-profile.chunk.44303.esm.js: 2424
83+
route-profile.chunk.44303.esm.js.map: 14942
84+
"
85+
`;
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`preact create scaffolds the \`default\` official template 1`] = `
4+
"default-template-project
5+
.gitignore
6+
README.md
7+
package.json
8+
src
9+
assets
10+
favicon.ico
11+
icons
12+
android-chrome-192x192.png
13+
android-chrome-512x512.png
14+
apple-touch-icon.png
15+
favicon-16x16.png
16+
favicon-32x32.png
17+
mstile-150x150.png
18+
preact-logo-inverse.svg
19+
preact-logo.svg
20+
components
21+
app.js
22+
header
23+
index.js
24+
style.css
25+
index.js
26+
manifest.json
27+
routes
28+
home
29+
index.js
30+
style.css
31+
profile
32+
index.js
33+
style
34+
index.css
35+
sw.js
36+
template.html
37+
tests
38+
__mocks__
39+
browserMocks.js
40+
fileMocks.js
41+
setupTests.js
42+
header.test.js
43+
"
44+
`;

packages/cli/tests/build.test.js

Lines changed: 6 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,11 @@ const { access, mkdir, readdir, readFile, rename, unlink, writeFile } =
33
require('fs').promises;
44
const looksLike = require('html-looks-like');
55
const { create, build } = require('./lib/cli');
6-
const { snapshot } = require('./lib/utils');
6+
const { snapshotDir } = require('./lib/utils');
77
const { subject } = require('./lib/output');
88
const images = require('./images/build');
9-
const minimatch = require('minimatch');
109
const shell = require('shelljs');
10+
const dirTree = require('directory-tree');
1111

1212
const prerenderUrlFiles = [
1313
'prerender-urls.json',
@@ -35,18 +35,6 @@ function getRegExpFromMarkup(markup) {
3535
return new RegExp(minifiedMarkup);
3636
}
3737

38-
function testMatch(received, expected) {
39-
let receivedKeys = Object.keys(received);
40-
let expectedKeys = Object.keys(expected);
41-
expect(receivedKeys).toHaveLength(expectedKeys.length);
42-
for (let key in expected) {
43-
const receivedKey = receivedKeys.find(k => minimatch(k, key));
44-
expect(key).toFindMatchingKey(receivedKey);
45-
46-
expect(receivedKey).toBeCloseInSize(received[receivedKey], expected[key]);
47-
}
48-
}
49-
5038
/**
5139
* Get build output file as utf-8 string
5240
* @param {string} dir
@@ -67,17 +55,17 @@ describe('preact build', () => {
6755

6856
await build(dir);
6957

70-
let output = await snapshot(join(dir, 'build'));
71-
testMatch(output, images.default);
58+
const directoryTree = dirTree(join(dir, 'build'), { attributes: ['size'] });
59+
expect(await snapshotDir([directoryTree])).toMatchSnapshot();
7260
});
7361

7462
it('builds the `default` template with esm', async () => {
7563
let dir = await create('default');
7664

7765
await build(dir, { esm: true });
7866

79-
let output = await snapshot(join(dir, 'build'));
80-
testMatch(output, images['default-esm']);
67+
const directoryTree = dirTree(join(dir, 'build'), { attributes: ['size'] });
68+
expect(await snapshotDir([directoryTree])).toMatchSnapshot();
8169
});
8270

8371
it('builds the `typescript` template', async () => {

packages/cli/tests/create.test.js

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,22 @@
11
const { access, readFile } = require('fs').promises;
2-
const { join, relative } = require('path');
2+
const { join } = require('path');
33
const { create } = require('./lib/cli');
4-
const { expand } = require('./lib/utils');
5-
const snapshots = require('./images/create');
4+
const { snapshotDir } = require('./lib/utils');
65
const shell = require('shelljs');
6+
const dirTree = require('directory-tree');
77

88
describe('preact create', () => {
99
it('scaffolds the `default` official template', async () => {
1010
let dir = await create('default');
1111

12-
let output = await expand(dir).then(arr => {
13-
return arr.map(x => relative(dir, x));
12+
const directoryTree = dirTree(dir, {
13+
exclude: /node_modules|package-lock|yarn.lock/,
1414
});
1515

16-
expect(output.sort()).toEqual(snapshots.default);
16+
// Creating a stable name, as the test directory is normally a randomized string
17+
directoryTree.name = 'default-template-project';
18+
19+
expect(await snapshotDir([directoryTree], false)).toMatchSnapshot();
1720
});
1821

1922
it('should use template.html from the github repo', async () => {

packages/cli/tests/images/build.js

Lines changed: 0 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,3 @@
1-
const common = {
2-
'polyfills.1ea90.js': 6426,
3-
'polyfills.1ea90.js.map': 21668,
4-
};
5-
6-
exports.default = Object.assign({}, common, {
7-
'assets/icons/android-chrome-192x192.png': 14058,
8-
'assets/icons/android-chrome-512x512.png': 51484,
9-
'assets/icons/apple-touch-icon.png': 12746,
10-
'assets/icons/favicon-16x16.png': 626,
11-
'assets/icons/favicon-32x32.png': 1487,
12-
'assets/icons/mstile-150x150.png': 9050,
13-
'assets/preact-logo.svg': 645,
14-
'assets/preact-logo-inverse.svg': 649,
15-
'assets/favicon.ico': 15086,
16-
'ssr-build/ssr-bundle.82489.css': 2601,
17-
'ssr-build/ssr-bundle.82489.css.map': 3708,
18-
'ssr-build/ssr-bundle.js': 28830,
19-
'ssr-build/ssr-bundle.js.map': 52686,
20-
'ssr-build/asset-manifest.json': 178,
21-
'bundle.4c6ac.css': 1276,
22-
'bundle.c4895.js': 22529,
23-
'bundle.c4895.js.map': 111801,
24-
'favicon.ico': 15086,
25-
'index.html': 4127,
26-
'manifest.json': 455,
27-
'preact_prerender_data.json': 11,
28-
'push-manifest.json': 388,
29-
'asset-manifest.json': 1142,
30-
'route-home.chunk.9bcab.css': 834,
31-
'route-home.chunk.5d28d.js': 1149,
32-
'route-home.chunk.5d28d.js.map': 1961,
33-
'route-profile.chunk.4c330.js': 3490,
34-
'route-profile.chunk.4c330.js.map': 15002,
35-
});
36-
exports['default-esm'] = Object.assign({}, exports.default, {
37-
'bundle.*.esm.js': 22249,
38-
'bundle.*.esm.js.map': 113538,
39-
'polyfills.*.esm.js': 5721,
40-
'polyfills.*.esm.js.map': 21633,
41-
'route-home.chunk.*.esm.js': 1127,
42-
'route-home.chunk.*.esm.js.map': 1957,
43-
'route-profile.chunk.*.esm.js': 2424,
44-
'route-profile.chunk.*.esm.js.map': 14942,
45-
'index.html': 4221,
46-
'push-manifest.json': 404,
47-
'asset-manifest.json': 1174,
48-
});
49-
501
exports.sass = `
512
<body>
523
<div class="background__2mKGE">

packages/cli/tests/images/create.js

Lines changed: 0 additions & 33 deletions
This file was deleted.

0 commit comments

Comments
 (0)