Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

fix: only allow submitting form if changes have been made#14602

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.

Already on GitHub?Sign in to your account

Merged
Show file tree
Hide file tree
Changes fromall commits
Commits
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line numberDiff line numberDiff line change
Expand Up@@ -154,7 +154,8 @@ export const WorkspaceParametersForm: FC<WorkspaceParameterFormProps> = ({
<FormFooter
onCancel={onCancel}
isLoading={isSubmitting}
submitDisabled={disabled}
submitLabel="Submit and restart"
submitDisabled={disabled || !form.dirty}
/>
</HorizontalForm>
</>
Expand Down
Original file line numberDiff line numberDiff line change
Expand Up@@ -61,7 +61,9 @@ test("Submit the workspace settings page successfully", async () => {
);
await user.clear(parameter2);
await user.type(parameter2, "1");
await user.click(within(form).getByRole("button", { name: "Submit" }));
await user.click(
within(form).getByRole("button", { name: "Submit and restart" }),
);
// Assert that the API calls were made with the correct data
await waitFor(() => {
expect(postWorkspaceBuildSpy).toHaveBeenCalledWith(MockWorkspace.id, {
Expand All@@ -73,3 +75,58 @@ test("Submit the workspace settings page successfully", async () => {
});
});
});

test("Submit button is only enabled when changes are made", async () => {
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others.Learn more.

I think for now, having a test for this in Jest is ok, but in the future, you can try to usestorybook and interaction tests :)

DanielleMaywood reacted with thumbs up emoji
// Mock the API calls that loads data
jest
.spyOn(API, "getWorkspaceByOwnerAndName")
.mockResolvedValueOnce(MockWorkspace);
jest.spyOn(API, "getTemplateVersionRichParameters").mockResolvedValueOnce([
MockTemplateVersionParameter1,
MockTemplateVersionParameter2,
// Immutable parameters
MockTemplateVersionParameter4,
]);
jest.spyOn(API, "getWorkspaceBuildParameters").mockResolvedValueOnce([
MockWorkspaceBuildParameter1,
MockWorkspaceBuildParameter2,
// Immutable value
MockWorkspaceBuildParameter4,
]);
// Setup event and rendering
const user = userEvent.setup();
renderWithWorkspaceSettingsLayout(<WorkspaceParametersPage />, {
route: "/@test-user/test-workspace/settings",
path: "/:username/:workspace/settings",
// Need this because after submit the user is redirected
extraRoutes: [{ path: "/:username/:workspace", element: <div /> }],
});
await waitForLoaderToBeRemoved();

const submitButton: HTMLButtonElement = screen.getByRole("button", {
name: "Submit and restart",
});

const form = screen.getByTestId("form");
const parameter1 = within(form).getByLabelText(
MockWorkspaceBuildParameter1.name,
{ exact: false },
);

// There are no changes, the button should be disabled.
expect(submitButton.disabled).toBeTruthy();

// Make changes to the form
await user.clear(parameter1);
await user.type(parameter1, "new-value");

// There are now changes, the button should be enabled.
expect(submitButton.disabled).toBeFalsy();

// Change form value back to default
await user.clear(parameter1);
await user.type(parameter1, MockWorkspaceBuildParameter1.value);

// There are now no changes, the button should be disabled.
expect(submitButton.disabled).toBeTruthy();
});
Loading
[8]ページ先頭
©2009-2025 Movatter.jp