directus / directus/directus

JSON code interface: cursor jumps to top after paste (auto-format triggers full re-render)

Open
#28,045 5 comments 1 reaction 0 assignees View on GitHub
Bug Low Impact Low Reach Studio UX / DX
Dominant language
TypeScript
Stars
37.9k
Forks
4.9k
Avg merge
3d 21h
Merged PRs (30d)
36

Description

### Describe the Bug

**Environment:**

- Directus version: 12.2.0
- Database: PostgreSQL
- Hosting: Self-hosted (CoreOS / AWS EC2)
- Browser: Chrome (latest)
- Describe the bug:

When editing a JSON field using the Code (input-code) interface, pasting content causes the cursor to jump to the top of the editor (line 1, column 0). It appears that the auto-format/re-serialize behavior triggers a full reactive value replacement of the CodeMirror editor content, which resets cursor state.

This makes editing large JSON documents painful — after every paste operation, the user must manually scroll and click back to where they were working.

Additional context:

- Content versioning is disabled on the affected collection
- The jump appears to be caused by the JSON parse → stringify round-trip that Directus performs after value changes. When the stringified output differs from the raw input (e.g. different indentation), the component replaces the full editor value, which resets CodeMirror's cursor/selection state.
- A related (now resolved) issue: when content versioning was enabled, the periodic delta sync also triggered this same cursor-reset behavior during typing (after ~2s idle), and additionally injected `_user`/`_date` revision metadata into nested JSON objects. Disabling versioning fixed that part.
- Affects usability significantly for users managing large config-style JSON payloads.

### To Reproduce

1. Create a collection with a JSON field using the "Code" interface
2. Add a large JSON object (50+ lines)
3. Place cursor somewhere in the middle of the document
4. Select and paste new JSON content (or paste to replace a section)
5. Observe: cursor jumps to line 1, position 0

Expected behavior:

After a paste + auto-format, the cursor should remain at the end of the pasted content (or at minimum, at the same approximate scroll position), not reset to the top of the document.

### Directus Version

12.2.0

### Hosting Strategy

Self-Hosted (Docker Image)

### Database

PostgreSQL 18.4

Contributor guide

Open the contributing guide

Research direction

Start at the Code (input-code) interface and trace the JSON parse→stringify update path described in the report. Reproduce the issue with a large JSON document and a paste in the middle, then verify that auto-formatting preserves the pasted position or approximate scroll location instead of returning to line 1, column 0.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
66/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.