Web App login button stays disabled after Chrome autofills credentials

快速结论：该问题出现在 Dify 自托管 Web App 的登录页（/webapp-signin）：Chrome 自动填充邮箱和密码后，输入框看起来已填好，但登录按钮仍处于禁用状态。原因是按钮依赖 React 表单状态，而 Chrome 自动填充可能只改 DOM 值、不触发组件的 onValueChange 回调，优先排查登录表单的状态同步与提交时的取值逻辑。

适用环境：Dify 自托管（Self Hosted, Source）；前端从源码运行，main 分支提交 809f5df3a3，web/package.json 版本 1.17.1；浏览器为 Chrome；复现环境为本地前端连接已有后端。Issue 未提供操作系统、Python、CUDA、显卡等环境信息。

最快修复方案：暂无确认的一步修复方案。Issue 中报告者表示已在本地做过修复（考虑浏览器自动填充状态，并在提交时重新读取当前输入值），并补充了回归测试，但讨论中尚未确认该修复已合并进 main。

注意事项：不要只把“轮询输入框值”当作完整修复——Issue 明确指出，某些自动填充状态下 Chrome 会先显示凭据、后向 JavaScript 暴露取值，单靠轮询仍可能拿不到值。改动后需要同时覆盖“原生值变化但不触发 input 事件”和“自动填充标识已出现但值尚不可读”两类场景；在非 Chromium 浏览器和其他自动填充实现上的表现尚未验证。

问题场景

用户在自托管 Dify 中为已发布的 Web App 启用邮箱/密码登录，并在 Chrome 密码管理器中保存了该 Web App 源的有效凭据。打开 Web App 后被重定向到 /webapp-signin?redirect_url=...，让 Chrome 自动填充邮箱和密码、不手动输入任何字段，此时登录按钮仍为禁用，无法提交。该问题针对 Web App 登录页 /webapp-signin，不是控制台登录页 /signin。

报错原文

Web App login button stays disabled after Chrome autofills credentials

原因分析

维护者已在当前 main 上确认根因：webapp-signin/components/mail-and-password-auth.tsx 中提交按钮的禁用条件为 disabled={isLoading || !email || !password}，而输入框只有通过 onValueChange 才更新这两个 React 状态。Chrome 自动填充直接写入 DOM 值，不会触发该回调，导致状态与界面上显示的已填内容不同步，按钮保持禁用。

另一个可能原因是：在部分自动填充状态下，Chrome 会先显示凭据，之后才把值暴露给 JavaScript，所以仅靠轮询输入框取值也不够。修复需要识别浏览器的自动填充状态，并在提交时重新读取当前输入值。

环境排查

确认使用的前端是否为源码运行的 main 分支提交 809f5df3a3，以及 web/package.json 版本是否为 1.17.1 或包含相同表单逻辑的版本。
确认问题页面是 Web App 的 /webapp-signin，而非控制台 /signin。
确认已在 Chrome 密码管理器中为 Web App 源保存有效凭据，且自动填充生效。
确认 Web App 已启用邮箱/密码认证。
检查 webapp-signin/components/mail-and-password-auth.tsx 中按钮禁用条件是否仍基于 email/password React 状态，且输入框是否只通过 onValueChange 更新状态。

解决步骤

定位 Web App 登录表单组件 webapp-signin/components/mail-and-password-auth.tsx，确认提交按钮当前由 React 的 email/password 状态控制禁用。
可优先尝试：让按钮可用性判断兼顾浏览器自动填充状态，而不是只看 onValueChange 是否触发过。
在提交处理中重新读取输入框的当前值，使用提交时读到的凭据走既有校验与登录流程，避免依赖可能滞后的 React 状态。
不要只实现输入值轮询；需处理“Chrome 已显示凭据但值尚不可读”的时序，在值变为可读后再让按钮可用或允许提交。
补充回归测试，至少覆盖：原生值变化但不触发 input 事件；自动填充标识已出现但值尚不可读。
修改前端后重新构建/重启前端服务，再按原复现步骤在 Chrome 中验证。

验证方法

使用 Chrome 密码管理器中已保存的有效凭据，打开 Web App 并进入 /webapp-signin?redirect_url=...，让 Chrome 自动填充邮箱和密码、不手动编辑任何字段。预期两个输入框显示凭据后登录按钮变为可用；点击按钮能用当前凭据完成登录并继续重定向，且全程无需手动修改任一字段。同时在本地运行新增的回归测试，确认原生值变化和自动填充值延迟可读两种场景均通过。