Merge branch 'fix-ci-variable-reset' into 'master'

Reset variable visibility on form reset

See merge request https://gitlab.com/gitlab-org/gitlab/-/merge_requests/177925



Merged-by: Tomas Bulva <tbulva@gitlab.com>
Approved-by: Tomas Bulva <tbulva@gitlab.com>
Co-authored-by: Anna Vovchenko <avovchenko@gitlab.com>

app/assets/javascripts/ci/ci_variable_list/components/ci_variable_drawer.vue

@@ -381,6 +381,8 @@ export default {
     },
     resetForm() {
       this.variable = { ...defaultVariableState };
+
+      this.visibility = VISIBILITY_VISIBLE;
     },
     setEnvironmentScope(scope) {
       this.variable = { ...this.variable, environmentScope: scope };

spec/frontend/ci/ci_variable_list/components/ci_variable_drawer_spec.js

@@ -243,6 +243,23 @@ describe('CI Variable Drawer', () => {
             expect(findVisibilityRadioGroup().attributes('checked')).toBe(expectedVisibility);
           },
         );
+
+        it('is updated on variable update', async () => {
+          await createComponent({
+            props: {
+              selectedVariable: {
+                ...mockProjectVariableFileType,
+                masked: true,
+                hidden: true,
+              },
+            },
+          });
+
+          expect(findVisibilityRadioGroup().attributes('checked')).toBe(VISIBILITY_HIDDEN);
+          await wrapper.setProps({ mutationResponse: { message: 'Success', hasError: false } });
+
+          expect(findVisibilityRadioGroup().attributes('checked')).toBe(VISIBILITY_VISIBLE);
+        });
       });
 
       it('is disabled when editing a hidden variable', () => {