fix(chat): make code copy button work in non-secure contexts - #596
Open
yyyCode wants to merge 1 commit into
Open
fix(chat): make code copy button work in non-secure contexts#596yyyCode wants to merge 1 commit into
yyyCode wants to merge 1 commit into
Conversation
…ai-alibaba#350) 代码块的「复制」按钮此前直接调用 navigator.clipboard.writeText。该 API 仅在安全 上下文(HTTPS 或 localhost)可用,当通过局域网 IP 以 HTTP 访问时 navigator.clipboard 为 undefined,点击复制会直接抛出 TypeError,按钮无任何反应,即 issue 所述「复制按钮无效」。 新增 copyTextToClipboard 工具函数:优先使用异步 Clipboard API,在非安全上下文下降级到 document.execCommand('copy')(临时 textarea 方案),并统一返回成功与否。markdown 高亮插件 改为调用该函数,根据结果切换按钮文案。附带覆盖两条路径的单元测试。 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Describe what this PR does / why we need it
修复问答流程中代码块「复制」按钮在非安全上下文(局域网 HTTP 访问)下无效的问题,解决 #350。
根因:代码块复制按钮(
markdown-plugin-highlight.ts中的window.copyCodeBlock)直接调用navigator.clipboard.writeText。异步 Clipboard API 仅在安全上下文(HTTPS 或localhost)下可用。当用户通过局域网 IP(如http://192.168.x.x:port)以纯 HTTP 访问前端时,navigator.clipboard为undefined,点击复制会在调用.writeText前就抛出TypeError,连原有的.catch分支都进不去,按钮完全无反应 —— 即 issue 描述的「复制按钮无效」。Does this pull request fix one issue?
Fixes #350
Describe how you did it
app/utils/clipboard.ts中的copyTextToClipboard(text):navigator.clipboard.writeText;document.execCommand('copy')(临时隐藏textarea方案),并在结束后清理该元素;Promise<boolean>表示是否复制成功。app/utils/markdown/markdown-plugin-highlight.ts改为调用该函数,依据返回结果切换按钮文案(已复制!/复制失败),保持原有交互与提示不变。app/utils/clipboard.test.ts,覆盖:安全上下文走 Clipboard API、writeText失败后降级、非安全上下文降级成功、execCommand失败返回 false、临时 textarea 复制后被移除。Describe how to verify it
cd data-agent-frontend-nuxt && pnpm test:unit(全部 22 条通过,含本次新增 5 条)。pnpm build通过。Special notes for reviews
vi.stubGlobal桩入最小document/navigator/window,未引入 jsdom 等额外依赖。