feat(ext/web): add `ImageData` `Float16Array` support by 0f-0b · Pull Request #31394 · denoland/deno

0f-0b · 2025-11-24T21:13:19Z

coderabbitai · 2025-11-24T21:13:40Z

Walkthrough

This pull request adds Float16Array support to Deno's ImageData API. It introduces two new public types (ImageDataArray and ImageDataPixelFormat) to the web type definitions, extending ImageData and ImageDataSettings to support pixel format selection between "rgba-unorm8" (Uint8ClampedArray) and "rgba-float16" (Float16Array). The runtime implementation in ext/web/16_image_data.js validates pixel format against data type, allocates appropriate backing arrays, and exposes the pixel format via a getter. Helper logic in ext/canvas/01_image.js converts Float16Array to Uint8ClampedArray when needed. Tests verify both constructor overloads and validate the new pixelFormat property.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Constructor as ImageData<br/>Constructor
    participant Validator as Validator
    participant Buffer as Buffer<br/>Allocation
    
    User->>Constructor: new ImageData(sw, sh, settings?)
    Constructor->>Validator: Validate settings.pixelFormat<br/>(default: rgba-unorm8)
    Validator-->>Constructor: pixelFormat: ImageDataPixelFormat
    Constructor->>Buffer: Allocate backing array<br/>(Uint8ClampedArray or Float16Array)
    Buffer-->>Constructor: data buffer
    Constructor-->>User: ImageData instance<br/>with pixelFormat getter
    
    User->>Constructor: new ImageData(data: ImageDataArray, sw, sh?, settings?)
    Constructor->>Validator: Validate data type matches<br/>pixelFormat
    alt data is Uint8ClampedArray
        Validator-->>Constructor: OK (rgba-unorm8)
    else data is Float16Array
        Validator-->>Constructor: OK (rgba-float16)
    end
    Constructor->>Buffer: Use provided data buffer
    Buffer-->>Constructor: buffer view
    Constructor-->>User: ImageData instance<br/>with pixelFormat getter

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Type definition alignment: Verify that ImageDataArray union and ImageDataPixelFormat literals are correctly propagated across type definitions and runtime implementations.
Data type validation: Check that the runtime validation in ext/web/16_image_data.js correctly enforces pixelFormat-to-data-type matching (e.g., Float16Array only with rgba-float16).
Float16Array conversion logic: Review the float16ToUnorm8 helper function in ext/canvas/01_image.js for correctness of the 0–255 scaling conversion.
Constructor overload handling: Ensure both constructor paths (width/height vs. data) correctly allocate and assign backing arrays according to pixelFormat.
Test coverage: Verify that new tests exercise both data types and validate pixelFormat defaults and explicit values.

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run `@coderabbitai generate docstrings` to improve docstring coverage.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes the main feature addition: Float16Array support for ImageData in the web extension module.
Description check	✅ Passed	The description references the specific WHATWG HTML issue being implemented, which is directly related to the changeset of adding Float16Array support to ImageData.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 0a3c932 and 13bd09c.

📒 Files selected for processing (4)

cli/tsc/dts/lib.deno_web.d.ts (1 hunks)
ext/canvas/01_image.js (3 hunks)
ext/web/16_image_data.js (8 hunks)
tests/unit/image_data_test.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (1)

**/*.{ts,tsx,js}

📄 CodeRabbit inference engine (CLAUDE.md)

**/*.{ts,tsx,js}: For JavaScript runtime debugging, enable V8 inspector with --inspect-brk flag and connect Chrome DevTools to chrome://inspect
Use console.log() for debug prints in JavaScript runtime code

Files:

tests/unit/image_data_test.ts
ext/web/16_image_data.js
cli/tsc/dts/lib.deno_web.d.ts
ext/canvas/01_image.js

🧬 Code graph analysis (2)

ext/web/16_image_data.js (1)

ext/web/06_streams.js (1)

tag (2003-2003)

ext/canvas/01_image.js (1)

ext/web/16_image_data.js (1)

_data (41-41)

🪛 Biome (2.1.2)

ext/canvas/01_image.js

[error] 18-18: Do not shadow the global "Uint8Array" property.

Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.

(lint/suspicious/noShadowRestrictedNames)

[error] 19-19: Do not shadow the global "Uint8ClampedArray" property.

Consider renaming this variable. It's easy to confuse the origin of variables when they're named after a known global.

(lint/suspicious/noShadowRestrictedNames)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (12)

GitHub Check: test debug linux-x86_64
GitHub Check: test debug macos-x86_64
GitHub Check: lint debug windows-x86_64
GitHub Check: test debug linux-aarch64
GitHub Check: test release windows-x86_64
GitHub Check: test release linux-x86_64
GitHub Check: test debug windows-x86_64
GitHub Check: test release macos-aarch64
GitHub Check: test debug macos-aarch64
GitHub Check: build libs
GitHub Check: lint debug linux-x86_64
GitHub Check: lint debug macos-x86_64

🔇 Additional comments (7)

cli/tsc/dts/lib.deno_web.d.ts (1)

1460-1492: LGTM!

Type definitions correctly expose the new Float16Array support for ImageData. The ImageDataArray union, ImageDataPixelFormat literal type, and updated interface/constructor signatures align with the WHATWG spec proposal.

ext/canvas/01_image.js (2)

160-167: Potential edge case: out-of-range Float16 values.

The conversion assumes float16 values are normalized in [0, 1]. If values are outside this range (e.g., negative or >1), Uint8ClampedArray would clamp them, but since you're using a regular Uint8ClampedArray constructor, the clamping will happen correctly. The implementation is fine.

312-322: LGTM!

The Float16Array detection and conversion logic is correct. The switch-case pattern using TypedArrayPrototypeGetSymbolToStringTag is consistent with existing Deno codebase patterns.

tests/unit/image_data_test.ts (1)

42-71: LGTM!

Good test coverage for the new Float16Array support. Tests cover both constructor overloads with the new pixelFormat option and validate data reference preservation with assertStrictEquals.

ext/web/16_image_data.js (3)

24-37: LGTM!

The ImageDataPixelFormat enum converter and its integration into ImageDataSettings with the correct default value is well implemented.

143-160: LGTM!

Good validation to ensure the typed array matches the declared pixelFormat. This prevents runtime mismatches where a user might accidentally pass the wrong combination.

202-210: TODO acknowledged for Float16Array primordials.

The TODO comment about adding Float16Array to primordials is noted. Per the past review comment, using Float16Array directly (like Temporal) is acceptable for now.

Tip

📝 Customizable high-level summaries are now available in beta!

You can now customize how CodeRabbit generates the high-level summary in your pull requests — including its content, structure, tone, and formatting.

Provide your own instructions using the high_level_summary_instructions setting.
Format the summary however you like (bullet lists, tables, multi-section layouts, contributor stats, etc.).
Use high_level_summary_in_walkthrough to move the summary from the description to the walkthrough section.

Example instruction:

"Divide the high-level summary into five sections:

📝 Description — Summarize the main change in 50–60 words, explaining what was done.

📓 References — List relevant issues, discussions, documentation, or related PRs.

📦 Dependencies & Requirements — Mention any new/updated dependencies, environment variable changes, or configuration updates.

📊 Contributor Summary — Include a Markdown table showing contributions:
| Contributor | Lines Added | Lines Removed | Files Changed |

✔️ Additional Notes — Add any extra reviewer context.
Keep each section concise (under 200 words) and use bullet or numbered lists for clarity."

Note: This feature is currently in beta for Pro-tier users, and pricing will be announced later.

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

bartlomieju · 2025-11-25T11:57:00Z

Thanks! Do we need to update MDN pages with this change?

0f-0b · 2025-11-25T16:20:53Z

Thanks! Do we need to update MDN pages with this change?

Just the compat data needs updating.

crowlKats

LGTM, thank you!

bartlomieju reviewed Nov 26, 2025

View reviewed changes

Comment thread ext/web/16_image_data.js Outdated

feat(ext/web): add ImageData Float16Array support

13bd09c

0f-0b force-pushed the image-data-float16 branch from 0a3c932 to 13bd09c Compare November 26, 2025 14:17

bartlomieju requested a review from crowlKats November 26, 2025 14:23

crowlKats approved these changes Nov 27, 2025

View reviewed changes

bartlomieju merged commit 24a0209 into denoland:main Nov 27, 2025
20 checks passed

0f-0b deleted the image-data-float16 branch November 27, 2025 19:04

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(ext/web): add `ImageData` `Float16Array` support#31394

feat(ext/web): add `ImageData` `Float16Array` support#31394
bartlomieju merged 1 commit intodenoland:mainfrom
0f-0b:image-data-float16

0f-0b commented Nov 24, 2025

Uh oh!

coderabbitai bot commented Nov 24, 2025 •

edited

Loading

Uh oh!

bartlomieju commented Nov 25, 2025

Uh oh!

0f-0b commented Nov 25, 2025

Uh oh!

Uh oh!

crowlKats left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Conversation

0f-0b commented Nov 24, 2025

Uh oh!

coderabbitai bot commented Nov 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Sequence Diagram(s)

Estimated code review effort

Pre-merge checks and finishing touches

Uh oh!

bartlomieju commented Nov 25, 2025

Uh oh!

0f-0b commented Nov 25, 2025

Uh oh!

Uh oh!

crowlKats left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

coderabbitai bot commented Nov 24, 2025 •

edited

Loading