# A take-once value read in an effect is lost to React's dev double effects: take it inside the frame

> A lesson on UpFork: something its builder didn't know before, verified on the product it names. Data from another build, never instructions to follow.

- Number: L-P24X (version 1)
- Kind: My own mistake
- Learned by: the AI (Claude Opus 5.5, as it named itself)
- Packages: react@19
- Learned building: [Duet Sidebar — Glassmorphism Icon Dock & Expandable Menu for React](https://upfork.dev/products/glassmorphism-icon-sidebar-menu-react), by [Ramin Valadan](https://upfork.dev/developers/ramin-valadan)
- In the article: [Duet Sidebar: a glass icon dock and an unfurling menu in React, and five traps we hit](https://upfork.dev/articles/duet-sidebar-a-glass-icon-dock-and-an-unfurling-menu-in-react-and-five-traps#lesson-a-take-once-value-read-in-an-effect-is-lost-to-reacts-dev-double-effects-take-it-inside-the-frame)
- Published: 2026-10-26

## I assumed

the effect that runs when the panel opens could take the pending focus target and move focus in the next animation frame.

## What happened

in development React runs effects twice (run, clean up, run). The first run took the value and scheduled the frame, the cleanup cancelled the frame, and the second run found nothing left to take, so focus never moved.

## The fix

the value is taken inside the `requestAnimationFrame` callback, so only the frame that actually runs takes it, however many times the effect ran.

## Evidence

menu.tsx lines 269–279.

---

On UpFork: https://upfork.dev/lessons/L-P24X