Skip to content

两处表单控件缺 label→control 关联:InlineCreateRelated 的 label 无 htmlFor/id,custom action-param-dialog 的 select 分支 htmlFor 指向不存在的 id #3341

Description

@xuyushun441-sys

实施 #3299(PR #3340,给五处渲染器送 aria-required)时逐处核对发现的相邻但不同类缺陷,按范围栅栏不在该 PR 内修,单独立此单。#3299 修的是「必填状态不进 a11y 树」;本单是「label 与控件根本没有程序化关联」——即便 aria-required 已经到位,控件的可访问名仍然是错的或缺失的。

两处清单(已逐处核对)

  1. packages/plugin-detail/src/InlineCreateRelated.tsx(Create 页签,~L208-L220):label 元素没有 htmlFor,对应的 Input 没有 id,两者也不是包裹关系。控件的可访问名只能退化到 placeholder("Enter name"),label 文本(真正的字段名)对屏幕阅读器不可达;点击 label 也无法聚焦输入框。

  2. packages/components/src/custom/action-param-dialog.tsx(select 分支,~L171-L189):Label htmlFor={param.name},但该分支的控件是 Radix SelectTrigger,没有设置 id={param.name}——htmlFor 指向一个不存在的 id,combobox 从 label 得不到可访问名。其余分支(textarea/number/date/text)的 Input/Textarea 都设了 id={param.name},只有 select 漏了。

(同文件家族中 app-shell 的 ActionParamDialog.tsx 无此问题:paramToField 保留 name,字段 widget 用 config.name 作 id,与 htmlFor 对得上。)

建议修法

  • InlineCreateRelated:label 加 htmlFor、Input 加 id(如 inline-create-${field.name},注意同页多实例时的唯一性,可结合 React.useId)。
  • custom action-param-dialog:SelectTrigger 加 id={param.name}。

验收

关联:#3299、#3290、PR #3340。

Activity

  1. self-assigned this
    on Aug 5, 2026
  2. yinlianghui commented on Aug 5, 2026

    @yinlianghui
    Collaborator

    认领:objectui 分片 PM 滚动补位第 4 单(bug 优先口径)
    会话:session_01GTRjn8xBqp75dk7kFupVRt
    分支:claude/issue-3341-label-control-association
    Worktree:objectui-issue-3341
    域:objectui 分片(plugin-detail / components)
    文件面:packages/plugin-detail/src/InlineCreateRelated.tsx、packages/components/src/custom/action-param-dialog.tsx + 相应测试 + .changeset/*.md(越界即停,报告说明)。⛔ 不碰 plugin-detail/src/ReactionPicker.tsx、RecordActivityTimeline.tsx 与 components/src/renderers/**(另一 dev 在飞 #5407)。

    验收照正文:getByLabelText 命中控件 + toHaveAccessibleName 等于 label 文本;InlineCreateRelated 用 React.useId 保证同页多实例唯一性;不动 spec、不动 widget props 契约。


    Generated by Claude Code

  3. yinlianghui commented on Aug 5, 2026

    @yinlianghui
    Collaborator

    PM 验收:ACCEPT → PR #3380 已转 ready + auto-merge(CI 15 项:13 绿 2 预期跳过,mergeable clean),跟到 MERGED。

    两处修复均落地:InlineCreateRelated 用 React.useId 命名空间化 id(同页两个 related list 共享 field.name 也不撞);action-param-dialog 的 SelectTrigger 补 id={param.name}。反向验证 11/11 全红且报错文本就是缺陷本身(「no form control was found associated to that label」)。事实修正记账:issue 说修前可访问名退化到 placeholder,实测是空串(dom-accessibility-api 不实现 placeholder 回退,真浏览器才按 HTML-AAM 回退)—— 结论不变,记录防后人误引。dev 还实地踩到并记录了 #3288 的另一形态(包内跑 vitest 报 No test files found 假绿)。

    衍生:#3381(Link-Existing 页签搜索框完全无标签,可访问名全靠 placeholder 且输入后消失 —— 与本单「关联断裂」不同类,是「标签缺失」)已复核入队 bug + pm:queue。

    objectui 分片 PM session_01GTRjn8xBqp75dk7kFupVRt


    Generated by Claude Code

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions