fix(agent): identify assistant input controls (#715)

This commit is contained in:
InfinityPacer
2026-08-25 12:11:02 +08:00
committed by GitHub
parent fcddcda4b9
commit 99d306fa96
2 changed files with 25 additions and 0 deletions
@@ -1,6 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { useDisplay } from 'vuetify' import { useDisplay } from 'vuetify'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { useId } from 'vue'
import api, { isApiResponse } from '@/api' import api, { isApiResponse } from '@/api'
import { useAuthStore, useUserStore } from '@/stores' import { useAuthStore, useUserStore } from '@/stores'
import { getCurrentLocale } from '@/plugins/i18n' import { getCurrentLocale } from '@/plugins/i18n'
@@ -343,6 +344,9 @@ const drawerStyle = computed(() => ({
'--agent-assistant-panel-width': drawerWidth.value, '--agent-assistant-panel-width': drawerWidth.value,
zIndex: AGENT_ASSISTANT_LAYER_Z_INDEX.panel, zIndex: AGENT_ASSISTANT_LAYER_Z_INDEX.panel,
})) }))
const inputGroupId = useId()
const fileInputId = `agent-assistant-file-input-${inputGroupId}`
const messageInputId = `agent-assistant-message-input-${inputGroupId}`
// 创建前端展示用的临时 ID。 // 创建前端展示用的临时 ID。
function createId(prefix: string) { function createId(prefix: string) {
@@ -2765,9 +2769,11 @@ onScopeDispose(() => {
<div class="agent-assistant-input"> <div class="agent-assistant-input">
<input <input
ref="fileInputRef" ref="fileInputRef"
:id="fileInputId"
class="agent-assistant-file-input" class="agent-assistant-file-input"
type="file" type="file"
multiple multiple
name="attachments"
:disabled="isBusy" :disabled="isBusy"
@change="handleFileSelection" @change="handleFileSelection"
/> />
@@ -2776,14 +2782,17 @@ onScopeDispose(() => {
:disabled="isBusy || recording" :disabled="isBusy || recording"
:title="t('agentAssistant.attachFile')" :title="t('agentAssistant.attachFile')"
:aria-label="t('agentAssistant.attachFile')" :aria-label="t('agentAssistant.attachFile')"
:aria-controls="fileInputId"
@click="openFilePicker" @click="openFilePicker"
> >
<VIcon icon="mdi-plus" /> <VIcon icon="mdi-plus" />
</IconBtn> </IconBtn>
<textarea <textarea
ref="inputRef" ref="inputRef"
:id="messageInputId"
v-model="inputText" v-model="inputText"
class="agent-assistant-textarea" class="agent-assistant-textarea"
name="message"
rows="1" rows="1"
:disabled="isBusy || recording" :disabled="isBusy || recording"
:placeholder="inputPlaceholder" :placeholder="inputPlaceholder"
@@ -207,6 +207,22 @@ describe('AgentAssistantPanel stream recovery', () => {
vi.useRealTimers() vi.useRealTimers()
}) })
it('exposes unique semantic controls for file attachments and messages', () => {
const wrapper = mountPanel()
const fileInput = wrapper.get('input[type="file"]')
const messageInput = wrapper.get('textarea')
const attachButton = wrapper.get('.agent-assistant-attach')
expect(fileInput.attributes('id')).toMatch(/^agent-assistant-file-input-/)
expect(fileInput.attributes('name')).toBe('attachments')
expect(messageInput.attributes('id')).toMatch(/^agent-assistant-message-input-/)
expect(messageInput.attributes('name')).toBe('message')
expect(fileInput.attributes('id')).not.toBe(messageInput.attributes('id'))
expect(attachButton.attributes('aria-controls')).toBe(fileInput.attributes('id'))
wrapper.unmount()
})
it('toggles the desktop assistant between the side panel and fullscreen modes', async () => { it('toggles the desktop assistant between the side panel and fullscreen modes', async () => {
displayState.mdAndDown.value = false displayState.mdAndDown.value = false
vi.stubGlobal( vi.stubGlobal(