[WC-3348] Charts: restore highlighted JSON editor in playground#2310
Merged
Conversation
yordan-st
changed the title
This comment has been minimized.
This comment has been minimized.
yordan-st
force-pushed
the
fix/WC-3348-restore-playground-editor
branch
from
July 8, 2026 12:10
eea1883 to
cd6e358
Compare
This comment has been minimized.
This comment has been minimized.
yordan-st
force-pushed
the
fix/WC-3348-restore-playground-editor
branch
from
July 10, 2026 13:10
cd6e358 to
653519e
Compare
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
iobuhov
requested changes
Jul 14, 2026
iobuhov
left a comment
iobuhov
left a comment
Collaborator
There was a problem hiding this comment.
- Let's move the opensepc to "charts" package
- Make sure we don't touch maps
yordan-st
force-pushed
the
fix/WC-3348-restore-playground-editor
branch
from
July 14, 2026 08:45
48a4c7e to
911fa17
Compare
This comment has been minimized.
This comment has been minimized.
yordan-st
force-pushed
the
fix/WC-3348-restore-playground-editor
branch
from
July 14, 2026 09:08
2eb5f1b to
b1fc11f
Compare
This comment has been minimized.
This comment has been minimized.
yordan-st
force-pushed
the
fix/WC-3348-restore-playground-editor
branch
from
July 21, 2026 12:33
b1fc11f to
2c1ffb6
Compare
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
yordan-st
force-pushed
the
fix/WC-3348-restore-playground-editor
branch
from
July 21, 2026 16:30
12efb01 to
711200d
Compare
This comment has been minimized.
This comment has been minimized.
leonardomendix
previously approved these changes
Jul 24, 2026
…ert maps-web test fix
…visible text The Editor's own root had a fixed height + overflow, which let the invisible textarea and the highlighted <pre> it overlays drift out of sync once content overflowed — causing unreachable scroll, misplaced caret, and wrong text selection. Move the fixed height/scroll to the outer wrapper and let the Editor's root grow with its content instead.
yordan-st
force-pushed
the
fix/WC-3348-restore-playground-editor
branch
from
July 27, 2026 06:55
711200d to
f76e09f
Compare
gjulivan
approved these changes
Jul 27, 2026
leonardomendix
approved these changes
Jul 27, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
4 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Pull request type
Bug fix (non-breaking change which fixes an issue)
Description
Charts v6.3.0 shipped the playground editor on CodeMirror, which threw a bundling error and broke the playground. As a stopgap (to unblock WC-3345), CodeMirror was replaced with a plain
<textarea>in 6.3.1 — losing syntax highlighting and any feedback on invalid JSON.This restores a real editor without reintroducing a CodeMirror-class bundling dependency.
CodeEditornow usesreact-simple-code-editor+highlight.js(JSON), adapting the lightweight pattern already used inrich-text-web. It adds inline invalid-JSON feedback (a sticky error banner above the editor) and keeps the existing prop contract (value/onChange/readOnly/height) so both playground panels work unchanged.Scope is intentionally limited to the editor component. Leo's earlier review findings on the already-merged custom-chart / playground rework are tracked separately in WC-3488.
react-simple-code-editor,highlight.js(tree-shaken core + JSON language only)CodeEditor(highlighting, JSON lint, readOnly, height, no-CodeMirror guard)What should be covered while testing?
Put a chart (e.g. Line chart) on a page, set Show playground slot = Yes, drop the Chart playground widget into the slot, configure a Series, and run the app (F5). Click Toggle Editor to open the sidebar.
}); a red error banner appears at the top of the editor. Fix it → the banner disappears.{ "title": { "text": "TEST" } }; the chart title updates live.