Fix generate password doesnt reset banned password error, autofocus o…

…n password input doesn't work (#9735)
owncloud · Dec 13, 2023 · 9025a89 · 9025a89
1 parent 5d75d59
commit 9025a89
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 3 deletions.
diff --git a/changelog/unreleased/enhancement-add-password-policy-compatibility b/changelog/unreleased/enhancement-add-password-policy-compatibility
@@ -7,5 +7,6 @@ https://github.com/owncloud/web/pull/9682
 https://github.com/owncloud/web/pull/9634
 https://github.com/owncloud/web/pull/9686
 https://github.com/owncloud/web/pull/9688
+https://github.com/owncloud/web/pull/9735
 https://github.com/owncloud/web/issues/9638
 https://github.com/owncloud/web/issues/9657
diff --git a/packages/design-system/src/components/OcTextInput/OcTextInput.vue b/packages/design-system/src/components/OcTextInput/OcTextInput.vue
@@ -12,6 +12,7 @@
         :is="inputComponent"
         :id="id"
         v-bind="additionalAttributes"
+        v-on="additionalListeners"
         ref="input"
         :aria-invalid="ariaInvalid"
         class="oc-text-input oc-input oc-rounded"
@@ -261,6 +262,13 @@ export default defineComponent({
     messageId() {
       return `${this.id}-message`
     },
+    additionalListeners() {
+      if (this.type === 'password') {
+        return { passwordGenerated: this.onInput }
+      }
+
+      return {}
+    },
     additionalAttributes() {
       const additionalAttrs = {}
       if (!!this.warningMessage || !!this.errorMessage || !!this.descriptionMessage) {

diff --git a/packages/design-system/src/components/_OcTextInputPassword/_OcTextInputPassword.vue b/packages/design-system/src/components/_OcTextInputPassword/_OcTextInputPassword.vue
@@ -6,7 +6,12 @@
       'oc-text-input-password-wrapper-danger': hasError
     }"
   >
-    <input v-bind="$attrs" v-model="password" :type="showPassword ? 'text' : 'password'" />
+    <input
+      v-bind="$attrs"
+      v-model="password"
+      :type="showPassword ? 'text' : 'password'"
+      ref="passwordInput"
+    />
     <oc-button
       v-if="password"
       v-oc-tooltip="$gettext('Show password')"
@@ -101,8 +106,9 @@ export default defineComponent({
       default: false
     }
   },
-  emits: ['passwordChallengeCompleted', 'passwordChallengeFailed'],
-  setup(props, { emit, attrs }) {
+  emits: ['passwordChallengeCompleted', 'passwordChallengeFailed', 'passwordGenerated'],
+  setup(props, { emit }) {
+    const passwordInput = ref(null)
     const { $gettext } = useGettext()
     const password = ref(props.value)
     const showPassword = ref(false)
@@ -138,6 +144,11 @@ export default defineComponent({
       const generatedPassword = props.generatePasswordMethod()
       password.value = generatedPassword
       showPassword.value = true
+      emit('passwordGenerated', password.value)
+    }
+
+    const focus = () => {
+      unref(passwordInput).focus()
     }
 
     watch(password, (value) => {
@@ -155,9 +166,11 @@ export default defineComponent({
     })
 
     return {
+      focus,
       $gettext,
       password,
       showPassword,
+      passwordInput,
       copyPasswordIcon,
       showPasswordPolicyInformation,
       testedPasswordPolicy,