[PR #1004] [MERGED] fix: next/image only fire onError once per src per mount (#990) #1015

New issue

Closed

opened 2026-05-06 13:11:34 +02:00 by BreizhHardware · 0 comments

BreizhHardware commented

2026-05-06 13:11:34 +02:00

Owner

📋 Pull Request Information

Original PR: https://github.com/cloudflare/vinext/pull/1004
Author: @Divkix
Created: 5/1/2026
Status: ✅ Merged
Merged: 5/2/2026
Merged by: @james-elicx

Base: main ← Head: fix/990-next-image-onerror-once

📝 Commits (3)

edeecb0 fix: next/image only fire onError and onLoad once per src per mount (#990)
035e0bd fix: add "use client" directive to next/image shim
bf852d6 fix: move resolveImageSource above handler closures for readability

📊 Changes

2 files changed (+167 additions, -8 deletions)

View changed files

📝 packages/vinext/src/shims/image.tsx (+38 -8)
📝 tests/image-component.test.ts (+129 -0)

📄 Description

Fixes #990

Summary

Add useRef-based dedup to prevent onLoad and onError from firing multiple times for the same image src across React re-renders
Destructure onError from props (previously fell through {...rest} to native <img>, bypassing any dedup)
Pass onError to all 4 render paths — was silently dropped on UnpicImage paths (remote URLs)
Add SSR tests covering all render paths and verifying event handlers don't leak as DOM attributes

Ported from upstream Next.js fix in vercel/next.js#93209.

Test plan

47 image-component.test.ts tests pass including 7 new SSR dedup tests
Build passes, lint clean (0 warnings/errors)

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/cloudflare/vinext/pull/1004 **Author:** [@Divkix](https://github.com/Divkix) **Created:** 5/1/2026 **Status:** ✅ Merged **Merged:** 5/2/2026 **Merged by:** [@james-elicx](https://github.com/james-elicx) **Base:** `main` ← **Head:** `fix/990-next-image-onerror-once` --- ### 📝 Commits (3) - [`edeecb0`](https://github.com/cloudflare/vinext/commit/edeecb03393a82b5c7f6fcb91185033ba7ce452c) fix: next/image only fire onError and onLoad once per src per mount (#990) - [`035e0bd`](https://github.com/cloudflare/vinext/commit/035e0bdaa75d2834b692f127e040306ec20989ab) fix: add "use client" directive to next/image shim - [`bf852d6`](https://github.com/cloudflare/vinext/commit/bf852d65ca154a79c0456a3ac7c6eb7795eb85cd) fix: move resolveImageSource above handler closures for readability ### 📊 Changes **2 files changed** (+167 additions, -8 deletions) <details> <summary>View changed files</summary> 📝 `packages/vinext/src/shims/image.tsx` (+38 -8) 📝 `tests/image-component.test.ts` (+129 -0) </details> ### 📄 Description Fixes #990 ## Summary - Add `useRef`-based dedup to prevent `onLoad` and `onError` from firing multiple times for the same image `src` across React re-renders - Destructure `onError` from props (previously fell through `{...rest}` to native `<img>`, bypassing any dedup) - Pass `onError` to all 4 render paths — was silently dropped on UnpicImage paths (remote URLs) - Add SSR tests covering all render paths and verifying event handlers don't leak as DOM attributes Ported from upstream Next.js fix in [vercel/next.js#93209](https://github.com/vercel/next.js/pull/93209). ## Test plan - 47 `image-component.test.ts` tests pass including 7 new SSR dedup tests - Build passes, lint clean (0 warnings/errors) --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>