Make line breaks in JSON strings visual only

[laurakwhit]

Description & motivation 💭

getLineBreakExtension was using EditorView.updateListener to mutate the document by replaces every literal \n with a real newline character. This was corrupting the JSON content and causing JSON.parse to fail validation.

This PR uses a ViewPlugin with MatchDecorator and Decoration.replace to visually render \n as a <br> line break. This means the underlying document content stays unchanged, so doc.toString() still returns valid JSON with proper \n escape sequences. The visual line break only appears in read-only mode (when editable is false).

Screenshots (if applicable) 📸

Design Considerations 🎨

Testing 🧪

How was this tested 👻

• Manual testing
• E2E tests added
• Unit tests added

Steps for others to test: 🚶🏽‍♂️🚶🏽‍♀️

• Create a schedule and set "Input" > "Data" to a string with \\n in it (e.g. "Hello\nworld") with "json/plain" for "Encoding"
• Save the schedule
• Go to edit the schedule
  • Verify the input appears with a line break where the \\n was
• Go to edit the input
  • Verify the input is a JSON string with \\n in the value

Checklists

Draft Checklist

Merge Checklist

Issue(s) closed

DT-3659

Docs

Any docs updates needed?

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
holocene	Ready	Preview, Comment	Mar 12, 2026 10:32pm

[temporal-cicd]

• ⚠️ Property 'text' does not exist on type '{ json: LanguageSupport; java: LanguageSupport; go: LanguageSupport; php: LanguageSupport; python: StreamLanguage; shell: StreamLanguage<...>; dotnet: StreamLanguage<...>; ruby: StreamLanguage<...>; typescript: StreamLanguage<...>; }'.

[temporal-cicd]

Warnings

⚠️

📊 Strict Mode: 4 errors in 1 file (0.4% of 1110 total) src/lib/vendor/codemirror/custom-extensions.ts (4) L68:48: Parameter 'header' implicitly has an 'any' type. L72:6: Type '{ borderWidth?: undefined; borderColor?: undefined; color: string; backgroundColor: string; height: string; } | { borderWidth: string; borderColor: string; color: string; backgroundColor: string; height: string; }' is not assignable to type 'StyleSpec'. L91:6: Type '{ borderWidth?: undefined; borderColor?: undefined; color: string; backgroundColor: string; height: string; } | { borderWidth: string; borderColor: string; color: string; backgroundColor: string; height: string; }' is not assignable to type 'StyleSpec'. L176:2: Property 'text' does not exist on type '{ json: LanguageSupport; java: LanguageSupport; go: LanguageSupport; php: LanguageSupport; python: StreamLanguage; shell: StreamLanguage<...>; dotnet: StreamLanguage<...>; ruby: StreamLanguage<...>; typescript: StreamLanguage<...>; }'.

Generated by 🚫 dangerJS against 59853e6

[andrewzamojc]

Nice solution changing it to a br. Neat! LGTM 👍