@@ -73,3 +73,56 @@ test("Submit the workspace settings page successfully", async () => {
7373} ) ;
7474} ) ;
7575} ) ;
76+
77+ test ( "Submit button is only enabled when changes are made" , async ( ) => {
78+ // Mock the API calls that loads data
79+ jest
80+ . spyOn ( API , "getWorkspaceByOwnerAndName" )
81+ . mockResolvedValueOnce ( MockWorkspace ) ;
82+ jest . spyOn ( API , "getTemplateVersionRichParameters" ) . mockResolvedValueOnce ( [
83+ MockTemplateVersionParameter1 ,
84+ MockTemplateVersionParameter2 ,
85+ // Immutable parameters
86+ MockTemplateVersionParameter4 ,
87+ ] ) ;
88+ jest . spyOn ( API , "getWorkspaceBuildParameters" ) . mockResolvedValueOnce ( [
89+ MockWorkspaceBuildParameter1 ,
90+ MockWorkspaceBuildParameter2 ,
91+ // Immutable value
92+ MockWorkspaceBuildParameter4 ,
93+ ] ) ;
94+ // Setup event and rendering
95+ const user = userEvent . setup ( ) ;
96+ renderWithWorkspaceSettingsLayout ( < WorkspaceParametersPage /> , {
97+ route :"/@test-user/test-workspace/settings" ,
98+ path :"/:username/:workspace/settings" ,
99+ // Need this because after submit the user is redirected
100+ extraRoutes :[ { path :"/:username/:workspace" , element :< div /> } ] ,
101+ } ) ;
102+ await waitForLoaderToBeRemoved ( ) ;
103+
104+ const submitButton :HTMLButtonElement = screen . getByRole ( "button" , { name :"Submit" } ) ;
105+
106+ const form = screen . getByTestId ( "form" ) ;
107+ const parameter1 = within ( form ) . getByLabelText (
108+ MockWorkspaceBuildParameter1 . name ,
109+ { exact :false } ,
110+ ) ;
111+
112+ // There are no changes, the button should be disabled.
113+ expect ( submitButton . disabled ) . toBeTruthy ( ) ;
114+
115+ // Make changes to the form
116+ await user . clear ( parameter1 ) ;
117+ await user . type ( parameter1 , "new-value" ) ;
118+
119+ // There are now changes, the button should be enabled.
120+ expect ( submitButton . disabled ) . toBeFalsy ( ) ;
121+
122+ // Change form value back to default
123+ await user . clear ( parameter1 ) ;
124+ await user . type ( parameter1 , MockWorkspaceBuildParameter1 . value ) ;
125+
126+ // There are now no changes, the button should be disabled.
127+ expect ( submitButton . disabled ) . toBeTruthy ( ) ;
128+ } ) ;