fix(VInput): Remove redundant aria roles in v-input

[yncat]

Description

There was a critical issue using v-input with screen readers. Because it had role="alert" applied immediately upon rendering, screen readers would repeat “alert” as many times as there were v-input components on the screen after page load. For example, if I had 5 input boxes in a page, I had to hear "alert alert alert alert alert" as the page finished loading. This issue significantly interrupted screen reader users' browsing experience.

I also removed aria-live="polite" as it was functionally redundant with role="alert".

Although alert role is no longer present, error messages are still announced correctly when they appear because the messages area is connected via aria-describedby. So, this change simply eliminates the redundant “alert” announcements without compromising the accessibility of the component.

I’ve tested this locally and confirmed that it works as expected. I hope the dev team can integrate this fix into the next patch version.

Markup:

<template>
  <v-app>
    <v-app-bar app color="primary" dark>
      <v-app-bar-title>Vue + Vuetify テスト</v-app-bar-title>
    </v-app-bar>

    <v-main>
      <v-container>
        <v-row>
          <v-col cols="12">
            <h1 class="text-h2 mb-4">Vue.js + Vuetify test！</h1>

            <v-card>
              <v-card-title>Form</v-card-title>
              <v-card-text>
                <v-text-field
                  label="Name"
                  prepend-icon="mdi-account"
                  v-model="name"
                  :rules="[rules.required]"
                ></v-text-field>
                <v-text-field
                  label="Email"
                  prepend-icon="mdi-email"
                  type="email"
                  v-model="email"
                  :rules="[rules.required]"
                ></v-text-field>
                <v-btn color="primary" @click="showAlert">
                  Submit
                </v-btn>
              </v-card-text>
            </v-card>
          </v-col>
        </v-row>
      </v-container>
    </v-main>
  </v-app>
</template>

<script>
export default {
  name: 'App',
  data() {
    return {
      name: '',
      email: '',
      rules: {
        required: value => !!value || '入力は必須です'
      }
    }
  },
  methods: {
    showAlert() {
      alert(`Hello, ${this.name || 'John Doe'}!`)
    }
  }
}
</script>