From 9a751d5fa101fef1dd8b2af25649b08587a0af4f Mon Sep 17 00:00:00 2001
From: delfino <delfino@dolphinlabs.co.uk>
Date: Fri, 28 Feb 2025 17:04:45 +0000
Subject: [PATCH] d2js: support unicode characters

---
 ci/release/changelogs/next.md   |  1 +
 d2js/js/src/worker.browser.js   |  5 ++++-
 d2js/js/src/worker.node.js      |  5 ++++-
 d2js/js/test/unit/basic.test.js | 11 +++++++++++
 4 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/ci/release/changelogs/next.md b/ci/release/changelogs/next.md
index 63cd026c6..07f70f859 100644
--- a/ci/release/changelogs/next.md
+++ b/ci/release/changelogs/next.md
@@ -27,3 +27,4 @@
   - fixes panic when comment lines appear in arrays [#2378](https://github.com/terrastruct/d2/pull/2378)
   - fixes inconsistencies when objects were double quoted [#2390](https://github.com/terrastruct/d2/pull/2390)
 - CLI: fetch and render remote images of mimetype octet-stream correctly [#2370](https://github.com/terrastruct/d2/pull/2370)
+- d2js: handle unicode characters (PR pending)
diff --git a/d2js/js/src/worker.browser.js b/d2js/js/src/worker.browser.js
index 4989a76df..a9cff400f 100644
--- a/d2js/js/src/worker.browser.js
+++ b/d2js/js/src/worker.browser.js
@@ -54,7 +54,10 @@ export function setupMessageHandler(isNode, port, initWasm) {
           const result = await d2.render(JSON.stringify(data));
           const response = JSON.parse(result);
           if (response.error) throw new Error(response.error.message);
-          currentPort.postMessage({ type: "result", data: atob(response.data) });
+          const decoded = new TextDecoder().decode(
+            Uint8Array.from(atob(response.data), (c) => c.charCodeAt(0))
+          );
+          currentPort.postMessage({ type: "result", data: decoded });
         } catch (err) {
           currentPort.postMessage({ type: "error", error: err.message });
         }
diff --git a/d2js/js/src/worker.node.js b/d2js/js/src/worker.node.js
index 0e5cda307..33e6c8dd0 100644
--- a/d2js/js/src/worker.node.js
+++ b/d2js/js/src/worker.node.js
@@ -49,7 +49,10 @@ export function setupMessageHandler(isNode, port, initWasm) {
           const result = await d2.render(JSON.stringify(data));
           const response = JSON.parse(result);
           if (response.error) throw new Error(response.error.message);
-          currentPort.postMessage({ type: "result", data: atob(response.data) });
+          const decoded = new TextDecoder().decode(
+            Uint8Array.from(atob(response.data), (c) => c.charCodeAt(0))
+          );
+          currentPort.postMessage({ type: "result", data: decoded });
         } catch (err) {
           currentPort.postMessage({ type: "error", error: err.message });
         }
diff --git a/d2js/js/test/unit/basic.test.js b/d2js/js/test/unit/basic.test.js
index 7841e8100..fe72c1455 100644
--- a/d2js/js/test/unit/basic.test.js
+++ b/d2js/js/test/unit/basic.test.js
@@ -171,6 +171,17 @@ layers: {
     await d2.worker.terminate();
   }, 20000);
 
+  test("unicode characters work", async () => {
+    const d2 = new D2();
+    const result = await d2.compile("こんにちは -> ♒️");
+    const svg = await d2.render(result.diagram);
+    expect(svg).toContain("<svg");
+    expect(svg).toContain("</svg>");
+    expect(svg).toContain("こんにちは");
+    expect(svg).toContain("♒️");
+    await d2.worker.terminate();
+  }, 20000);
+
   test("handles syntax errors correctly", async () => {
     const d2 = new D2();
     try {