[fix] handle binary data when prerendering (#5497)

* fix: corrupted images when using adapter-static

this is to fix issue mentioned [here](#5088)

body was always converted using `response.text()` which was always decoded with UTF-8 which then is breaking buffers

* fix: lint fix

lint fix

* chore: lint fix

lint fix

* always use Buffer

* Create popular-plants-begin.md

* added test for binary files after prerender

* linting

* added node fetch and fix linting

* changed get to GET as per latest kit

* using local images for test instead of urls and fetch

* Update packages/kit/test/prerendering/basics/test/test.js

* Update packages/kit/test/prerendering/basics/test/test.js

Co-authored-by: Conduitry <[email protected]>
Co-authored-by: Ben McCann <[email protected]>
Co-authored-by: gbkwiatt <[email protected]>
Co-authored-by: Rich Harris <[email protected]>

Author: 5 people

.changeset/popular-plants-begin.md

@@ -0,0 +1,5 @@
+---
+"@sveltejs/kit": patch
+---
+
+[fix] handle binary data when prerendering

packages/kit/src/core/prerender/prerender.js

@@ -136,9 +136,9 @@ export async function prerender({ config, entries, files, log }) {
 			}
 		});
 
-		const text = await response.text();
+		const body = Buffer.from(await response.arrayBuffer());
 
-		save('pages', response, text, decoded, encoded, referrer, 'linked');
+		save('pages', response, body, decoded, encoded, referrer, 'linked');
 
 		for (const [dependency_path, result] of dependencies) {
 			// this seems circuitous, but using new URL allows us to not care
@@ -159,7 +159,7 @@ export async function prerender({ config, entries, files, log }) {
 		}
 
 		if (config.prerender.crawl && response.headers.get('content-type') === 'text/html') {
-			for (const href of crawl(text)) {
+			for (const href of crawl(body.toString())) {
 				if (href.startsWith('data:') || href.startsWith('#')) continue;
 
 				const resolved = resolve(encoded, href);

packages/kit/test/prerendering/basics/src/routes/fetch-image.svelte

@@ -0,0 +1,2 @@
+<img src="/fetch-image/image.jpg" alt="" />
+<img src="/fetch-image/image.png" alt="" />

packages/kit/test/prerendering/basics/src/routes/fetch-image/[...slug]/index.js

@@ -0,0 +1,16 @@
+import * as fs from 'fs';
+
+export async function GET({ params }) {
+	const slug = params.slug.split('/');
+	const extension = slug[0].split('.').pop();
+
+	const file = fs.readFileSync(`./static/image.${extension}`);
+
+	return {
+		status: 200,
+		headers: {
+			'Content-Type': 'image/' + extension
+		},
+		body: file
+	};
+}

packages/kit/test/prerendering/basics/static/image.jpg

@@ -6,7 +6,7 @@ import * as assert from 'uvu/assert';
 const build = fileURLToPath(new URL('../build', import.meta.url));
 
 /** @param {string} file */
-const read = (file) => fs.readFileSync(`${build}/${file}`, 'utf-8');
+const read = (file, encoding = 'utf-8') => fs.readFileSync(`${build}/${file}`, encoding);
 
 test('prerenders /', () => {
 	const content = read('index.html');
@@ -144,4 +144,9 @@ test('targets the data-sveltekit-hydrate parent node', () => {
 	);
 });
 
+test('prerenders binary data', async () => {
+	assert.equal(Buffer.compare(read('fetch-image/image.jpg', null), read('image.jpg', null)), 0);
+	assert.equal(Buffer.compare(read('fetch-image/image.png', null), read('image.png', null)), 0);
+});
+
 test.run();