0
Fork 0
mirror of https://github.com/verdaccio/verdaccio.git synced 2024-12-16 21:56:25 -05:00

fix(middleware): link to favicon in template (#4744)

This commit is contained in:
Marc Bernard 2024-07-30 17:20:18 -04:00 committed by GitHub
parent 3c6e6b9af7
commit ccc7bd1df5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
8 changed files with 90 additions and 88 deletions

View file

@ -0,0 +1,6 @@
---
'@verdaccio/middleware': patch
'@verdaccio/url': patch
---
fix(middleware): link to favicon in template

View file

@ -102,7 +102,7 @@ describe('host', () => {
});
expect(
getPublicUrl(null, {
getPublicUrl(undefined, {
host: req.hostname,
headers: req.headers as any,
protocol: req.protocol,

View file

@ -35,6 +35,7 @@
"build:js": "babel src/ --out-dir build/ --copy-files --extensions \".ts,.tsx\" --source-maps",
"watch": "pnpm build:js -- --watch",
"test": "jest",
"test:snap": "jest --updateSnapshot",
"build": "pnpm run build:js && pnpm run build:types"
},
"dependencies": {

View file

@ -16,8 +16,16 @@ export function getManifestValue(
): string[] {
return manifestItems?.map((item) => {
debug('resolve item %o', item);
const resolvedItem = `${basePath}${manifest[item]}`;
const resolvedItem = `${stripTrailingSlash(basePath)}/${stripLeadingSlash(manifest[item])}`;
debug('resolved item %o', resolvedItem);
return resolvedItem;
});
}
function stripTrailingSlash(path: string): string {
return path.replace(/\/$/, '');
}
function stripLeadingSlash(path: string): string {
return path.replace(/^\//, '');
}

View file

@ -25,24 +25,24 @@ export default function renderTemplate(template: Template, manifest: WebpackMani
return `
<!DOCTYPE html>
<html lang="en-us">
<html lang="en-us">
<head>
<meta charset="utf-8">
<base href="${template?.options.base}">
<title>${template?.options?.title ?? ''}</title>
<link rel="icon" href="${template?.options.base}/-/static/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>${template?.options?.title ?? ''}</title>
<link rel="icon" href="${template?.options.base}-/static/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
window.__VERDACCIO_BASENAME_UI_OPTIONS=${JSON.stringify(template.options)}
</script>
${template?.metaScripts ? template.metaScripts.join('') : ''}
</head>
</head>
<body class="body">
${template?.scriptsbodyBefore ? template.scriptsbodyBefore.join('') : ''}
${template?.scriptsbodyBefore ? template.scriptsbodyBefore.join('') : ''}
<div id="root"></div>
${getManifestValue(template.manifest.js, manifest, template?.options.base)
.map((item) => `<script defer="defer" src="${item}"></script>`)
.join('')}
.join(`\n `)}
${template?.scriptsBodyAfter ? template.scriptsBodyAfter.join('') : ''}
</body>
</html>

View file

@ -3,22 +3,23 @@
exports[`template custom body after 1`] = `
"
<!DOCTYPE html>
<html lang="en-us">
<html lang="en-us">
<head>
<meta charset="utf-8">
<base href="http://domain.com">
<title></title>
<base href="http://domain.com/">
<title></title>
<link rel="icon" href="http://domain.com/-/static/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com"}
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com/"}
</script>
</head>
</head>
<body class="body">
<div id="root"></div>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script><script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
<script src="foo"/>
</body>
</html>
@ -28,22 +29,23 @@ exports[`template custom body after 1`] = `
exports[`template custom body before 1`] = `
"
<!DOCTYPE html>
<html lang="en-us">
<html lang="en-us">
<head>
<meta charset="utf-8">
<base href="http://domain.com">
<title></title>
<base href="http://domain.com/">
<title></title>
<link rel="icon" href="http://domain.com/-/static/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com"}
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com/"}
</script>
</head>
</head>
<body class="body">
<script src="fooBefore"/><script src="barBefore"/>
<script src="fooBefore"/><script src="barBefore"/>
<div id="root"></div>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script><script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
</body>
</html>
@ -53,22 +55,23 @@ exports[`template custom body before 1`] = `
exports[`template custom render 1`] = `
"
<!DOCTYPE html>
<html lang="en-us">
<html lang="en-us">
<head>
<meta charset="utf-8">
<base href="http://domain.com">
<title></title>
<base href="http://domain.com/">
<title></title>
<link rel="icon" href="http://domain.com/-/static/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com"}
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com/"}
</script>
</head>
</head>
<body class="body">
<div id="root"></div>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script><script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
</body>
</html>
@ -78,47 +81,23 @@ exports[`template custom render 1`] = `
exports[`template custom title 1`] = `
"
<!DOCTYPE html>
<html lang="en-us">
<html lang="en-us">
<head>
<meta charset="utf-8">
<base href="http://domain.com">
<title>foo title</title>
<base href="http://domain.com/">
<title>foo title</title>
<link rel="icon" href="http://domain.com/-/static/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com","title":"foo title"}
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com/","title":"foo title"}
</script>
</head>
</head>
<body class="body">
<div id="root"></div>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script><script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
</body>
</html>
"
`;
exports[`template custom title 2`] = `
"
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<base href="http://domain.com">
<title>foo title</title>
<link rel="icon" href="http://domain.com/-/static/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com","title":"foo title"}
</script>
</head>
<body class="body">
<div id="root"></div>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script><script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
</body>
</html>
@ -128,22 +107,23 @@ exports[`template custom title 2`] = `
exports[`template meta scripts 1`] = `
"
<!DOCTYPE html>
<html lang="en-us">
<html lang="en-us">
<head>
<meta charset="utf-8">
<base href="http://domain.com">
<title></title>
<base href="http://domain.com/">
<title></title>
<link rel="icon" href="http://domain.com/-/static/favicon.ico"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script>
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com"}
window.__VERDACCIO_BASENAME_UI_OPTIONS={"base":"http://domain.com/"}
</script>
<style>.someclass{font-size:10px;}</style>
</head>
</head>
<body class="body">
<div id="root"></div>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script><script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/runtime.6126058572f989c948b1.js"></script>
<script defer="defer" src="http://domain.com/-/static/main.6126058572f989c948b1.js"></script>
</body>
</html>

View file

@ -8,4 +8,16 @@ describe('manifest', () => {
'/-/static/main.6126058572f989c948b1.js',
]);
});
test('getManifestValue with base', () => {
expect(getManifestValue(['favicon.ico'], manifest, 'http://domain.com')).toEqual([
'http://domain.com/-/static/favicon.ico',
]);
});
test('getManifestValue with base with trailing slash', () => {
expect(getManifestValue(['favicon.ico'], manifest, 'http://domain.com/')).toEqual([
'http://domain.com/-/static/favicon.ico',
]);
});
});

View file

@ -2,32 +2,27 @@ import template from '../src/middlewares/web/utils/template';
const manifest = require('./partials/manifest/manifest.json');
// manifest expected to have leading slash
// see packages\middleware\test\partials\manifest\manifest.json
const exampleManifest = {
css: ['main.css'],
js: ['runtime.js', 'main.js'],
ico: '/static/foo.ico',
ico: 'favicon.ico',
};
// "base" is expected to be result of getPublicUrl
// i.e. it must be valid URL with trailing slash
describe('template', () => {
test('custom render', () => {
expect(
template({ options: { base: 'http://domain.com' }, manifest: exampleManifest }, manifest)
template({ options: { base: 'http://domain.com/' }, manifest: exampleManifest }, manifest)
).toMatchSnapshot();
});
test('custom title', () => {
expect(
template(
{ options: { base: 'http://domain.com', title: 'foo title' }, manifest: exampleManifest },
manifest
)
).toMatchSnapshot();
});
test('custom title', () => {
expect(
template(
{ options: { base: 'http://domain.com', title: 'foo title' }, manifest: exampleManifest },
{ options: { base: 'http://domain.com/', title: 'foo title' }, manifest: exampleManifest },
manifest
)
).toMatchSnapshot();
@ -37,7 +32,7 @@ describe('template', () => {
expect(
template(
{
options: { base: 'http://domain.com' },
options: { base: 'http://domain.com/' },
metaScripts: [`<style>.someclass{font-size:10px;}</style>`],
manifest: exampleManifest,
},
@ -50,7 +45,7 @@ describe('template', () => {
expect(
template(
{
options: { base: 'http://domain.com' },
options: { base: 'http://domain.com/' },
scriptsBodyAfter: [`<script src="foo"/>`],
manifest: exampleManifest,
},
@ -63,7 +58,7 @@ describe('template', () => {
expect(
template(
{
options: { base: 'http://domain.com' },
options: { base: 'http://domain.com/' },
scriptsbodyBefore: [`<script src="fooBefore"/>`, `<script src="barBefore"/>`],
manifest: exampleManifest,
},