[MODEL] Claude silently duplicates stateful components during layout refactors, introducing invisible runtime bugs

Preflight Checklist

• [x] I have searched existing issues for similar behavior reports
• [x] This report does NOT contain sensitive information (API keys, passwords, etc.)

Type of Behavior Issue

Claude modified files I didn't ask it to modify

What You Asked Claude to Do

During a layout refactor (converting a sidebar from fixed-width to resizable panels), Claude duplicated a VideoTimelineSection component — once for desktop layout, once for mobile layout. This component contains a Remotion video player with <Audio> elements.

CSS classes (hidden lg:flex / lg:hidden) hid the duplicate visually, but React still mounted both instances. Result: 11
<audio> DOM elements instead of 5, causing narration and music to play twice simultaneously.

The original code had a single instance serving both layouts. Claude split it into two without any warning, comment, or mention in its summary.

What Claude Actually Did

1. Silent duplication of stateful components: Claude should recognize that duplicating components with

audio/video/WebSocket connections has side effects beyond visual rendering. It should flag this explicitly.

1. No warning given: Claude presented the refactor as clean and complete. No mention of "I duplicated this component for

mobile" or any tradeoff discussion.

1. Debugging misdirection: When asked to investigate the resulting double-audio bug, Claude spent an extended session

analyzing Remotion's internal Audio ID system, React.memo behavior, and sequenceContext.durationInFrames — none of which
were relevant. A simple document.querySelectorAll('audio').length would have revealed 11 elements and pointed to the
duplicate mount immediately.

Expected Behavior

• When duplicating a component that manages media playback, timers, WebSockets, or other stateful side effects, Claude

should explicitly warn about the implications

• When debugging duplication bugs, Claude should verify actual DOM state before diving into framework internals
• Claude should not present a refactor that introduces duplicate mounts as a clean change

Files Affected

Permission Mode

Accept Edits was ON (auto-accepting changes)

Can You Reproduce This?

No, only happened once

Steps to Reproduce

_No response_

Claude Model

Sonnet

Relevant Conversation

Impact

Critical - Data loss or corrupted project

Claude Code Version

2.1.83

Platform

Anthropic API

Additional Context

Environment

• Claude Code CLI (Opus)
• Next.js 14 / React 18 / Remotion player