Skip to content

fix(ts-sdk): decode base64 data URLs with media-type parameters - #247

Open
rohitsux wants to merge 4 commits into
superlinked:mainfrom
rohitsux:fix/data-url-media-type-params
Open

rohitsux wants to merge 4 commits into
superlinked:mainfrom
rohitsux:fix/data-url-media-type-params

Conversation

@rohitsux

@rohitsux rohitsux commented Aug 31, 2026

Copy link
Copy Markdown

Problem

toImageBytes() in packages/sie_ts_sdk/src/images.ts detects base64 data URLs with the regex:

/^data:[^;]+;base64,(.+)$/

This requires the media type segment to contain no ;. Per RFC 2397, though, the media type may carry parameters (e.g. ;charset=utf-8) or be omitted entirely. Data URLs like:

  • data:image/svg+xml;charset=utf-8;base64,...
  • data:;base64,...

don't match this pattern and fall through to the plain base64 branch, which hands the entire data URL string (including the data:...;base64, prefix) to the base64 decoder. That decoder then either throws InvalidCharacterError under atob (browser) or silently produces corrupted bytes under Buffer.from (Node) — neither of which surfaces as a clear "unsupported input" error.

Fix

Match up to the ;base64, marker instead of requiring a ;-free segment:

/^data:[^,]*;base64,(.+)$/

Base64 payloads never contain a comma, so the capture group still correctly isolates just the payload. Behavior for all previously-matching data URLs is unchanged.

Tests

Added two regression tests to packages/sie_ts_sdk/tests/images.test.ts:

  • a data URL whose media type carries a parameter (image/svg+xml;charset=utf-8)
  • a data URL with an omitted media type (data:;base64,...)

Verified locally: fails-before (both new tests throw on the unpatched regex) / passes-after. tests/images.test.ts 17/17; full @superlinked/sie-sdk suite 484/484; biome check clean; tsc --noEmit (typecheck) clean.

Summary by CodeRabbit

  • Bug Fixes

    • Improved image decoding for base64 data URLs with media type parameters, omitted media types, uppercase markers, and percent-encoded payloads.
    • Added clear errors for unsupported non-base64 data URLs, missing payload delimiters, invalid encoding, and empty payloads.
    • Plain base64 strings continue to decode as expected.
  • Tests

    • Added coverage for varied data URL formats, percent encoding, case variations, and malformed or unsupported inputs.

toImageBytes()'s regex ^data:[^;]+;base64, requires a ;-free media
type, so valid RFC 2397 data URLs with a media-type parameter (e.g.
data:image/svg+xml;charset=utf-8;base64,...) or an omitted media type
(data:;base64,...) don't match and fall through, handing the entire
data URL to the base64 decoder. That decoder then throws
InvalidCharacterError under atob (browser) or silently corrupts bytes
under Buffer.from (Node).

Fix matches up to the ;base64, marker ([^,]*) instead. Base64 payloads
never contain a comma, so the payload is still captured correctly. No
change in behavior for existing inputs.

Added two regression tests covering a media type with a parameter and
an omitted media type.
@coderabbitai

coderabbitai Bot commented Aug 31, 2026

Copy link
Copy Markdown

Review Change StackReview Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Advanced

Run ID: 657ded83-6cdf-4e9f-bd95-212a6a420523

📥 Commits

Reviewing files that changed from the base of the PR and between 970ddda and 20a01e9.

📒 Files selected for processing (2)
  • packages/sie_ts_sdk/src/images.ts
  • packages/sie_ts_sdk/tests/images.test.ts

Included review availability: Your plan provides up to 8 included reviews per hour; 7 remain after this review.


📝 Walkthrough

Walkthrough

Changes

Image data URL decoding

Layer / File(s) Summary
Data URL detection and validation
packages/sie_ts_sdk/src/images.ts, packages/sie_ts_sdk/tests/images.test.ts
toImageBytes now parses case-insensitive base64 data URLs with media-type parameters, omitted media types, and percent-encoded payloads. It rejects empty payloads, non-base64 data URLs, missing delimiters, and invalid percent-encoding. Tests cover successful decoding and these error cases.

Suggested reviewers: fm1320

Priority: ⬇️ Low

Merge Risk: ⚪ Minimal · up to 20a01

The SDK now accepts more valid base64 data URL forms and rejects malformed or empty payloads before image submission. Covered parsing and error behavior leave no current merge-blocking risk.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly identifies the TypeScript SDK fix for decoding base64 data URLs with media-type parameters. It is concise and accurately reflects the main change.
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 2 functions across 2 files.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Warning

Some tools did not complete. Review the errors below.

🔧 Biome (2.5.8)
packages/sie_ts_sdk/src/images.ts

Biome could not lint this file: configuration resulted in errors. Check the repository's Biome configuration and plugins.

packages/sie_ts_sdk/tests/images.test.ts

Biome could not lint this file: configuration resulted in errors. Check the repository's Biome configuration and plugins.


Comment @coderabbitai help to get the list of available commands.

coderabbitai[bot]
coderabbitai Bot previously approved these changes Aug 31, 2026
@mamayer19
mamayer19 requested a review from a team as a code owner September 7, 2026 08:06

@mamayer19 mamayer19 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the contribution, this reproduces the original issue clearly, and both new cases pass locally. I left one suggestion about parsing the data URL structurally instead of broadening the regex, along with a few related edge cases that would make the behavior explicit.

Comment thread packages/sie_ts_sdk/src/images.ts Outdated
Comment thread packages/sie_ts_sdk/tests/images.test.ts
…ases

Replace the data-URL regex in toImageBytes with a parseBase64DataUrl helper
that walks the RFC 2397 grammar structurally: it splits on the first comma,
matches the data: scheme and the base64 marker case-insensitively,
percent-decodes the payload, and throws a clear error for a malformed or
non-base64 data: URL instead of silently handing it to the base64 decoder.
base64ToBytes is now responsible only for decoding the extracted payload.

Add tests for an uppercase scheme and BASE64 marker, percent-escaped padding
(%3D), an empty payload, and the two clear-error cases.
coderabbitai[bot]
coderabbitai Bot previously approved these changes Sep 8, 2026
@rohitsux

rohitsux commented Sep 8, 2026

Copy link
Copy Markdown
Author

Thanks for the review — reworked it along your suggestion.

  • Replaced the regex with parseBase64DataUrl(input): string | undefined that walks the grammar structurally: it finds the first comma, checks the ;-delimited metadata's last segment for the base64 marker, matches the data: scheme and the marker case-insensitively, and percent-decodes the payload. base64ToBytes is now responsible only for decoding the extracted payload.
  • Inputs like DATA:image/png;BASE64,SGVsbG8%3D now parse correctly. A data: URL that's malformed (no comma / bad percent-encoding) or not base64-encoded throws a clear error instead of falling through to the raw decoder; a non-data: string still returns undefined and is treated as raw base64.
  • Added tests for the uppercase scheme/BASE64 marker, percent-escaped %3D padding, an empty payload, and the two error cases.

Full SDK suite is green (513) with typecheck + biome clean. Happy to adjust the error wording if you'd prefer something different.

Comment thread packages/sie_ts_sdk/src/images.ts
… bytes

An empty base64 payload (e.g. "data:;base64,") previously decoded to an empty
Uint8Array and succeeded, so a zero-byte image was sent over the wire and only
failed deep in the server, far from the mistake. parseBase64DataUrl now throws
a clear error for an empty payload, and the empty-payload test expects it.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants