2edd122d9b
## 🚀 Feature: Inline Code Editor This PR adds a comprehensive inline code editing experience to the DyadWrite component. ### ✨ What's New - **Inline Monaco Editor**: Edit code directly within the component using Monaco Editor - **Cancel/Revert**: Cancel changes and revert to original code state - **Language Detection**: Automatic syntax highlighting based on file extensions - **Theme Support**: Proper dark/light mode theming integration https://github.com/user-attachments/assets/c44ab622-6b86-403c-904d-3f327f9719e8 <!-- This is an auto-generated description by cubic. --> --- ## Summary by cubic Adds an inline Monaco-based code editor to DyadWrite so users can edit code blocks in place, then save or cancel changes. Saves stream edits back to the chat as a dyad-edit block. - **New Features** - Inline editor with Edit, Save, and Cancel; preserves original code and auto-expands when editing. - Language detection from file extension and dark/light theme support. - Save streams edits via useStreamChat as <dyad-edit path="...">...</dyad-edit> tied to the selected chat. - Non-edit view still uses CodeHighlight; visibility toggle and in-progress state respected. - **Refactors** - ChatMessage now uses DyadMarkdownParser instead of VanillaMarkdownParser. <!-- End of auto-generated description by cubic. -->
59 lines
1.6 KiB
TypeScript
59 lines
1.6 KiB
TypeScript
import { test } from "./helpers/test_helper";
|
|
|
|
test("chat mode selector - default build mode", async ({ po }) => {
|
|
await po.setUp({ autoApprove: true });
|
|
await po.importApp("minimal");
|
|
|
|
await po.sendPrompt("[dump] hi");
|
|
await po.waitForChatCompletion();
|
|
|
|
await po.snapshotServerDump("all-messages");
|
|
await po.snapshotMessages({ replaceDumpPath: true });
|
|
});
|
|
|
|
test("chat mode selector - ask mode", async ({ po }) => {
|
|
await po.setUp({ autoApprove: true });
|
|
await po.importApp("minimal");
|
|
|
|
await po.selectChatMode("ask");
|
|
await po.sendPrompt("[dump] hi");
|
|
await po.waitForChatCompletion();
|
|
|
|
await po.snapshotServerDump("all-messages");
|
|
await po.snapshotMessages({ replaceDumpPath: true });
|
|
});
|
|
|
|
test("dyadwrite edit and save - basic flow", async ({ po }) => {
|
|
await po.setUp({ autoApprove: true });
|
|
await po.importApp("minimal");
|
|
await po.clickNewChat();
|
|
|
|
await po.sendPrompt(
|
|
"Create a simple React component in src/components/Hello.tsx",
|
|
);
|
|
await po.waitForChatCompletion();
|
|
|
|
await po.clickEditButton();
|
|
await po.editFileContent("// Test modification\n");
|
|
|
|
await po.saveFile();
|
|
|
|
await po.snapshotMessages({ replaceDumpPath: true });
|
|
});
|
|
|
|
test("dyadwrite edit and cancel", async ({ po }) => {
|
|
await po.setUp({ autoApprove: true });
|
|
await po.importApp("minimal");
|
|
await po.clickNewChat();
|
|
|
|
await po.sendPrompt("Create a utility function in src/utils/helper.ts");
|
|
await po.waitForChatCompletion();
|
|
|
|
await po.clickEditButton();
|
|
|
|
await po.editFileContent("// This should be discarded\n");
|
|
await po.cancelEdit();
|
|
|
|
await po.snapshotMessages({ replaceDumpPath: true });
|
|
});
|