pepperplus/pepperplus-ui
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: use input element directly

Browse Source 
Previously, a button proxy was used which required the use of complicated reference management. Using the HTML `input` element directly simplifies the implementation.

Also moved some styles.

ref: N25B-189
This commit is contained in:
Twirre Meulenbelt
2025-12-04 12:55:36 +01:00
parent e9ea0fb37e
commit 1bfcfc0458
5 changed files with 66 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
test/pages/visProgPage/visualProgrammingUI/components/SaveLoadPanel.test.tsx
View File

@@ -106,22 +106,22 @@ describe("SaveLoadPanel - combined tests", () => {
test("onLoad with invalid JSON does not update store", async () => {
const file = new File(["not json"], "bad.json", { type: "application/json" });
file.text = jest.fn(() => Promise.resolve(`{"bad json`));
window.alert = jest.fn();
render(<SaveLoadPanel />);
const input = document.querySelector('input[type="file"]') as HTMLInputElement;
expect(input).toBeTruthy();
// Click Load to install the resolver
const loadButton = screen.getByRole("button", { name: /load graph/i });
// Do click and change inside same act to ensure resolver is set
await act(async () => {
fireEvent.click(loadButton);
// Give some input
act(() => {
fireEvent.change(input, { target: { files: [file] } });
await Promise.resolve();
});
await waitFor(() => {
expect(window.alert).toHaveBeenCalledTimes(1);
const nodesAfter = useFlowStore.getState().nodes;
expect(nodesAfter).toHaveLength(0);
expect(input.value).toBe("");
@@ -134,7 +134,7 @@ describe("SaveLoadPanel - combined tests", () => {
expect(input).toBeTruthy();
// Click Load to set resolver
const loadButton = screen.getByRole("button", { name: /load graph/i });
const loadButton = screen.getByLabelText(/load graph/i);
await act(async () => {
fireEvent.click(loadButton);