rollup-apps/plugin-html
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

First private release. Check updated README.md for details
Some checks failed
continuous-integration/drone/push Build is failing
Details

Browse Source
This commit is contained in:
Miel Truyen
2023-04-30 13:29:47 +02:00
parent 831e607591
commit 5ae59102b5
36 changed files with 890 additions and 875 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
test/basic/fixtures/batman.js
View File

@@ -0,0 +1,4 @@
export const test = ()=>{
return `I'm "annoying" ${"in case we need to test \`string\` escaping."}. Hence this files \'tries\' to include all allowed forms of 'it'`;
}
console.log(test());

7
test/basic/fixtures/index.html Normal file
View File

@@ -0,0 +1,7 @@
<html>
<head>
</head>
<body>
<script src="./batman.js" type="module"></script>
</body>
</html>

2
test/basic/fixtures/joker.js
View File

@@ -1,2 +0,0 @@
// eslint-disable-next-line
import style from './joker.css';

2
test/basic/fixtures/robin.js
View File

@@ -1,2 +0,0 @@
// eslint-disable-next-line
import * as batman from './batman.js';

373
test/basic/snapshots/test.js.md
View File

@@ -1,357 +1,58 @@
# Snapshot report for `test/test.js`
# Snapshot report for `test/basic/test.js`
The actual snapshot is saved in `test.js.snap`.
Generated by [AVA](https://avajs.dev).
## default options
## simple
> Snapshot 1
[
{
code: `(function (factory) {␊
typeof define === 'function' && define.amd ? define(factory) :␊
factory();␊
})((function () { 'use strict';␊
code: `const test = ()=>{␊
return \`I'm "annoying" ${"in case we need to test \\\`string\\\` escaping."}. Hence this files \\'tries\\' to include all allowed forms of 'it'\`;␊
};␊
console.log(test());␊
␊
␊
␊
}));␊
export { test };␊
//# sourceMappingURL=batman-9dbe0e1d.js.map␊
`,
fileName: 'batman.js',
map: null,
fileName: 'batman-9dbe0e1d.js',
map: SourceMap {
file: 'batman-9dbe0e1d.js',
mappings: 'AAAY,MAAC,IAAI,GAAG,IAAI;AACxB,IAAI,OAAO,CAAC,eAAe,EAAE,8CAA8C,CAAC,iEAAiE,CAAC,CAAC;AAC/I,EAAC;AACD,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;;;;',
names: [],
sources: [
'../batman.js',
],
sourcesContent: [
`export const test = ()=>{␊
return \`I'm "annoying" ${"in case we need to test \\\`string\\\` escaping."}. Hence this files \\'tries\\' to include all allowed forms of 'it'\`;␊
}␊
console.log(test());␊
`,
],
version: 3,
},
source: undefined,
},
{
code: undefined,
fileName: 'batman-9dbe0e1d.js.map',
map: undefined,
source: '{"version":3,"file":"batman-9dbe0e1d.js","sources":["../batman.js"],"sourcesContent":["export const test = ()=>{\\n return `I\'m \\"annoying\\" ${\\"in case we need to test \\\\`string\\\\` escaping.\\"}. Hence this files \\\\\'tries\\\\\' to include all allowed forms of \'it\'`;\\n}\\nconsole.log(test());\\n"],"names":[],"mappings":"AAAY,MAAC,IAAI,GAAG,IAAI;AACxB,IAAI,OAAO,CAAC,eAAe,EAAE,8CAA8C,CAAC,iEAAiE,CAAC,CAAC;AAC/I,EAAC;AACD,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;;;;"}',
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: `␊
<!doctype html>␊
<html lang="en">␊
<head>␊
<meta charset="utf-8">␊
<title>Rollup Bundle</title>␊
source: `<html><head>␊
</head>␊
<body>␊
<script src="batman-9dbe0e1d.js" type="module"></script>␊
␊
</head>␊
<body>␊
<script src="batman.js"></script>␊
</body>␊
</html>`,
},
]
## options
> Snapshot 1
[
{
code: `(function (factory) {␊
typeof define === 'function' && define.amd ? define(factory) :␊
factory();␊
})((function () { 'use strict';␊
␊
␊
␊
}));␊
`,
fileName: 'batman.js',
map: null,
source: undefined,
},
{
code: undefined,
fileName: 'batman.html',
map: undefined,
source: `␊
<!doctype html>␊
<html lang="en">␊
<head>␊
<meta charset="utf-8">␊
<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width">␊
<title>Batcave</title>␊
␊
</head>␊
<body>␊
<script src="batcave/batman.js"></script>␊
</body>␊
</html>`,
},
]
## iife
> Snapshot 1
[
{
code: `(function () {␊
'use strict';␊
␊
␊
␊
})();␊
`,
fileName: 'batman.js',
map: null,
source: undefined,
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: `␊
<!doctype html>␊
<html lang="en">␊
<head>␊
<meta charset="utf-8">␊
<title>Rollup Bundle</title>␊
␊
</head>␊
<body>␊
<script src="batman.js"></script>␊
</body>␊
</html>`,
},
]
## esm
> Snapshot 1
[
{
code: `␊
`,
fileName: 'batman.js',
map: null,
source: undefined,
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: `␊
<!doctype html>␊
<html lang="en">␊
<head>␊
<meta charset="utf-8">␊
<title>Rollup Bundle</title>␊
␊
</head>␊
<body>␊
<script src="batman.js" type="module"></script>␊
</body>␊
</html>`,
},
]
## unsupported output format
> Snapshot 1
[
{
code: `'use strict';␊
␊
`,
fileName: 'batman.js',
map: null,
source: undefined,
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: `␊
<!doctype html>␊
<html lang="en">␊
<head>␊
<meta charset="utf-8">␊
<title>Rollup Bundle</title>␊
␊
</head>␊
<body>␊
<script src="batman.js" type="module"></script>␊
</body>␊
</html>`,
},
]
> Snapshot 2
[
{
code: 'EMPTY_BUNDLE',
message: 'Generated an empty chunk: "batman".',
names: [
'batman',
],
toString: Function {},
},
{
code: 'PLUGIN_WARNING',
message: 'plugin-html: The output format \'cjs\' is not directly supported. A custom `template` is probably required. Supported formats include: es, esm, iife, umd',
plugin: 'html',
toString: Function {},
},
]
## css
> Snapshot 1
[
{
code: `(function (factory) {␊
typeof define === 'function' && define.amd ? define(factory) :␊
factory();␊
})((function () { 'use strict';␊
␊
␊
␊
}));␊
`,
fileName: 'joker.js',
map: null,
source: undefined,
},
{
code: undefined,
fileName: 'joker.css',
map: undefined,
source: Buffer @Uint8Array [
2a207b20 77696474 683a2031 3030253b 207d0a
],
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: `␊
<!doctype html>␊
<html lang="en">␊
<head>␊
<meta charset="utf-8">␊
<title>Rollup Bundle</title>␊
<link href="joker.css" rel="stylesheet">␊
</head>␊
<body>␊
<script src="joker.js" type="module"></script>␊
</body>␊
</html>`,
},
]
## attributes
> Snapshot 1
[
{
code: `(function (factory) {␊
typeof define === 'function' && define.amd ? define(factory) :␊
factory();␊
})((function () { 'use strict';␊
␊
␊
␊
}));␊
`,
fileName: 'joker.js',
map: null,
source: undefined,
},
{
code: undefined,
fileName: 'joker.css',
map: undefined,
source: Buffer @Uint8Array [
2a207b20 77696474 683a2031 3030253b 207d0a
],
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: `␊
<!doctype html>␊
<html batsignal="on" lang="bat">␊
<head>␊
<meta charset="utf-8">␊
<title>Rollup Bundle</title>␊
<link href="joker.css" rel="stylesheet" data-vilian="joker">␊
</head>␊
<body>␊
<script src="joker.js" defer="true"></script>␊
</body>␊
</html>`,
},
]
## imports
> Snapshot 1
[
{
code: `(function (factory) {␊
typeof define === 'function' && define.amd ? define(factory) :␊
factory();␊
})((function () { 'use strict';␊
␊
␊
␊
}));␊
`,
fileName: 'robin.js',
map: null,
source: undefined,
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: `␊
<!doctype html>␊
<html lang="en">␊
<head>␊
<meta charset="utf-8">␊
<title>Rollup Bundle</title>␊
␊
</head>␊
<body>␊
<script src="robin.js" type="module"></script>␊
</body>␊
</html>`,
},
]
## template
> Snapshot 1
[
{
code: `(function (factory) {␊
typeof define === 'function' && define.amd ? define(factory) :␊
factory();␊
})((function () { 'use strict';␊
␊
␊
␊
}));␊
`,
fileName: 'batman.js',
map: null,
source: undefined,
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: '<html><body><main></main></body></html>',
␊
</body></html>`,
},
]

BIN
test/basic/snapshots/test.js.snap
View File

Binary file not shown.

117
test/basic/test.js
View File

@@ -2,123 +2,36 @@ import {join, dirname} from "node:path";
import test from "ava";
import { rollup } from "rollup";
import css from "rollup-plugin-postcss";
import { getCode } from "../util/test.js";
import {debugPrintOutput, getCode} from "../util/test.js";
import html from "../../src/index.ts";
// const read = (file = 'index.html') => readFileSync(join('output/', file), 'utf-8');
const output = { dir: 'output', format: 'umd' };
const output = {
dir: 'output', // Output all files
format: 'es', // iifi and cjs should be added to tests
sourcemap: true,// Test if #sourcemapUrl is not accidentally included in the html-output
};
import {fileURLToPath} from "node:url";
const __dirname = dirname(fileURLToPath(import.meta.url));
process.chdir(join(__dirname, 'fixtures'));
test.serial('default options', async (t) => {
const bundle = await rollup({
input: 'batman.js',
plugins: [html()]
});
const code = await getCode(bundle, output, true);
t.snapshot(code);
});
test.serial('options', async (t) => {
test.serial('simple', async (t) => {
const bundle = await rollup({
input: 'batman.js',
input: 'index.html',
plugins: [
html({
fileName: 'batman.html',
publicPath: 'batcave/',
title: 'Batcave',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'minimum-scale=1, initial-scale=1, width=device-width' }
]
})
}),
]
});
const code = await getCode(bundle, output, true);
debugPrintOutput('simple',code);
t.snapshot(code);
});
test.serial('iife', async (t) => {
const bundle = await rollup({
input: 'batman.js',
plugins: [html()]
});
const code = await getCode(bundle, { dir: 'output', format: 'iife' }, true);
t.snapshot(code);
});
test.serial('esm', async (t) => {
const bundle = await rollup({
input: 'batman.js',
plugins: [html()]
});
const code = await getCode(bundle, { dir: 'output', format: 'es' }, true);
t.snapshot(code);
});
test.serial('unsupported output format', async (t) => {
const warnings = [];
const bundle = await rollup({
input: 'batman.js',
onwarn: (warning) => warnings.push(warning),
plugins: [html()]
});
const code = await getCode(bundle, { dir: 'output', format: 'cjs' }, true);
t.snapshot(code);
t.snapshot(warnings);
});
test.serial('css', async (t) => {
const bundle = await rollup({
input: 'joker.js',
plugins: [css({ extract: true }), html()]
});
const code = await getCode(bundle, output, true);
t.snapshot(code);
});
test.serial('attributes', async (t) => {
const bundle = await rollup({
input: 'joker.js',
plugins: [
css({ extract: true }),
html({
attributes: {
html: { batsignal: 'on', lang: 'bat' },
link: { 'data-vilian': 'joker' },
script: { defer: true }
}
})
]
});
const code = await getCode(bundle, output, true);
t.snapshot(code);
});
test.serial('imports', async (t) => {
const bundle = await rollup({
input: 'robin.js',
plugins: [html()]
});
const code = await getCode(bundle, output, true);
t.snapshot(code);
});
test.serial('template', async (t) => {
const bundle = await rollup({
input: 'batman.js',
plugins: [
html({
transform: () => '<html><body><main></main></body></html>'
})
]
});
const code = await getCode(bundle, output, true);
t.snapshot(code);
});
// TODO various parameters
// - format: cjs, iifi, ...
// - sourcemap: inline, false, (and the various exotic sourcemap options)
// Watch mode tests would be its own dir
// ...

4
test/hbs/fixtures/batman.js
View File

@@ -1,4 +0,0 @@
export const notSoIifi = ()=>{
return `I'm "annoying" ${"in case we need to test \`string\` escaping.''"}`;
}
console.log(notSoIifi());

74
test/hbs/snapshots/test.js.md
View File

@@ -1,74 +0,0 @@
# Snapshot report for `test/hbs/test.js`
The actual snapshot is saved in `test.js.snap`.
Generated by [AVA](https://avajs.dev).
## handlebars
> Snapshot 1
[
{
code: `<html><head>␊
<meta data-test="a">␊
</head>␊
<body>␊
<script src="batman-f8ac73ff.js" type="module"></script>␊
␊
␊
</body></html>␊
//# sourceMappingURL=index.html.map␊
`,
fileName: 'index.html',
map: SourceMap {
file: 'index.html',
mappings: '',
names: [],
sources: [],
sourcesContent: [],
version: 3,
},
source: undefined,
},
{
code: `const notSoIifi = ()=>{␊
return \`I'm "annoying" ${"in case we need to test \\\`string\\\` escaping.''"}\`;␊
};␊
console.log(notSoIifi());␊
␊
export { notSoIifi };␊
//# sourceMappingURL=batman-f8ac73ff.js.map␊
`,
fileName: 'batman-f8ac73ff.js',
map: SourceMap {
file: 'batman-f8ac73ff.js',
mappings: 'AAAY,MAAC,SAAS,GAAG,IAAI;AAC7B,IAAI,OAAO,CAAC,eAAe,EAAE,gDAAgD,CAAC,CAAC,CAAC;AAChF,EAAC;AACD,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC;;;;',
names: [],
sources: [
'../batman.js',
],
sourcesContent: [
`export const notSoIifi = ()=>{␊
return \`I'm "annoying" ${"in case we need to test \\\`string\\\` escaping.''"}\`;␊
}␊
console.log(notSoIifi());␊
`,
],
version: 3,
},
source: undefined,
},
{
code: undefined,
fileName: 'batman-f8ac73ff.js.map',
map: undefined,
source: '{"version":3,"file":"batman-f8ac73ff.js","sources":["../batman.js"],"sourcesContent":["export const notSoIifi = ()=>{\\n return `I\'m \\"annoying\\" ${\\"in case we need to test \\\\`string\\\\` escaping.\'\'\\"}`;\\n}\\nconsole.log(notSoIifi());\\n"],"names":[],"mappings":"AAAY,MAAC,SAAS,GAAG,IAAI;AAC7B,IAAI,OAAO,CAAC,eAAe,EAAE,gDAAgD,CAAC,CAAC,CAAC;AAChF,EAAC;AACD,OAAO,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC;;;;"}',
},
{
code: undefined,
fileName: 'index.html.map',
map: undefined,
source: '{"version":3,"file":"index.html","sources":[],"sourcesContent":[],"names":[],"mappings":""}',
},
]

BIN
test/hbs/snapshots/test.js.snap
View File

Binary file not shown.

4
test/live-reload/fixtures/batman.js Normal file
View File

@@ -0,0 +1,4 @@
export const test = ()=>{
return `I'm "annoying" ${"in case we need to test \`string\` escaping."}. Hence this files \'tries\' to include all allowed forms of 'it'`;
}
console.log(test());

7
test/live-reload/fixtures/index.html Normal file
View File

@@ -0,0 +1,7 @@
<html>
<head>
</head>
<body>
<script src="./batman.js" type="module"></script>
</body>
</html>

60
test/live-reload/snapshots/test.js.md Normal file
View File

@@ -0,0 +1,60 @@
# Snapshot report for `test/live-reload/test.js`
The actual snapshot is saved in `test.js.snap`.
Generated by [AVA](https://avajs.dev).
## live-reload
> Snapshot 1
[
{
code: `␊
(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);␊
const test = ()=>{␊
return \`I'm "annoying" ${"in case we need to test \\\`string\\\` escaping."}. Hence this files \\'tries\\' to include all allowed forms of 'it'\`;␊
};␊
console.log(test());␊
␊
export { test };␊
//# sourceMappingURL=batman-1a5fc364.js.map␊
`,
fileName: 'batman-1a5fc364.js',
map: SourceMap {
file: 'batman-1a5fc364.js',
mappings: ';;AAAY,MAAC,IAAI,GAAG,IAAI;AACxB,IAAI,OAAO,CAAC,eAAe,EAAE,8CAA8C,CAAC,iEAAiE,CAAC,CAAC;AAC/I,EAAC;AACD,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;;;;',
names: [],
sources: [
'../batman.js',
],
sourcesContent: [
`export const test = ()=>{␊
return \`I'm "annoying" ${"in case we need to test \\\`string\\\` escaping."}. Hence this files \\'tries\\' to include all allowed forms of 'it'\`;␊
}␊
console.log(test());␊
`,
],
version: 3,
},
source: undefined,
},
{
code: undefined,
fileName: 'batman-1a5fc364.js.map',
map: undefined,
source: '{"version":3,"file":"batman-1a5fc364.js","sources":["../batman.js"],"sourcesContent":["export const test = ()=>{\\n return `I\'m \\"annoying\\" ${\\"in case we need to test \\\\`string\\\\` escaping.\\"}. Hence this files \\\\\'tries\\\\\' to include all allowed forms of \'it\'`;\\n}\\nconsole.log(test());\\n"],"names":[],"mappings":";;AAAY,MAAC,IAAI,GAAG,IAAI;AACxB,IAAI,OAAO,CAAC,eAAe,EAAE,8CAA8C,CAAC,iEAAiE,CAAC,CAAC;AAC/I,EAAC;AACD,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;;;;"}',
},
{
code: undefined,
fileName: 'index.html',
map: undefined,
source: `<html><head>␊
</head>␊
<body>␊
<script src="batman-1a5fc364.js" type="module"></script>␊
␊
␊
</body></html>`,
},
]

BIN
test/live-reload/snapshots/test.js.snap Normal file
View File

Binary file not shown.

42
test/live-reload/test.js Normal file
View File

@@ -0,0 +1,42 @@
import {join, dirname} from "node:path";
import test from "ava";
import {rollup} from "rollup";
import liveReload from "rollup-plugin-livereload";
import {debugPrintOutput, getCode} from "../util/test.js";
import html from "../../src/index.ts";
const output = {
dir: 'output', // Output all files
format: 'es', // iifi and cjs should be added to tests
sourcemap: true,// Test if #sourcemapUrl is not accidentally included in the html-output
};
import {fileURLToPath} from "node:url";
const __dirname = dirname(fileURLToPath(import.meta.url));
process.chdir(join(__dirname, 'fixtures'));
test.serial('live-reload', async (t) => {
const bundle = await rollup({
input: 'index.html',
plugins: [
html({
}),
liveReload({
verbose: false// this oddly enough prevents it from actually starting the liveserver, which would've left the test to wait indefinatly to close
})
]
});
const code = await getCode(bundle, output, true);
await bundle.close();// Make sure live-reload closes itself
debugPrintOutput('live-reload',code);
t.snapshot(code);
});
// TODO various parameters
// - format: cjs, iifi, ...
// - sourcemap: inline, false, (and the various exotic sourcemap options)
// Watch mode tests would be its own dir
// ...

2
test/templating/fixtures/batman.js Normal file
View File

@@ -0,0 +1,2 @@
export const b = ()=>'batman';
console.log(b());

3
test/templating/fixtures/icon.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path style="fill:none;stroke:#00ff0d;stroke-width:5;stroke-linecap:square;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1" d="M4.1 14.72 16 26.31 28.38 5.09"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 244 B

0
test/hbs/fixtures/index.hbs → test/templating/fixtures/index.hbs
View File

8
test/templating/fixtures/index.html Normal file
View File

@@ -0,0 +1,8 @@
<html>
<head>
<link rel="icon" href="./icon.svg">
</head>
<body>
<script src="./batman.js" type="module"></script>
</body>
</html>

0
test/basic/fixtures/joker.css → test/templating/fixtures/joker.css
View File

55
test/templating/snapshots/test.js.md Normal file
View File

@@ -0,0 +1,55 @@
# Snapshot report for `test/templating/test.js`
The actual snapshot is saved in `test.js.snap`.
Generated by [AVA](https://avajs.dev).
## handlebars
> Snapshot 1
[
{
code: `const b = ()=>'batman';␊
console.log(b());␊
␊
export { b };␊
//# sourceMappingURL=batman-c7fa228c.js.map␊
`,
fileName: 'batman-c7fa228c.js',
map: SourceMap {
file: 'batman-c7fa228c.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-c7fa228c.js.map',
map: undefined,
source: '{"version":3,"file":"batman-c7fa228c.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>␊
<meta data-test="a">␊
</head>␊
<body>␊
<script src="batman-c7fa228c.js" type="module"></script>␊
␊
␊
</body></html>`,
},
]

BIN
test/templating/snapshots/test.js.snap Normal file
View File

Binary file not shown.

18
test/hbs/test.js → test/templating/test.js
View File

@@ -3,7 +3,7 @@ import {join, dirname} from "node:path";
import test from "ava";
import { rollup } from "rollup";
import { getCode } from "../util/test.js";
import {debugPrintOutput, getCode} from "../util/test.js";
import html from "../../src/index.ts";
import handlebars from "handlebars";
@@ -14,24 +14,30 @@ const output = {
sourcemap: true,// Test if #sourcemapUrl is not accidentally included in the html-output
};
import {readFile} from "node:fs/promises";
import {fileURLToPath} from "node:url";
const __dirname = dirname(fileURLToPath(import.meta.url));
process.chdir(join(__dirname, 'fixtures'));
test.serial('handlebars', async (t) => {
const template = await readFile('index.hbs', {encoding: "utf-8"});
const bundle = await rollup({
input: 'index.hbs',
plugins: [
html({
// Should we define an output template here?!
transform(ctx){
return handlebars.compile(template)({a:'a'})
transform(src){
return handlebars.compile(src)({a:'a'})
}
})
]
});
const code = await getCode(bundle, output, true);
debugPrintOutput('handlebars',code);
t.snapshot(code);
});
// TODO various parameters
// - format: cjs, iifi, ...
// - sourcemap: inline, false, (and the various exotic sourcemap options)
// Watch mode tests would be its own dir
// ...

2
test/url-plugin/fixtures/batman.js Normal file
View File

@@ -0,0 +1,2 @@
export const b = ()=>'batman';
console.log(b());

3
test/url-plugin/fixtures/icon.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg">
<path style="fill:none;stroke:#00ff0d;stroke-width:5;stroke-linecap:square;stroke-linejoin:miter;stroke-dasharray:none;stroke-opacity:1" d="M4.1 14.72 16 26.31 28.38 5.09"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 244 B

8
test/url-plugin/fixtures/index.html Normal file
View File

@@ -0,0 +1,8 @@
<html>
<head>
<link rel="icon" href="./icon.svg">
</head>
<body>
<script src="./batman.js" type="module"></script>
</body>
</html>

105
test/url-plugin/snapshots/test.js.md Normal file
View File

@@ -0,0 +1,105 @@
# Snapshot report for `test/url-plugin/test.js`
The actual snapshot is saved in `test.js.snap`.
Generated by [AVA](https://avajs.dev).
## copied-assets
> Snapshot 1
[
{
code: `const b = ()=>'batman';␊
console.log(b());␊
␊
export { b };␊
//# sourceMappingURL=batman-c7fa228c.js.map␊
`,
fileName: 'batman-c7fa228c.js',
map: SourceMap {
file: 'batman-c7fa228c.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-c7fa228c.js.map',
map: undefined,
source: '{"version":3,"file":"batman-c7fa228c.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>␊
<link rel="icon" href="fb585fdb6db313c9.svg">␊
</head>␊
<body>␊
<script src="batman-c7fa228c.js" type="module"></script>␊
␊
␊
</body></html>`,
},
]
## inlined-assets
> Snapshot 1
[
{
code: `const b = ()=>'batman';␊
console.log(b());␊
␊
export { b };␊
//# sourceMappingURL=batman-c7fa228c.js.map␊
`,
fileName: 'batman-c7fa228c.js',
map: SourceMap {
file: 'batman-c7fa228c.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-c7fa228c.js.map',
map: undefined,
source: '{"version":3,"file":"batman-c7fa228c.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>␊
<link rel="icon" href="data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2032%2032%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%20%3Cpath%20style%3D%22fill%3Anone%3Bstroke%3A%2300ff0d%3Bstroke-width%3A5%3Bstroke-linecap%3Asquare%3Bstroke-linejoin%3Amiter%3Bstroke-dasharray%3Anone%3Bstroke-opacity%3A1%22%20d%3D%22M4.1%2014.72%2016%2026.31%2028.38%205.09%22%2F%3E%3C%2Fsvg%3E">␊
</head>␊
<body>␊
<script src="batman-c7fa228c.js" type="module"></script>␊
␊
␊
</body></html>`,
},
]

BIN
test/url-plugin/snapshots/test.js.snap Normal file
View File

Binary file not shown.

67
test/url-plugin/test.js Normal file
View File

@@ -0,0 +1,67 @@
import {join, dirname} from "node:path";
import test from "ava";
import { rollup } from "rollup";
import urlPlugin from "@rollup/plugin-url";
import {debugPrintOutput, getCode} from "../util/test.js";
import html from "../../src/index.ts";
const output = {
dir: 'output', // Output all files
format: 'es', // iifi and cjs should be added to tests
sourcemap: true,// Test if #sourcemapUrl is not accidentally included in the html-output
};
import {fileURLToPath} from "node:url";
const __dirname = dirname(fileURLToPath(import.meta.url));
process.chdir(join(__dirname, 'fixtures'));
const defaultAssetInclude = [
'**/*.(png|jpg|jpeg|gif|ico|svg)',// images, svg
'**/*.(woff|woff2|eot|ttf|otf)',// fonts
'**/*.(webm|mp4)',// video
];
test.serial('copied-assets', async (t) => {
const bundle = await rollup({
input: 'index.html',
plugins: [
html({
}),
urlPlugin({
include: defaultAssetInclude,
limit: 0,// Never inline something
}),
],
});
const code = await getCode(bundle, output, true);
debugPrintOutput('copied-assets',code);
t.snapshot(code);
});
test.serial('inlined-assets', async (t) => {
const bundle = await rollup({
input: 'index.html',
plugins: [
html({
}),
urlPlugin({
include: defaultAssetInclude,
limit: Number.MAX_SAFE_INTEGER,// Always inline things
}),
]
});
const code = await getCode(bundle, output, true);
debugPrintOutput('inlined-assets',code);
t.snapshot(code);
});
// TODO various parameters
// - format: cjs, iifi, ...
// - sourcemap: inline, false, (and the various exotic sourcemap options)
// Watch mode tests would be its own dir
// ...

30
test/util/test.js
View File

@@ -1,5 +1,6 @@
import path from "node:path";
import process from "node:process";
import chalk from "chalk";
/**
* @param {import('rollup').RollupBuild} bundle
@@ -22,6 +23,35 @@ export const getCode = async (bundle, outputOptions, allFiles = false) => {
return code;
};
export const debugPrintOutput = async (header, files) => {
const out = [];
const headFn = chalk.bgCyan;
const headPadding = header.split('').map(x=>'#').join('');
out.push(...[
headFn(`##${headPadding}##`),
headFn(`# ${header} #`),
headFn(`##${headPadding}##`),
]);
const fileHeadFn = chalk.blue;
const fileContentFn = chalk.blackBright;
out.push(...(files.map(file=>{
return [
fileHeadFn(`${file.fileName}:`),
fileContentFn(`${file.code??file.source}`),
'',
]
}).flat()));
out.push(...[
headFn(`##${headPadding}##`),
]);
process.env.DEBUG? console.log(out.join('\n')) : null;
};
/**
* @param {import('rollup').RollupBuild} bundle
* @param {import('rollup').OutputOptions} [outputOptions]