Skip to content

fix: phantom input bug on wsl#200

Merged
adamdotdevin merged 1 commit intoanomalyco:devfrom
rgodha24:fix-phantom-input
Jun 20, 2025
Merged

fix: phantom input bug on wsl#200
adamdotdevin merged 1 commit intoanomalyco:devfrom
rgodha24:fix-phantom-input

Conversation

@rgodha24
Copy link
Contributor

this is basically just working around the issue. wsl users will be defaulted to dark mode no matter what settings are.

will test this on my work laptop tomorrow. related: #127

@rgodha24
Copy link
Contributor Author

confirming the IsWsl() function works:

image
also tested opening opencode ~10 times each on windows terminal and wezterm and didnt get a single phantom input

@rgodha24 rgodha24 marked this pull request as ready for review June 19, 2025 15:07
@thdxr thdxr requested a review from adamdotdevin June 19, 2025 22:35
@adamdotdevin adamdotdevin merged commit 6674c60 into anomalyco:dev Jun 20, 2025
achembarpu pushed a commit to achembarpu/opencode that referenced this pull request Aug 4, 2025
m-pa pushed a commit to m-pa/opencode that referenced this pull request Dec 4, 2025
…st” error (anomalyco#200)

Resolves anomalyco/opentui#199

## The Bug

When inserting a React element in the middle of a list inside a
`<scrollbox>`, the application crashes with:

```
Error: Anchor does not exist
  at insertBefore (packages/core/src/Renderable.ts:1118:17)
  at insertBefore (packages/react/src/reconciler/host-config.ts:65:12)
```

## Root Cause

ScrollBox has an internal wrapper structure where user content is added
to a nested child (`this.content`), not directly to the ScrollBox
instance. The component hierarchy looks like:

```
ScrollBox
├── wrapper (scroll-box-wrapper)
│   └── viewport
│       └── content ← User children go here
└── scrollbar (scroll-box-vertical-scrollbar)
```

ScrollBox correctly overrides `add()` and `remove()` to delegate to
`this.content`:

- `add(obj, index)` → `this.content.add(obj, index)` ✓
- `remove(id)` → `this.content.remove(id)` ✓

**However, ScrollBox was missing an override for `insertBefore()`.**

When React inserts an element in the middle of a list (e.g., when a
conditional element appears after initial render), it calls:

```typescript
parent.insertBefore(newChild, anchorChild)
```

Without the override, this uses the base `Renderable.insertBefore()`
which:

1. Looks for `anchorChild` in the parent's direct children via
`renderableMapById`
2. Fails because `anchorChild` is actually in `this.content` (the
wrapper), not in ScrollBox's direct children

## The Fix

Added `insertBefore()` override in ScrollBox to delegate to
`this.content`, matching the pattern used for `add()` and `remove()`:

## Impact Analysis

### Affected Components

- ✅ **ScrollBox** - Fixed by adding `insertBefore()` override
- ✅ **TextRenderable** - Already had proper `insertBefore()` delegation

### Affected Renderers

- ❌ **React** - Was affected (uses `insertBefore()` directly)
- ✅ **Solid** - Not affected (uses `add(node, anchorIndex)` pattern)
- ✅ **Vue** - Not affected (uses `add(node, anchorIndex)` pattern)
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.

2 participants