v1.0.2
* feat: add side panel with navigation and storage cleaner functionality * feat: add OpenUrlPage and integrate into app navigation * feat: 添加 GlobalSnackbar 组件并在多个页面中集成,替换原有 Snackbar 实现 * feat: fix OpenUrl sidebar issue with architecture refactor - 修复原问题:不再直接替换侧边栏 URL,保持插件导航可见 - 采用配置页 + 查看页分离架构:OpenUrlPage (配置) + OpenUrlViewerPage (查看) - 支持多个 URL 快捷方式管理(添加/删除) - 每个 URL 提供两种打开方式:在侧边栏打开 / 在新标签页打开 - 侧边栏查看页使用 iframe 占满全部剩余空间 - 更新 TypeScript 类型定义 - 保留原有混合内容警告检查 - 数据持久化到 Chrome Storage * refactor: centralized route management - consolidate routing config into single source * feat: 更换logo * refactor: code review fixes - security and race condition improvements Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> Changes: - wxt.config.ts: Remove unused `debugger` permission (no code uses it) - OpenUrlPage.tsx: Fix unreachable showMessage after window.close() - OpenUrlPage.tsx: Replace unnecessary div wrapper with Fragment to reduce DOM nesting - OpenUrlViewerPage.tsx: Add URL validation to prevent XSS via javascript:/data: URLs - OpenUrlViewerPage.tsx: Add sandbox attribute to iframe for security isolation - OpenUrlViewerPage.tsx: Add error handling for invalid URLs - StorageCleanerPage.tsx: Fix race condition in handleOptionChange preference saving - StorageCleanerPage.tsx: Remove unnecessary storage reads when saving preferences (use state directly) - StorageCleanerPage.tsx: Add timeout cleanup for setTimeout to follow React best practices * feat: implement drill-down navigation with master-detail dashboard * feat: enhance dashboard dynamism and refine options UI * feat: overhaul storage cleaner UI with real-time size estimation and modern aesthetics * feat: overhaul TimestampPage UI/UX and fix GlobalSnackbar positioning * fix: decouple popup routing from storage sync and enhance OpenUrlPage UI * fix: avoid closing sidepanel when opening URL preview from within sidepanel
Testing Tools Browser Extension
这是一个基于 WXT 框架的浏览器扩展项目,提供时间戳转换工具。
项目概述
Testing Tools 是一个轻量级的浏览器扩展,提供实用的时间戳转换功能。项目采用现代化的技术栈,包括 React 19、TypeScript 和 Material UI,并利用 WXT 框架简化浏览器扩展的开发流程。
功能特性
时间戳转换工具
- 实时显示当前时间戳(毫秒/秒可切换)
- 日期与时间戳之间的双向转换
- 支持多个时区(亚洲/上海、美洲/纽约、欧洲/伦敦)
- 一键复制转换结果
- 输入验证和错误提示
技术栈
- 框架: WXT (Web Extension Toolkit)
- 前端: React 19 + TypeScript
- UI 库: Material UI
- 日期处理: dayjs (含 UTC 和时区插件)
- 通信: @webext-core/messaging
- 存储: Chrome Storage API (类型安全封装)
项目结构
├── entrypoints/ # 浏览器扩展入口点
│ ├── popup/ # 扩展弹窗界面(时间戳转换页面)
│ ├── options/ # 选项页面
│ ├── background.ts # 后台脚本
│ └── content.ts # 内容脚本
├── utils/ # 工具函数(存储、日期处理、消息通信)
├── types/ # TypeScript 类型定义
├── public/ # 静态资源
├── wxt.config.ts # WXT 配置文件
├── package.json # 项目依赖和脚本
└── README.md # 项目说明文档
开发环境要求
- Node.js >= 18
- npm 或 yarn
安装与运行
1. 安装依赖
npm install
2. 开发模式
# Chrome 浏览器
npm run dev
# Firefox 浏览器
npm run dev:firefox
3. 构建生产版本
# Chrome 浏览器
npm run build
# Firefox 浏览器
npm run build:firefox
4. 打包分发
# Chrome 浏览器
npm run zip
# Firefox
npm run zip:firefox
5. 其他命令
npm run compile # TypeScript 类型检查
npm run lint # ESLint 代码检查
权限说明
扩展请求以下权限:
storage和unlimitedStorage- 本地数据存储clipboardWrite- 剪贴板写入(复制功能)activeTab,scripting,tabs- 当前标签页控制和脚本注入debugger- 调试器权限<all_urls>- 访问所有网站内容(内容脚本注入)
主要依赖
react,react-dom- 前端框架@mui/material- UI 组件库dayjs- 日期处理@webext-core/messaging- 扩展消息通信
贡献指南
- Fork 项目
- 创建功能分支 (
git checkout -b feature/AmazingFeature) - 提交更改 (
git commit -m 'Add some AmazingFeature') - 推送到分支 (
git push origin feature/AmazingFeature) - 创建 Pull Request
许可证
此项目为私有项目 (private: true),仅供内部使用。
Languages
TypeScript
98.9%
CSS
0.5%
JavaScript
0.4%
HTML
0.2%