Joplin
/
joplin
mirror of https://github.com/laurent22/joplin.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Desktop: Accessibility: Fix input fields not associated with labels (#11700)

pull/11735/head
pedr 2025-01-27 13:52:11 -03:00 committed by GitHub
parent 98540493e0
commit 68f4b8ed0c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/app-desktop/gui/NotePropertiesDialog.tsx
View File

@ -39,6 +39,8 @@ interface State {
editedValue: any;
}
const uniqueId = (key: string) => `note-properties-dialog-${key}`;
class NotePropertiesDialog extends React.Component<Props, State> {
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Old code before rule was applied
@ -281,7 +283,7 @@ class NotePropertiesDialog extends React.Component<Props, State> {
const styles = this.styles(this.props.themeId);
const theme = themeStyle(this.props.themeId);
const labelText = this.formatLabel(key);
const labelComp = <label role='rowheader' style={{ ...theme.textStyle, ...theme.controlBoxLabel }}>{labelText}</label>;
const labelComp = <label htmlFor={uniqueId(key)} role='rowheader' style={{ ...theme.textStyle, ...theme.controlBoxLabel }}>{labelText}</label>;
let controlComp = null;
let editComp = null;
let editCompHandler = null;
@ -306,6 +308,8 @@ class NotePropertiesDialog extends React.Component<Props, State> {
onChange={event => this.setState({ editedValue: event.target.value })}
onKeyDown={event => onKeyDown(event)}
style={styles.input}
id={uniqueId(key)}
name={uniqueId(key)}
/>;
editCompHandler = () => {
@ -324,6 +328,8 @@ class NotePropertiesDialog extends React.Component<Props, State> {
}}
onKeyDown={event => onKeyDown(event)}
style={styles.input}
id={uniqueId(key)}
name={uniqueId(key)}
/>
);
}