♿️(frontend) fix form labels and autocomplete wiring

Ensure labels map to inputs and avoid empty describedby output

CHANGELOG.md

@@ -8,6 +8,10 @@ and this project adheres to
 
 ## [Unreleased]
 
+### Changed
+
+- ♿️(frontend) fix form labels and autocomplete wiring #932
+
 ## [1.5.0] - 2026-01-28
 
 ### Changed

src/frontend/src/features/rooms/components/Join.tsx

@@ -446,16 +446,14 @@ export const Join = ({
                 type="text"
                 onChange={saveUsername}
                 label={t('usernameLabel')}
-                aria-label={t('usernameLabel')}
+                id="input-name"
                 defaultValue={username}
                 validate={(value) => !value && t('errors.usernameEmpty')}
                 wrapperProps={{
                   noMargin: true,
                   fullWidth: true,
                 }}
-                labelProps={{
-                  center: true,
-                }}
+                autoComplete="name"
                 maxLength={50}
               />
             </VStack>

src/frontend/src/primitives/Field.tsx

@@ -138,7 +138,9 @@ export const Field = <T extends object>({
   const LabelAndDescription = (
     <>
       <StyledLabel {...props.labelProps}>{label}</StyledLabel>
-      <FieldDescription slot="description">{description}</FieldDescription>
+      {description ? (
+        <FieldDescription slot="description">{description}</FieldDescription>
+      ) : null}
     </>
   )
   const RACFieldErrors = (