d2lang/d2 · error · Error

response.error.message

Error message

response.error.message

What it means

In the browser worker's handleMessage, the compile case calls the WASM d2.compile, JSON-parses the result, and if the response object contains an error field it throws new Error(response.error.message). This is how D2 surfaces compilation failures from Go/WASM (e.g., invalid D2 script) to the main thread, where they arrive as a rejected promise with that message.

Source

Thrown at d2js/js/src/worker.browser.js:32

    switch (type) {
      case "init":
        try {
          if (isNode) {
            loadScript(data.wasmExecContent);
          }
          d2 = await initWasm(data.wasm);
          currentPort.postMessage({ type: "ready" });
        } catch (err) {
          currentPort.postMessage({ type: "error", error: err.message });
        }
        break;

      case "compile":
        try {
          const result = await d2.compile(JSON.stringify(data));
          const response = JSON.parse(result);
          if (response.error) throw new Error(response.error.message);
          currentPort.postMessage({ id, type: "result", data: response.data });
        } catch (err) {
          currentPort.postMessage({ id, type: "error", error: err.message });
        }
        break;

      case "render":
        try {
          const result = await d2.render(JSON.stringify(data));
          const response = JSON.parse(result);
          if (response.error) throw new Error(response.error.message);
          const decoded = new TextDecoder().decode(
            Uint8Array.from(atob(response.data), (c) => c.charCodeAt(0))
          );
          currentPort.postMessage({ id, type: "result", data: decoded });
        } catch (err) {
          currentPort.postMessage({ id, type: "error", error: err.message });
        }

View on GitHub (pinned to 0d69dca6f5)

Solutions

  1. Read the thrown message — it is the D2 compiler error including line/position — and fix the diagram source
  2. Validate/lint the D2 script before compiling (e.g., editor with D2 syntax support)
  3. Pin/check the wasm D2 version (d2.version()) if the script uses newer syntax
  4. Wrap compile in try/catch and surface the message to your users or logs

Example fix

// before
await d2.compile('a -> '); // invalid script, throws compiler error
// after
await d2.compile('a -> b'); // valid D2 script
Defensive patterns

Strategy: validation

Validate before calling

function isPlainD2Script(src) {
  return typeof src === 'string' && src.trim().length > 0 && !/[\u0000-\u0008]/.test(src);
}
if (!isPlainD2Script(source)) throw new TypeError('D2 source must be a non-empty string');

Type guard

function isCompileRequest(input) {
  return typeof input === 'string' ||
    (input !== null && typeof input === 'object' && !Array.isArray(input));
}

Try / catch

try {
  const result = await d2.compile(source);
} catch (err) {
  // err.message contains the D2 compiler diagnostic (line/position)
  console.error('D2 compile failed:', err.message);
  throw new SyntaxError('Invalid D2 script: ' + err.message);
}

Prevention

When it happens

Trigger: Calling d2.compile() (via new D2()) with D2 source that fails to compile: syntax errors, unknown shape/keyword, invalid connections, or bad options passed in the request object.

Common situations: Typos in D2 diagram script; using D2 syntax unsupported by the bundled wasm version; passing options with invalid values (e.g., unknown theme id or layout engine); programmatically generated scripts with malformed input.

Related errors


AI-assisted analysis of d2lang/d2@0d69dca6f5 (2026-08-31). Data as JSON: /api/errors/93d334429845ccac. Report an issue: GitHub.