Fix a bug that Japanese files were not displayed correctly. (#9866)

* Fix: Fix a bug that Japanese files were not displayed correctly. * chore: generate change description * Update .changeset/cool-colts-watch.md * add test case for non-UTF-8 file name --------- Co-authored-by: Emanuele Stoppa <[email protected]>
withastro · Jan 29, 2024 · 44c957f · 44c957f
1 parent a994d60
commit 44c957f
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 2 deletions.
diff --git a/.changeset/cool-colts-watch.md b/.changeset/cool-colts-watch.md
@@ -0,0 +1,5 @@
+---
+"@astrojs/markdown-remark": patch
+---
+
+Fixes a bug where non-UTF-8 file names are not displayed when using relative paths in markdowns.
diff --git a/packages/astro/test/astro-assets-prefix.test.js b/packages/astro/test/astro-assets-prefix.test.js
@@ -51,8 +51,10 @@ describe('Assets Prefix - Static', () => {
 	it('markdown image src start with assetsPrefix', async () => {
 		const html = await fixture.readFile('/markdown/index.html');
 		const $ = cheerio.load(html);
-		const imgAsset = $('img');
-		expect(imgAsset.attr('src')).to.match(assetsPrefixRegex);
+		const imgAssets = $('img');
+		imgAssets.each((i, el) => {
+			expect(el.attribs.src).to.match(assetsPrefixRegex);
+		});
 	});
 
 	it('content collections image src start with assetsPrefix', async () => {

diff --git a/packages/astro/test/fixtures/astro-assets-prefix/src/assets/ペンギン.jpg b/packages/astro/test/fixtures/astro-assets-prefix/src/assets/ペンギン.jpg
diff --git a/packages/astro/test/fixtures/astro-assets-prefix/src/pages/markdown.md b/packages/astro/test/fixtures/astro-assets-prefix/src/pages/markdown.md
@@ -3,3 +3,5 @@
 Relative image has assetsPrefix
 
 ![Relative image](../assets/penguin1.jpg)
+
+![non-UTF-8 file name image](../assets/ペンギン.jpg)
diff --git a/packages/markdown/remark/src/rehype-images.ts b/packages/markdown/remark/src/rehype-images.ts
@@ -11,6 +11,8 @@ export function rehypeImages() {
 				if (node.tagName !== 'img') return;
 
 				if (node.properties?.src) {
+					node.properties.src = decodeURI(node.properties.src);
+
 					if (file.data.imagePaths?.has(node.properties.src)) {
 						const { ...props } = node.properties;
Original file line number	Diff line number	Diff line change
Expand Up		@@ -3,3 +3,5 @@
		Relative image has assetsPrefix

		![Relative image](../assets/penguin1.jpg)

		![non-UTF-8 file name image](../assets/ペンギン.jpg)