vuetifyjs/vuetify

[Bug Report][3.6.9] V-input with counter and hide-details='auto' Fails to Fully Hide Details

Open

#19998 opened on Jun 12, 2024

View on GitHub
 (4 comments) (1 reaction) (0 assignees)TypeScript (40,995 stars) (7,139 forks)batch import
C: VTextFieldS: maybeT: bughelp wanted

Description

Environment

Vuetify Version: 3.6.9 Vue Version: 3.4.27 Browsers: Chrome 125.0.0.0 OS: Windows 10

Steps to reproduce

N/A

Expected Behavior

When using v-input with the hide-details prop set to auto and counter enabled, the details section should automatically hide if there is nothing to display. This means that if the input meets all validation criteria or there are no errors or additional messages to show, the details area should remain collapsed, preventing any unnecessary space or blank areas under the input field.

Actual Behavior

Despite the hide-details prop being set to auto, the v-input details section remains persistently visible when the counter is enabled. This results in a persistent blank space underneath the input field even when there are no messages or errors to display.

Reproduction Link

https://play.vuetifyjs.com/#...

Contributor guide

Tech stack
vuetypescriptcss
Domain
frontend
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
fresh
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
Vue.jsVuetify
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
70
Research direction
Investigate the VInput component in Vuetify (likely in packages/vuetify/src/components/VInput/). Focus on the computed property or method that determines whether to show the details slot. The bug is that when `hide details='auto'` and `counter` is enabled, the details section is visible even when no messages exist. Check the condition that toggles details visibility and how the counter's presence affects it. The reproduction link provides a playground example to test changes.