Add runtime highlighting to promptfiddle

[imalsogreg]

Makes promptfiddle do the same source highlighting trick for expr_fns that the playground does.

---

Important

Adds runtime highlighting for expr_fns in promptfiddle with new state management and VSCode command for flashing regions.

• Behavior:
  • Adds runtime highlighting for expr_fns in EventListener.tsx and code-mirror-viewer.tsx using flashRangesAtom.
  • Implements set_flashing_regions command in extension.ts and WebviewPanelHost.ts to handle flashing regions.
• State Management:
  • Introduces flashRangesAtom in atoms.ts to manage flash ranges.
  • Updates useRunBamlTests in test-runner.ts to send flash ranges to VSCode.
• Dependencies:
  • Adds @codemirror/state and @codemirror/view to package.json in playground-common and web-panel.
• Misc:
  • Removes logging from span.rs.

^{This description was created by for 6f8c557. It will automatically update as commits are pushed.}

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
baml	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Apr 11, 2025 4:42am

[ellipsis-dev]

👍 Looks good to me! Reviewed everything up to 6f8c557 in 2 minutes and 21 seconds

More details

• Looked at 382 lines of code in 9 files
• Skipped 1 files when reviewing.
• Skipped posting 20 drafted comments based on config settings.

1. engine/baml-lib/diagnostics/src/span.rs:63

• Draft comment:
  Removing the debug info log seems intentional. Confirm that this removal is desired in production.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

2. typescript/playground-common/package.json:68

• Draft comment:
  Adding @codemirror/state and @codemirror/view as dependencies is appropriate. Verify that their versions remain compatible with other codemirror modules.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

3. typescript/playground-common/src/baml_wasm_web/EventListener.tsx:82

• Draft comment:
  Flash ranges atom is now imported and used. The mapping from message content to flashRanges seems correct.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

4. typescript/playground-common/src/shared/baml-project-panel/codemirror-panel/code-mirror-viewer.tsx:48

• Draft comment:
  New flash highlighting effects are set up correctly. Confirm that using view.state.doc.line(range.startLine + 1) is the intended conversion (i.e. handling potential off-by-one differences between line numbering conventions).
• Reason this comment was not posted:
  Decided after close inspection that this draft comment was likely wrong and/or not actionable: usefulness confidence = 0% vs. threshold = 50%
  This is a "verify that..." style comment that asks the author to double-check their work. It doesn't point out a specific issue, just raises a vague concern about potential off-by-one errors. The rules explicitly say not to make comments asking authors to verify things. Additionally, line numbering conventions would be documented in the CodeMirror API, so the author likely already checked this.
  The comment raises a valid concern about correctness of line number handling, which could cause bugs if wrong. Maybe there's a real issue here that should be investigated?
  While line number handling is important, the comment doesn't provide evidence of an actual problem. If there was a line numbering bug, it would be immediately obvious in testing. We should trust that the author tested this code.
  Delete this comment. It's a "verify that..." style comment that doesn't point out a specific issue, just asks the author to double-check their work.

5. typescript/playground-common/src/shared/baml-project-panel/codemirror-panel/code-mirror-viewer.tsx:63

• Draft comment:
  Inserting animation keyframes via a document style element is acceptable; ensure this runs only once to avoid duplicating styles.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

6. typescript/playground-common/src/shared/baml-project-panel/playground-panel/atoms.ts:243

• Draft comment:
  The FlashRange interface and flashRangesAtom are defined properly. No issues detected.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

7. typescript/playground-common/src/shared/baml-project-panel/playground-panel/prompt-preview/test-panel/test-runner.ts:127

• Draft comment:
  The update to send spans as content (i.e. { content: { spans: ... } }) is consistent; verify that downstream consumers are updated accordingly.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

8. typescript/vscode-ext/packages/vscode/src/extension.ts:333

• Draft comment:
  Updated command 'baml.setFlashingRegions' now expects a content object. The mapping and disposal of decorations look proper.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

9. typescript/vscode-ext/packages/web-panel/package.json:16

• Draft comment:
  New dependencies for @codemirror/state and @codemirror/view are added; ensure consistency with the playground-common package.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

10. engine/baml-lib/diagnostics/src/span.rs:63

• Draft comment:
  Removing the debug log is fine if logging is managed by a configurable log level. Make sure this removal does not hinder debugging in non‑prod builds.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

11. typescript/playground-common/src/baml_wasm_web/EventListener.tsx:195

• Draft comment:
  Mapping spans to FlashRange looks correct. Ensure that the field names (e.g. start_line, start) consistently match between backend and frontend.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

12. typescript/playground-common/src/shared/baml-project-panel/codemirror-panel/code-mirror-viewer.tsx:140

• Draft comment:
  The new flashing decoration effect using a StateField and state effects is well implemented. Consider memoizing or reusing the flashing extension (createFlashingField) to avoid duplicate decoration state if extensions are re‑instantiated.
• Reason this comment was not posted:
  Confidence changes required: 33% <= threshold 50%
  None

13. typescript/playground-common/src/shared/baml-project-panel/playground-panel/prompt-preview/test-panel/test-runner.ts:127

• Draft comment:
  The payload for 'set_flashing_regions' was updated to use a 'content' object. Verify that this change remains consistent across all components (webview, extension, etc.).
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

14. typescript/vscode-ext/packages/vscode/src/extension.ts:333

• Draft comment:
  The command handler for 'baml.setFlashingRegions' now expects a payload with a 'content' property. Confirm that this new structure is propagated uniformly between the extension and webview.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

15. typescript/vscode-ext/packages/vscode/src/panels/WebviewPanelHost.ts:269

• Draft comment:
  In the WebviewPanelHost, the 'set_flashing_regions' message is forwarded using the new payload structure. Ensure consistency of payload format between VSCode panel and webview messages.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50%
  None

16. typescript/playground-common/src/baml_wasm_web/EventListener.tsx:81

• Draft comment:
  Typo in comment: The sentence "We don't use ASTContext.provider because we should the default value of the context" is missing a word. It likely should read "because we should use the default value of the context". Please fix the comment for clarity.
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

17. typescript/playground-common/src/shared/baml-project-panel/codemirror-panel/code-mirror-viewer.tsx:228

• Draft comment:
  In the comment at line 228, consider updating "I dont think we need to update fsmap.." to "I don't think we need to update fsMap." for proper typographical accuracy and consistency with camelCase for fsMap.
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

18. typescript/vscode-ext/packages/vscode/src/extension.ts:69

• Draft comment:
  Typo: The backgroundColor is set to '##9333ea' which has an extra '#' character. It should be '#9333ea'.
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

19. typescript/vscode-ext/packages/vscode/src/extension.ts:141

• Draft comment:
  Typo: Debug message logs 'Pushing test errorrrr'. The repeated 'r' in 'errorrrr' appears to be a typo. Consider correcting it if unintended.
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

20. typescript/vscode-ext/packages/vscode/src/panels/WebviewPanelHost.ts:193

• Draft comment:
  Typo: In the comment describing the _setWebviewMessageListener method, 'recieved' is misspelled. Please change it to 'received'.
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

Workflow ID: wflow_wdxm5qEKzGFXVPI7

---

You can customize Ellipsis with 👍 / 👎 feedback, review rules, user-specific overrides, quiet mode, and more.