diff --git a/src/components/KInput/KInput.cy.ts b/src/components/KInput/KInput.cy.ts index 2518472f92..92111177b2 100644 --- a/src/components/KInput/KInput.cy.ts +++ b/src/components/KInput/KInput.cy.ts @@ -188,11 +188,11 @@ describe('KInput', () => { cy.get('.k-input .mask-value-toggle-button').should('be.visible') cy.get('.k-input input').should('have.attr', 'type', 'password') + cy.get('.k-input input').focus() cy.get('.k-input .mask-value-toggle-button').click() cy.get('.k-input input').should('have.attr', 'type', 'text') cy.get('.k-input .mask-value-toggle-button').click() - cy.get('.k-input input').should('have.attr', 'type', 'password') - + cy.get('.k-input input').should('have.attr', 'type', 'password').should('be.focused') // user-provided after slot should be rendered cy.get('.k-input').find(`[data-testid="${afterSlot}"]`).should('not.exist') }) diff --git a/src/components/KInput/KInput.vue b/src/components/KInput/KInput.vue index b3e09c21a8..5e6043be97 100644 --- a/src/components/KInput/KInput.vue +++ b/src/components/KInput/KInput.vue @@ -51,6 +51,8 @@ :aria-label="`${maskValue ? 'Hide' : 'Show'} value`" class="mask-value-toggle-button" @click.stop="maskValue = !maskValue" + @mousedown.prevent + @mouseup.prevent > #{$kongponentsKongIconSelector}:not(button):not([role="button"]):only-child) { + pointer-events: none; + } + :deep([role="button"]:not(.k-button)), :deep(button:not(.k-button)), .mask-value-toggle-button { @include defaultButtonReset;