mercuryworkshop-mirror/scramjet
1
0
Fork 0
mirror of https://github.com/MercuryWorkshop/scramjet.git synced 2025-05-14 23:10:02 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #16 from gennaroterry/main

Browse source 
fix: Improve srcset rewriter to handle descriptors correctly.
This commit is contained in:
Percs 2024-11-17 17:17:02 -06:00 • committed by GitHub
commit f0ee17720d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 72 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/shared/rewriters/html.ts
View file

@ -52,10 +52,13 @@ export function rewriteHtml(
const script = (src) => new Element("script", { src });
// for compatibility purpose
const base64Injected = bytesToBase64(new TextEncoder().encode(injected));
head.children.unshift(
script($scramjet.config.files.wasm),
script($scramjet.config.files.shared),
script("data:application/javascript;base64," + btoa(injected)),
script("data:application/javascript;base64," + base64Injected),
script($scramjet.config.files.client)
);
}
@ -283,17 +286,20 @@ function traverseParsedHtml(
}
export function rewriteSrcset(srcset: string, meta: URLMeta) {
const urls = srcset.split(/ [0-9]+x,? ?/g);
if (!urls) return "";
const sufixes = srcset.match(/ [0-9]+x,? ?/g);
if (!sufixes) return "";
const rewrittenUrls = urls.map((url, i) => {
if (url && sufixes[i]) {
return rewriteUrl(url, meta) + sufixes[i];
}
const sources = srcset.split(",").map((src) => src.trim());
const rewrittenSources = sources.map((source) => {
// Split into URLs and descriptors (if any)
// e.g. url0, url1 1.5x, url2 2x
const [url, ...descriptors] = source.split(/\s+/);
// Rewrite the URLs and keep the descriptors (if any)
const rewrittenUrl = rewriteUrl(url.trim(), meta);
return descriptors.length > 0
? `${rewrittenUrl} ${descriptors.join(" ")}`
: rewrittenUrl;
});
return rewrittenUrls.join("");
return rewrittenSources.join(", ");
}
// function base64ToBytes(base64) {

41
src/worker/error.ts
View file

@ -9,6 +9,14 @@ export function errorTemplate(trace: string, fetchedURL: string) {
reload.addEventListener("click", () => location.reload());
version.textContent = ${JSON.stringify($scramjet.version.version)};
build.textContent = ${JSON.stringify($scramjet.version.build)};
document.getElementById('copy-button').addEventListener('click', async () => {
const text = document.getElementById('errorTrace').value;
await navigator.clipboard.writeText(text);
const btn = document.getElementById('copy-button');
btn.textContent = 'Copied!';
setTimeout(() => btn.textContent = 'Copy', 2000);
});
`;
return `<!DOCTYPE html>
@ -94,10 +102,11 @@ export function errorTemplate(trace: string, fetchedURL: string) {
}
#version-wrapper {
width: 100%;
text-align: center;
width: auto;
text-align: right;
position: absolute;
bottom: 0.2rem;
top: 0.5rem;
right: 0.5rem;
font-size: 0.8rem;
color: var(--shore)!important;
i {
@ -107,6 +116,26 @@ export function errorTemplate(trace: string, fetchedURL: string) {
}
z-index: 101;
}
#errorTrace-wrapper {
position: relative;
width: fit-content;
}
#copy-button {
position: absolute;
top: 0.5em;
right: 0.5em;
padding: 0.23em;
cursor: pointer;
opacity: 0;
transition: opacity 0.4s;
font-size: 0.9em;
}
#errorTrace-wrapper:hover #copy-button {
opacity: 1;
}
</style>
</head>
<body>
@ -117,8 +146,10 @@ export function errorTemplate(trace: string, fetchedURL: string) {
<!-- <p id="errorMessage">Internal Server Error</p> -->
<div id="info">
<textarea id="errorTrace" cols="40" rows="10" readonly>
</textarea>
<div id="errorTrace-wrapper">
<textarea id="errorTrace" cols="40" rows="10" readonly></textarea>
<button id="copy-button" class="primary">Copy</button>
</div>
<div id="troubleshooting">
<p>Try:</p>
<ul>

22
src/worker/fetch.ts
View file

@ -178,11 +178,29 @@ export async function handleFetch(
this
);
} catch (err) {
console.error("ERROR FROM SERVICE WORKER FETCH", err);
const errorDetails = {
message: err.message,
url: request.url,
destination: request.destination,
timestamp: new Date().toISOString(),
};
if (err.stack) {
errorDetails["stack"] = err.stack;
}
console.error("ERROR FROM SERVICE WORKER FETCH: ", errorDetails);
if (!["document", "iframe"].includes(request.destination))
return new Response(undefined, { status: 500 });
return renderError(err, unrewriteUrl(request.url));
const formattedError = Object.entries(errorDetails)
.map(
([key, value]) =>
`${key.charAt(0).toUpperCase() + key.slice(1)}: ${value}`
)
.join("\n\n");
return renderError(formattedError, unrewriteUrl(request.url));
}
}