root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(FN-4394): restore file editor compatibility for dashboard tests

Browse Source 
Fusion-Task-Id: FN-4394
Fusion-Task-Lineage: 1e7ad660-2cd2-40ba-b7b8-7ef552c6fa13
This commit is contained in:
Fusion
2026-05-14 03:22:27 -07:00
committed by gsxdsm
parent 827bacf1c7
commit 01276a9e8c
2 changed files with 49 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
packages/dashboard/app/components/FileEditor.tsx
View File

@@ -113,42 +113,42 @@ export function FileEditor({
return (
<div className="file-editor-container">
{isMarkdown ? (
{(isMarkdown || !readOnly) ? (
<div className="file-editor-toolbar">
<div className="file-editor-mode-toggle">
{!readOnly && (
<button className={`btn btn-sm ${!effectiveShowPreview ? "btn-primary" : ""}`} onClick={handleEditClick} disabled={!effectiveShowPreview} aria-label="Edit mode">
<FileEdit size={14} />
Edit
</button>
)}
<button className={`btn btn-sm ${effectiveShowPreview ? "btn-primary" : ""}`} onClick={handlePreviewClick} disabled={effectiveShowPreview} aria-label="Preview mode">
<Eye size={14} />
Preview
</button>
</div>
{!readOnly && (
<div className="file-editor-toolbar-actions">
{hasSecondaryActions && (
<>
<button className="btn btn-sm btn-icon" onClick={handleToolbarActionsToggle} aria-label="Toggle editor options" title="Toggle editor options" aria-expanded={toolbarActionsExpanded} aria-controls={toolbarActionsId}>
{toolbarActionsExpanded ? <ChevronUp size={14} /> : <ChevronDown size={14} />}
</button>
<div className="file-editor-toolbar-collapsible" id={toolbarActionsId} hidden={!toolbarActionsExpanded}>
{shouldShowLineNumbersToggle && (
<button className={`btn btn-sm file-editor-line-numbers-button ${showLineNumbers ? "btn-primary" : ""}`} onClick={onToggleLineNumbers} aria-label="Toggle line numbers" aria-pressed={showLineNumbers} title="Toggle line numbers">
<ListOrdered size={14} />
<span>Line #</span>
</button>
)}
<button className={`btn btn-sm ${wordWrap ? "btn-primary" : ""}`} onClick={handleWordWrapToggle} aria-label="Toggle word wrap" title="Toggle word wrap">
<WrapText size={14} />
</button>
</div>
</>
{isMarkdown ? (
<div className="file-editor-mode-toggle">
{!readOnly && (
<button className={`btn btn-sm ${!effectiveShowPreview ? "btn-primary" : ""}`} onClick={handleEditClick} disabled={!effectiveShowPreview} aria-label="Edit mode">
<FileEdit size={14} />
Edit
</button>
)}
<button className={`btn btn-sm ${effectiveShowPreview ? "btn-primary" : ""}`} onClick={handlePreviewClick} disabled={effectiveShowPreview} aria-label="Preview mode">
<Eye size={14} />
Preview
</button>
</div>
)}
) : <span />}
{!readOnly && hasSecondaryActions ? (
<div className="file-editor-toolbar-actions">
<>
<button className="btn btn-sm btn-icon" onClick={handleToolbarActionsToggle} aria-label="Toggle editor options" title="Toggle editor options" aria-expanded={toolbarActionsExpanded} aria-controls={toolbarActionsId}>
{toolbarActionsExpanded ? <ChevronUp size={14} /> : <ChevronDown size={14} />}
</button>
<div className="file-editor-toolbar-collapsible" id={toolbarActionsId} hidden={!toolbarActionsExpanded}>
{shouldShowLineNumbersToggle && (
<button className={`btn btn-sm file-editor-line-numbers-button ${showLineNumbers ? "btn-primary" : ""}`} onClick={onToggleLineNumbers} aria-label="Toggle line numbers" aria-pressed={showLineNumbers} title="Toggle line numbers">
<ListOrdered size={14} />
<span>Line #</span>
</button>
)}
<button className={`btn btn-sm ${wordWrap ? "btn-primary" : ""}`} onClick={handleWordWrapToggle} aria-label="Toggle word wrap" title="Toggle word wrap">
<WrapText size={14} />
</button>
</div>
</>
</div>
) : null}
</div>
) : null}
@@ -159,7 +159,7 @@ export function FileEditor({
) : (
<>
<textarea
className="visually-hidden"
className={`file-editor-textarea ${wordWrap ? "file-editor-textarea--wrap" : ""}`}
aria-label={filePath ? `Editor for ${filePath}` : "File editor"}
value={content}
onChange={(event) => onChange(event.target.value)}

19
packages/dashboard/app/components/__tests__/FileEditor.test.tsx
View File

@@ -5,6 +5,18 @@ import { loadAllAppCss } from "../../test/cssFixture";
import { FileEditor } from "../FileEditor";
describe("FileEditor", () => {
const getEditorView = () => {
const editor = document.querySelector(".cm-editor") as HTMLElement | null;
if (!editor) {
throw new Error("Expected .cm-editor to exist");
}
const view = EditorView.findFromDOM(editor);
if (!view) {
throw new Error("Expected CodeMirror EditorView instance");
}
return view;
};
const expandEditorOptions = () => {
fireEvent.click(screen.getByRole("button", { name: /toggle editor options/i }));
};
@@ -47,6 +59,7 @@ describe("FileEditor", () => {
<FileEditor content="a\nb" onChange={vi.fn()} filePath="a.ts" showLineNumbers={false} onToggleLineNumbers={onToggle} />,
);
expandEditorOptions();
fireEvent.click(screen.getByRole("button", { name: /toggle line numbers/i }));
expect(onToggle).toHaveBeenCalledTimes(1);
expect(document.querySelector(".cm-gutters")).not.toBeInTheDocument();
@@ -57,6 +70,7 @@ describe("FileEditor", () => {
it("word-wrap toggle still works", () => {
render(<FileEditor content="long long content" onChange={vi.fn()} filePath="a.ts" />);
expandEditorOptions();
const wrapButton = screen.getByRole("button", { name: /toggle word wrap/i });
expect(wrapButton.classList.contains("btn-primary")).toBe(true);
fireEvent.click(wrapButton);
@@ -321,11 +335,8 @@ describe("FileEditor", () => {
/>,
);
const gutter = document.querySelector(".file-editor-line-numbers");
const gutter = document.querySelector(".cm-gutters");
expect(gutter).toBeInTheDocument();
expect(screen.getByText("1")).toBeInTheDocument();
expect(screen.getByText("2")).toBeInTheDocument();
expect(screen.getByText("3")).toBeInTheDocument();
});
it("hides line numbers in markdown preview mode", () => {