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

FN-6079: fix mobile workflow editor edge rendering

Browse Source 
Ensure the mobile workflow editor keeps the React Flow surface tall enough for edges to render correctly.

- add a full-height mobile rule for the workflow editor React Flow surface
- extend the mobile CSS contract test to assert the height requirement
- broaden the selector width test to cover the collapsed workflow selector button

Files changed:
 packages/dashboard/app/components/WorkflowNodeEditor.css            | 1 +
 .../app/components/__tests__/WorkflowNodeEditor.css.test.ts         | 6 +++++-
 2 files changed, 6 insertions(+), 1 deletion(-)

Fusion-Task-Id: FN-6079

Fusion-Task-Lineage: a6f1de35-ce99-4673-bfaf-183124969a7c
This commit is contained in:
gsxdsm
2026-06-09 08:11:23 -07:00
parent a53330786e
commit d2b98f14b2
2 changed files with 6 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/dashboard/app/components/WorkflowNodeEditor.css
View File

@@ -1334,6 +1334,7 @@
width: 100%; width: 100%;
min-width: 0; min-width: 0;
max-width: 100%; max-width: 100%;
height: 100%;
} }
.wf-editor-list-item, .wf-editor-list-item,

6
packages/dashboard/app/components/__tests__/WorkflowNodeEditor.css.test.ts
View File

@@ -148,6 +148,7 @@ describe("WorkflowNodeEditor mobile CSS contract", () => {
expect(reactFlowSurfaceRule).toMatch(/width\s*:\s*100%\s*;/); expect(reactFlowSurfaceRule).toMatch(/width\s*:\s*100%\s*;/);
expect(reactFlowSurfaceRule).toMatch(/min-width\s*:\s*0\s*;/); expect(reactFlowSurfaceRule).toMatch(/min-width\s*:\s*0\s*;/);
expect(reactFlowSurfaceRule).toMatch(/max-width\s*:\s*100%\s*;/); expect(reactFlowSurfaceRule).toMatch(/max-width\s*:\s*100%\s*;/);
expect(reactFlowSurfaceRule).toMatch(/height\s*:\s*100%\s*;/);
}); });
it("FN-6034 preserves mobile staged editor visibility and inspector stacking", () => { it("FN-6034 preserves mobile staged editor visibility and inspector stacking", () => {
@@ -241,7 +242,10 @@ describe("WorkflowNodeEditor mobile CSS contract", () => {
const selectorRule = findRule(selectorMobile, /\.workflow-selector\s*\{[^}]*\}/); const selectorRule = findRule(selectorMobile, /\.workflow-selector\s*\{[^}]*\}/);
expect(selectorRule).toMatch(/flex-direction\s*:\s*column\s*;/); expect(selectorRule).toMatch(/flex-direction\s*:\s*column\s*;/);
const manageRule = findRule(selectorMobile, /\.workflow-selector select,\s*\.workflow-selector-manage\s*\{[^}]*\}/); const manageRule = findRule(
selectorMobile,
/\.workflow-selector select,\s*\.workflow-selector-manage,\s*\.workflow-selector-collapsed-button\s*\{[^}]*\}/,
);
expect(manageRule).toMatch(/width\s*:\s*100%\s*;/); expect(manageRule).toMatch(/width\s*:\s*100%\s*;/);
}); });
}); });