fix: handle srcset local image paths with spaces

.changeset/weak-oranges-relate.md

@@ -0,0 +1,5 @@
+---
+"astro": patch
+---
+
+`<Image />` srcset now parses encoded paths correctly

packages/astro/src/assets/internal.ts

@@ -110,7 +110,7 @@ export async function getImage(
 		src: imageURL,
 		srcSet: {
 			values: srcSets,
-			attribute: srcSets.map((srcSet) => `${srcSet.url} ${srcSet.descriptor}`).join(', '),
+			attribute: srcSets.map((srcSet) => `${encodeURI(srcSet.url)} ${srcSet.descriptor}`).join(', '),
 		},
 		attributes:
 			service.getHTMLAttributes !== undefined

packages/astro/test/core-image.test.js

@@ -945,6 +945,17 @@ describe('astro:image', () => {
 			expect(data).to.be.an.instanceOf(Buffer);
 		});
 
+		it('client images srcset parsed correctly', async () => {
+			const html = await fixture.readFile('/srcset/index.html');
+			const $ = cheerio.load(html);
+			const srcset = $('#local-2-widths-with-spaces img').attr('srcset');
+
+			// Find image
+			const regex = /^(.+?) [0-9]+[wx]$/gm;
+			const imageSrcset = regex.exec(srcset)[1];
+			expect(imageSrcset).to.not.contain(' ');
+		});
+
 		describe('custom service in build', () => {
 			it('uses configured hashes properties', async () => {
 				await fixture.build();

packages/astro/test/fixtures/core-image-ssg/src/pages/srcset.astro

@@ -0,0 +1,15 @@
+---
+import { Image } from "astro:assets";
+import imageWithSpaces from "../assets/image 1.jpg";
+---
+
+<div id="local-2-widths-with-spaces">
+	<!--
+		In this example, only two images should be generated :
+		- The base image
+		- The 2x image
+		- The image path should replace ' ' with '%20' in srcset 
+	-->
+	<Image src={imageWithSpaces} width={imageWithSpaces.width / 2} widths={[imageWithSpaces.width]} alt="" />
+</div>
+