chore: more readable snapshots

This commit is contained in:
2024-03-24 18:04:47 +01:00
parent 4cb8daf908
commit 93f99c732f
37 changed files with 1258 additions and 1096 deletions

View File

@@ -1,78 +1,108 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`basic inline-script 1`] = `
[
{
"code": undefined,
"fileName": "script.body.script.js.js.map",
"map": undefined,
"source": "{"version":3,"file":"script.body.script.js.js","sources":["../batman.js","../script.html.body.script.js"],"sourcesContent":["export const b = ()=>'batman';\\nconsole.log(b());\\n","\\n import {b} from \\"./batman.js\\";\\n document.body.appendChild(\\n document.createTextNode(\`Inline script including \${b()}\`)\\n );\\n "],"names":[],"mappings":"AAAO,MAAM,CAAC,GAAG,IAAI,QAAQ,CAAC;AAC9B,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;;ACCJ,QAAQ,CAAC,IAAI,CAAC,WAAW;AACrC,gBAAgB,QAAQ,CAAC,cAAc,CAAC,CAAC,wBAAwB,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AACzE,aAAa"}",
},
{
"code": undefined,
"fileName": "script.html",
"map": undefined,
"source": "<html><head>
</head>
<body>
<script type="module">const b = ()=>'batman';
console.log(b());
document.body.appendChild(
document.createTextNode(\`Inline script including \${b()}\`)
);
//# sourceMappingURL=script.body.script.js.js.map
</script>
</body></html>",
},
]
###############
# script.html #
###############
<html><head>
<!-- TODO:
EMPTY FAVICON, PREVENTS THE EXTRA REQUEST, but should be ignored by the rollup plugin:
<link rel="icon" href="data:,">
ONCE ADDED: change the snapshot to include full output (of browser test + code, instead of just .code)
-->
</head>
<body>
<script type="module">const b = ()=>'batman';
console.log(b());
document.body.appendChild(
document.createTextNode(\`Inline script including \${b()}\`)
);
//# sourceMappingURL=script.body.script.js.js.map
</script>
</body></html>
################################
# script.body.script.js.js.map #
################################
{"version":3,"file":"script.body.script.js.js","sources":["../batman.js","../script.html.body.script.js"],"sourcesContent":["export const b = ()=>'batman';\\nconsole.log(b());\\n","\\n import {b} from \\"./batman.js\\";\\n document.body.appendChild(\\n document.createTextNode(\`Inline script including \${b()}\`)\\n );\\n "],"names":[],"mappings":"AAAO,MAAM,CAAC,GAAG,IAAI,QAAQ,CAAC;AAC9B,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;;ACCJ,QAAQ,CAAC,IAAI,CAAC,WAAW;AACrC,gBAAgB,QAAQ,CAAC,cAAc,CAAC,CAAC,wBAAwB,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AACzE,aAAa"}
#################
# RENDERED HTML #
#################
<html><head>
<!-- TODO:
EMPTY FAVICON, PREVENTS THE EXTRA REQUEST, but should be ignored by the rollup plugin:
<link rel="icon" href="data:,">
ONCE ADDED: change the snapshot to include full output (of browser test + code, instead of just .code)
-->
</head>
<body>
<script type="module">const b = ()=>'batman';
console.log(b());
document.body.appendChild(
document.createTextNode(\`Inline script including \${b()}\`)
);
//# sourceMappingURL=script.body.script.js.js.map
</script>
Inline script including batman</body></html>
###########
# CONSOLE #
###########
[log] batman
[error] Failed to load resource: the server responded with a status of 404 (Not Found)
#############
# RESPONSES #
#############
200 http://localhost/script.html
404 http://localhost/favicon.ico
`;
exports[`basic simple 1`] = `
[
{
"code": "const b = ()=>'batman';
console.log(b());
export { b };
//# sourceMappingURL=batman.js.map
",
"fileName": "batman.js",
"map": SourceMap {
"file": "batman.js",
"mappings": "AAAY,MAAC,CAAC,GAAG,IAAI,SAAS;AAC9B,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;;;;",
"names": [],
"sources": [
"../batman.js",
],
"sourcesContent": [
"export const b = ()=>'batman';
console.log(b());
",
],
"version": 3,
},
"source": undefined,
},
{
"code": undefined,
"fileName": "batman.js.map",
"map": undefined,
"source": "{"version":3,"file":"batman.js","sources":["../batman.js"],"sourcesContent":["export const b = ()=>'batman';\\nconsole.log(b());\\n"],"names":[],"mappings":"AAAY,MAAC,CAAC,GAAG,IAAI,SAAS;AAC9B,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;;;;"}",
},
{
"code": undefined,
"fileName": "index.html",
"map": undefined,
"source": "<html><head>
</head>
<body>
<script src="batman.js" type="module"></script>
</body></html>",
},
]
##############
# index.html #
##############
<html><head>
</head>
<body>
<script src="batman.js" type="module"></script>
</body></html>
#############
# batman.js #
#############
const b = ()=>'batman';
console.log(b());
export { b };
//# sourceMappingURL=batman.js.map
#################
# batman.js.map #
#################
{"version":3,"file":"batman.js","sources":["../batman.js"],"sourcesContent":["export const b = ()=>'batman';\\nconsole.log(b());\\n"],"names":[],"mappings":"AAAY,MAAC,CAAC,GAAG,IAAI,SAAS;AAC9B,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;;;;"}
#################
# RENDERED HTML #
#################
<html><head>
</head>
<body>
<script src="batman.js" type="module"></script>
</body></html>
###########
# CONSOLE #
###########
[log] batman
#############
# RESPONSES #
#############
200 http://localhost/index.html
200 http://localhost/batman.js
200 http://localhost/favicon.ico
`;

View File

@@ -1,5 +1,10 @@
<html>
<head>
<!-- TODO:
EMPTY FAVICON, PREVENTS THE EXTRA REQUEST, but should be ignored by the rollup plugin:
<link rel="icon" href="data:,">
ONCE ADDED: change the snapshot to include full output (of browser test + code, instead of just .code)
-->
</head>
<body>
<script type="module">

View File

@@ -2,40 +2,38 @@ import {join, dirname} from "node:path";
import {test, expect} from "@jest/globals";
import { rollup } from "rollup";
import {debugPrintOutput, getCode} from "../util/index.ts";
import {runBrowserTest, defaultOutput, serializer} from "../util/index.ts";
import html from "../../src/index.ts";
import {fileURLToPath} from "node:url";
const __dirname = dirname(fileURLToPath(import.meta.url));
process.chdir(join(__dirname, 'fixtures'));
describe("basic", ()=> {
expect.addSnapshotSerializer(serializer);
test('simple', async () => {
const bundle = await rollup({
const out = await runBrowserTest({
input: 'index.html',
plugins: [
html({}),
]
});
const code = await getCode(bundle);
await bundle.close();
debugPrintOutput('simple', code);
expect(code).toMatchSnapshot();
}, {
}, defaultOutput);
expect(out).toMatchSnapshot();
});
test('inline-script', async () => {
const bundle = await rollup({
const out = await runBrowserTest({
input: 'script.html',
plugins: [
html({}),
]
});
const code = await getCode(bundle);
await bundle.close();
debugPrintOutput('inline-script', code);
expect(code).toMatchSnapshot();
}, {
path: 'script.html',
}, defaultOutput);
expect(out).toMatchSnapshot();
});
// TODO various parameters
@@ -43,5 +41,4 @@ describe("basic", ()=> {
// - sourcemap: inline, false, (and the various exotic sourcemap options)
// Watch mode tests would be its own dir
// ...
});