Skip to content

Commit a49619c

Browse files
JoshuaKGoldbergclaude
authored andcommitted
feat(logs): add inline JSON syntax highlighting for log attributes (#111730)
Add inline syntax highlighting for JSON embedded within log attribute values in the expanded attribute tree view. Previously (LOGS-400), only attribute values that were *entirely* valid JSON got pretty-printed with `StructuredEventData`. Values like `This is my JSON: {"it": "would be", "nice": ["to", "highlight"], "this": true}` rendered as plain text. Now, the JSON portion gets Prism-based syntax colorizing inline — keys, strings, numbers, booleans, and punctuation each get their own color — without adding newlines or changing the layout. <img width="838" height="245" alt="Screenshot of a log with a myData field showing syntax-highlighted JSON object" src="https://github.com/user-attachments/assets/7b78bb01-5be9-494e-9010-2008fde3b59c" /> The JSON extraction logic lives in a standalone utility (`extractJsonFromText`) that uses string-aware bracket matching to correctly handle braces inside quoted strings and escape sequences — unlike existing npm packages (`balanced-match`, `extract-json-from-string`) which break on these cases. I intentionally set this up so that it acts like a standalone importable utility. It'd be nifty if we could publish this as its own package... Fixes LOGS-636 Made with [Cursor](https://cursor.com) Co-authored-by: Claude Sonnet 4 <noreply@anthropic.com>
1 parent 7c910a9 commit a49619c

File tree

6 files changed

+778
-14
lines changed

6 files changed

+778
-14
lines changed

0 commit comments

Comments
 (0)