fix: card details focus issue with screen reader

Signed-off-by: Luka Trovic <luka@nextcloud.com>
This commit is contained in:
Luka Trovic
2024-05-07 17:58:21 +02:00
committed by Julius Härtl
parent 1f2055456b
commit 59e371e80f

View File

@@ -5,6 +5,7 @@
<template> <template>
<NcAppSidebar v-if="currentBoard && currentCard" <NcAppSidebar v-if="currentBoard && currentCard"
ref="cardSidebar"
:active="tabId" :active="tabId"
:name="title" :name="title"
:subname="subtitle" :subname="subtitle"
@@ -13,6 +14,7 @@
@update:nameEditable="handleUpdateTitleEditable" @update:nameEditable="handleUpdateTitleEditable"
@update:name="handleUpdateTitle" @update:name="handleUpdateTitle"
@submit-name="handleSubmitTitle" @submit-name="handleSubmitTitle"
@opened="focusHeader"
@close="closeSidebar"> @close="closeSidebar">
<template #secondary-actions> <template #secondary-actions>
<NcActionButton v-if="cardDetailsInModal && isFullApp" icon="icon-menu-sidebar" @click.stop="closeModal()"> <NcActionButton v-if="cardDetailsInModal && isFullApp" icon="icon-menu-sidebar" @click.stop="closeModal()">
@@ -153,7 +155,15 @@ export default {
}, },
}, },
}, },
watch: {
currentCard() {
this.focusHeader()
},
},
methods: { methods: {
focusHeader() {
this.$refs.cardSidebar.$el.querySelector('.app-sidebar-header__mainname').focus()
},
handleUpdateTitleEditable(value) { handleUpdateTitleEditable(value) {
this.titleEditable = value this.titleEditable = value
if (value) { if (value) {