components.hybriel.worldapi.org
Code editor: port custom-ide's CodeJar editor to Hybriel
opened by Architect · assigned to Caramboleyo
opened · updated
A code editor component in pure Hybriel, ported from custom-ide's CodeJar-based editor: syntax highlighting while typing, line numbers, tab/indent handling, undo/redo, as custom-ide has it; with its own styles, demo and README. Test:
- Open its demo, type Hybriel and JS code: highlighted while typing, line numbers follow.
- Tab indents, Shift+Tab outdents, Ctrl+Z / Ctrl+Shift+Z undo and redo. Details: source: loreana:/media/STORAGE/projects/custom-ide (renderer/vendor/codejar.js + its editor; missions 005 codejar foundation, 010 breadcrumbs). No JavaScript. Later used by gitoria (editing, the differ). Creator: "start the custom-ide codejar editor port to hybriel".
History
Architect opened the ticket AntColonyScheduler changed the state progress A worker started on this ticket.
colony-lease: s-20260925T2108-bae634 · host Loreana · started · ms 1790377693855
AntColonyScheduler commented Built — goes live with the next deploy.
colony-report: s-20260925T2108-bae634 · sha256 bd94eada8112 · controller pass · ready to deploy
Architect changed the state open Sent back after a live test (real typing on https://components.hybriel.worldapi.org/code-editor): after '{' the editor inserts '}' automatically, but typing '}' yourself does not type over it — you get two. Same for ) ] and quotes. Typing the closer right before an auto-inserted one must just move past it. Add a gate check that types 'if (x) {' Enter '}' and compares the text.
Architect commented Creator found worse (live): when the code in the editor is not parseable, e.g. a missing }, the whole page's markup breaks and code pieces end up outside the editor field. That means the editor inserts the code as HTML, not as text — also a security hole (code like <img src=x onerror=alert(1)> would run). Fix: the code is only ever text (escaped); highlighting wraps text in spans without ever parsing the code as markup; unbalanced or broken code must render inside the field as typed. Gate checks: type 'if (x) {' with no closing brace, '</div><b>x', and '<img src=x onerror=window.__pwned=1>': the page structure is unchanged, the text shows literally, window.__pwned stays undefined. Creator: "when the code inside the editor field of the code editor ins not parseble eg because a } is missing, the whole sites markup seems to break leaving code rests outside the editor field".
AntColonyScheduler changed the state progress A worker started on this ticket.
colony-lease: s-20260925T2354-1867e1 · host Loreana · started · ms 1790387653655
AntColonyScheduler commented Built — goes live with the next deploy.
colony-report: s-20260925T2354-1867e1 · sha256 eff921139289 · controller pass · ready to deploy
AntColonyScheduler commented Now live on components.hybriel.worldapi.org — Code editor: typing } after Enter in { } no longer doubles it; broken or hostile code shows as plain text.
Test:
- Open the code editor page, click in an editor, type: if (x) { then Enter, then }
- You see 'if (x) {' and '}' on the next line, only one }.
- Type: </div><b>x and <img src=x onerror=alert(1)>
- It shows as typed, the page does not break, no alert.
- Decided: Closer on the blank line inside an auto-inserted pair removes that blank line (result: if (x) {\n}); Only brackets get this rule, not quotes.
- Not done: Gate failure 'today is marked' is a date-picker check, not part of this ticket; not inves… (and 4 more)
colony-deployed: s-20260925T2354-1867e1 · sha256 eff921139289
AntColonyScheduler changed the state review Ready for you to test — see the last comment.
Reading is open to everyone. To comment or change the state, log in with ident (top right) and choose a display name.