fix: should respect charset=utf-8 in data uri (#528)

Close #291
vercel · Aug 11, 2023 · 0a05c92 · 0a05c92 · vercel · Aug 11, 2023
1 parent 3f598c2
commit 0a05c92
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/src/handler/image.ts b/src/handler/image.ts
@@ -174,7 +174,7 @@ export async function resolveImageData(
 
  try {
  decodedURI =
- /data:(?<imageType>[a-z/+]+)(;(?<encodingType>base64|utf8))?,(?<dataString>.*)/g.exec(
+ /data:(?<imageType>[a-z/+]+)(;(charset=)?(?<encodingType>.*))?,(?<dataString>.*)/g.exec(
  src
  ).groups as typeof decodedURI
  } catch (err) {

diff --git a/...test-image-test-tsx-background-image-url-should-handle-charset-utf-8-1-snap.png b/...test-image-test-tsx-background-image-url-should-handle-charset-utf-8-1-snap.png
diff --git a/test/image.test.tsx b/test/image.test.tsx
@@ -620,4 +620,22 @@ describe('background-image: url()', () => {
 
  expect(toImage(svg, 100)).toMatchImageSnapshot()
  })
+
+ it('should handle charset=utf-8', async () => {
+ const svg = await satori(
+ <div
+ style={{
+ width: '100px',
+ height: '100px',
+ display: 'flex',
+ backgroundImage:
+ 'url(\'data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40"><circle cx="20" cy="20" r="15" fill="#ee7621"/></svg>\')',
+ backgroundSize: '100px 100px',
+ }}
+ ></div>,
+ { width: 100, height: 100, fonts }
+ )
+
+ expect(toImage(svg, 100)).toMatchImageSnapshot()
+ })
 })