Merge branch 'runners-registration-token-ff-pw-fix' into 'master'

Fix save password form dialog on CI/CD Registration token

See merge request !135583



Merged-by: Sascha Eggenberger <seggenberger@gitlab.com>
Approved-by: Serhii Yarynovskyi <syarynovskyi@gitlab.com>
Approved-by: Elwyn Benson <ebenson@gitlab.com>
Reviewed-by: Justin Ho Tuan Duong <hduong@gitlab.com>
Reviewed-by: Sascha Eggenberger <seggenberger@gitlab.com>

app/assets/javascripts/vue_shared/components/form/input_copy_toggle_visibility.vue

@@ -94,8 +94,12 @@ export default {
     computedValueIsVisible() {
       return !this.showToggleVisibilityButton || this.valueIsVisible;
     },
-    inputType() {
-      return this.computedValueIsVisible ? 'text' : 'password';
+    formInputClass() {
+      return [
+        'gl-font-monospace! gl-cursor-default!',
+        { 'input-copy-show-disc': !this.computedValueIsVisible },
+        this.formInputGroupProps.class,
+      ];
     },
   },
   mounted() {
@@ -157,10 +161,9 @@ export default {
         ref="input"
         :readonly="readonly"
         :width="size"
-        class="gl-font-monospace! gl-cursor-default!"
+        :class="formInputClass"
         v-bind="formInputGroupProps"
         :value="value"
-        :type="inputType"
         @input="handleInput"
         @click="handleClick"
       />
@@ -194,3 +197,8 @@ export default {
     </template>
   </gl-form-group>
 </template>
+<style>
+.input-copy-show-disc {
+  -webkit-text-security: disc;
+}
+</style>

ee/spec/features/groups/scim_token_spec.rb

@@ -64,9 +64,9 @@ def find_api_endpoint_url_field
 
         expect(page).to have_button('Copy SCIM token')
 
-        expect(find_token_field[:type]).to eq('password')
+        expect(page).to have_css('.input-copy-show-disc')
         page.click_button('Click to reveal')
-        expect(find_token_field[:type]).to eq('text')
+        expect(page).not_to have_css('.input-copy-show-disc')
         expect(find_token_field.value).not_to eq('')
       end
     end

spec/frontend/ci/runner/components/registration/registration_dropdown_spec.js

@@ -178,7 +178,7 @@ describe('RegistrationDropdown', () => {
         mountExtended,
       );
 
-      expect(findRegistrationTokenInput().element.type).toBe('password');
+      expect(findRegistrationTokenInput().classes()).toContain('input-copy-show-disc');
     });
   });
 

spec/frontend/ci/runner/components/registration/registration_token_spec.js

@@ -55,7 +55,7 @@ describe('RegistrationToken', () => {
       mountFn: mountExtended,
     });
 
-    expect(wrapper.find('input').element.type).toBe('password');
+    expect(wrapper.find('input').classes()).toContain('input-copy-show-disc');
   });
 
   describe('When the copy to clipboard button is clicked', () => {

spec/frontend/vue_shared/components/form/input_copy_toggle_visibility_spec.js

@@ -44,11 +44,11 @@ describe('InputCopyToggleVisibility', () => {
   };
 
   function expectInputToBeMasked() {
-    expect(findFormInput().element.type).toBe('password');
+    expect(findFormInput().classes()).toContain('input-copy-show-disc');
   }
 
   function expectInputToBeRevealed() {
-    expect(findFormInput().element.type).toBe('text');
+    expect(findFormInput().classes()).not.toContain('input-copy-show-disc');
     expect(findFormInput().element.value).toBe(valueProp);
   }