Adds regression test coverage for WorkflowResultsTab overflow behavior, completing Step 3 of FN-4206. Fusion-Task-Id: FN-4206
49 lines
2.1 KiB
TypeScript
49 lines
2.1 KiB
TypeScript
import { describe, it, expect } from "vitest";
|
|
import { render } from "@testing-library/react";
|
|
import { loadAllAppCss } from "../../test/cssFixture";
|
|
|
|
describe("WorkflowResultsTab overflow styles (FN-4206)", () => {
|
|
it("applies shrink/wrap rules for long workflow names", () => {
|
|
const style = document.createElement("style");
|
|
style.textContent = loadAllAppCss();
|
|
document.head.appendChild(style);
|
|
|
|
const longName = "verylongworkflowstepnamewithoutspaces".repeat(3);
|
|
const { container } = render(
|
|
<div>
|
|
<div className="workflow-result-header">
|
|
<div className="workflow-result-name">{longName}</div>
|
|
</div>
|
|
<div className="workflow-configured-header">
|
|
<div className="workflow-configured-title-row">
|
|
<div className="workflow-configured-name">{longName}</div>
|
|
</div>
|
|
</div>
|
|
<div className="workflow-output-modal-title">
|
|
<span className="workflow-output-modal-name">{longName}</span>
|
|
</div>
|
|
</div>,
|
|
);
|
|
|
|
const resultName = container.querySelector(".workflow-result-name");
|
|
const configuredName = container.querySelector(".workflow-configured-name");
|
|
const outputModalName = container.querySelector(".workflow-output-modal-name");
|
|
const configuredHeader = container.querySelector(".workflow-configured-header");
|
|
|
|
expect(resultName).toBeTruthy();
|
|
expect(configuredName).toBeTruthy();
|
|
expect(outputModalName).toBeTruthy();
|
|
expect(configuredHeader).toBeTruthy();
|
|
|
|
expect(getComputedStyle(resultName as Element).minWidth).toBe("0px");
|
|
expect(getComputedStyle(resultName as Element).wordBreak).toBe("break-word");
|
|
expect(getComputedStyle(configuredName as Element).minWidth).toBe("0px");
|
|
expect(getComputedStyle(configuredName as Element).wordBreak).toBe("break-word");
|
|
expect(getComputedStyle(outputModalName as Element).minWidth).toBe("0px");
|
|
expect(getComputedStyle(outputModalName as Element).wordBreak).toBe("break-word");
|
|
expect(getComputedStyle(configuredHeader as Element).flexWrap).toBe("wrap");
|
|
|
|
style.remove();
|
|
});
|
|
});
|