Skip to content

✨ 日志页支持复制日志行与导出日志 - #1813

Open
CodFrm wants to merge 2 commits into
mainfrom
feature/logger-copy-export
Open

CodFrm wants to merge 2 commits into
mainfrom
feature/logger-copy-export

Conversation

@CodFrm

@CodFrm CodFrm commented Oct 30, 2026

Copy link
Copy Markdown
Member

Checklist / 检查清单

  • Fixes mentioned issues / 修复已提及的问题
  • Code reviewed by human / 代码通过人工检查
  • Changes tested / 已完成测试

Description / 描述

close #1810

背景

1.5 重做日志页后,每行日志是一个 <button>(点击展开详情),文字无法拖选,桌面端消息还会被截断,展开详情只有 JSON。1.4 时每行是纯文本 时间 消息 {标签JSON},用户靠拖选多行复制,这个用法在 1.5 里没了。issue 希望能导出成普通日志文件。

本次改动

  • 日志行可复制:行容器不再是按钮,文字可以用鼠标拖选、Ctrl+C 复制;拖选松开时有选区就不切换展开,普通单击仍然展开。键盘展开改由行尾箭头按钮承担(aria-expanded)。
  • 单行复制按钮:每行新增复制按钮(桌面端悬停显示,移动端常显),复制为 YYYY-MM-DD HH:mm:ss [LEVEL] message {"label":...}。这是 1.4 的行格式加上级别,标签为空时不带 {}。
  • 导出菜单:顶栏新增「导出 ▾」(移动端为图标按钮),提供 复制为文本 / 下载 .log / 下载 .json。范围是当前筛选结果,没有数据时按钮不可用;导出按时间升序(页面上是新的在前)。.json 保留完整字段并附带可读时间。下载沿用选项页现有的 makeBlobURL + chrome.downloads.download({ saveAs: true }),文件名 scriptcat-logs-YYYYMMDD-HHmmss.{log,json}。复制或下载失败会弹错误提示。
  • 新增的 9 个 logs: 文案补齐到 10 个语言包。
  • 单独一个 commit(✅):把 LoggerMobile.test.tsx 合并进 index.test.tsx。ui 测试项目配置了 isolate: false,两个文件各自 mock 同一个 ./index 的依赖,先加载的那个文件的 mock 会被另一个文件拿去用。改动前按目录运行,基线就随机挂 1~2 条(3 次运行分别失败 2/1/2 条)。合并只调整了测试组织方式,4 条移动端用例原样保留。

已知限制

  • 标签很长时(比如同时有 url 和完整 scriptId),标签 chip 是 shrink-0,会把消息挤成 0 宽,行尾按钮也会被挤出可视区。这个排版在本 PR 之前就存在(chip 的 class 没改),但现在这种行上的复制按钮会点不到。没有在本 PR 里修,作为 follow-up。
  • 不含多选,也不含展开详情里的「文本/JSON」切换。

建议审查重点

  • components.tsx 的 LogRow:行容器 onClick 用 getSelection().toString() 判断是不是在拖选;两个内嵌按钮 stopPropagation,避免同时触发行展开。
  • 导出范围用的是 filtered(当前筛选结果),不是全部日志。

验证

  • pnpm exec vitest run --no-coverage src/pages/options/routes/Logger/ src/locales/:85/85 通过,在最终 head 上连续跑 3 次结果一致。新测试先确认失败(缺少函数或功能),再实现到通过。
  • 测试合并的那个 commit 在不含功能代码的基线上单独跑 Logger 目录 3 次,均为 61/61。
  • pnpm run typecheck、pnpm run check:i18n、改动文件的 prettier/eslint 均通过(pre-commit hook 也跑过)。
  • 没有跑全量 pnpm test:改动只涉及 Logger 页面和 locales。
  • 真实浏览器(pnpm run dev 构建,e2e/session.mjs 无头 Chromium,通过 CDP 操作真实鼠标):
    • 拖选消息文字能选中,且不会展开该行;Ctrl+C 读回的剪贴板内容和选中的文字一致。
    • 普通单击仍然展开。
    • 复制按钮在鼠标移开时 opacity 为 0,悬停时为 1;点击后剪贴板是完整的一行,该行不展开。
    • 只看 ERROR/WARN/INFO 时,「复制为文本」得到 3 行,按 INFO→WARN→ERROR 排列。
    • 下载 .log/.json:chrome.downloads.search 显示 complete,.log 为 313 字节,和导出文本的 UTF-8 字节数一致。这一项是 Playwright 拦截的下载,没有覆盖「另存为」对话框和建议文件名(文件名由单测断言)。
    • 暗色主题和 390px 窄屏都截图看过。

Screenshots / 截图

截图没有附在这里(暗色/亮色、导出菜单、悬停复制按钮、390px 移动端都在本地验证时看过),评审需要的话我再补。

ui 测试项目 isolate:false,index.test.tsx 与 LoggerMobile.test.tsx 各自 mock 同一个 ./index 的依赖(./hooks、toast、use-is-mobile),先加载的文件的 mock 会被另一个文件复用,按目录运行时随机失败 1~2 条。合并为一个文件,useIsMobile 改为按 describe 切换的 vi.fn()。
- 日志行不再是 <button>,文字可拖选复制;拖选松开不触发展开,键盘展开改由行尾箭头按钮承担
- 每行新增复制按钮(桌面端悬停显示),复制为「时间 [级别] 消息 标签JSON」纯文本行
- 顶栏新增导出菜单:复制为文本 / 下载 .log / 下载 .json,范围为当前筛选结果,按时间升序
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Feature] 新版本日志不好复制

1 participant