MDXEditor 测试页面
使用说明:
- 使用工具栏按钮进行格式化
- 支持 Markdown 快捷键（如 **粗体**、*斜体* 等）
- 可以插入表格、链接、代码块等
- 📷 图片功能：点击图片按钮插入、拖拽上传、复制粘贴图片
- 🎯 支持图片调整大小（拖拽图片角落）
- 📱 响应式工具栏：在小屏幕上自动换行，不会横向滚动
- 🕒 时间戳插入：点击时钟按钮插入当前播放器时间戳
- 点击上方按钮测试编辑器的 API 方法
🎹 快捷键测试:
测试快捷键是否正常工作：
- Cmd/Ctrl + B - 粗体（应该在编辑器内生效，不触发全局快捷键）
- Cmd/Ctrl + I - 斜体
- Cmd/Ctrl + U - 下划线
- Cmd/Ctrl + K -插入/编辑链接 🔗(重点测试项)
- Cmd/Ctrl + Z - 撤销
- Cmd/Ctrl + Y - 重做
💡 点击编辑器后尝试这些快捷键，确保它们控制编辑器而不是触发浏览器/系统的全局快捷键
🔗 链接编辑测试:
测试链接编辑功能是否正常：
- 在编辑器中找到现有链接（如 BibiGPT 官网）
- 将光标放在链接内（不要直接点击）- 应该出现编辑弹窗
- 选中一些文本，按 Cmd/Ctrl + K 创建链接
- 在链接对话框中输入 URL，查看自动建议是否出现
- 测试链接的编辑和删除功能
⚠️ 已知问题：如果点击链接直接跳转了，说明链接编辑功能还需要调整
📱 响应式工具栏测试:
测试工具栏是否正确换行：
- 🖥️ 在大屏幕上：工具栏应该水平显示，按钮紧凑排列
- 📱 在小屏幕上：工具栏应该自动换行，避免横向滚动
- 🔄 调整浏览器窗口大小，观察工具栏是否自适应
- ✅ 所有按钮都应该保持可点击状态
💡 优化内容：减少了分隔符，添加了 flex-wrap 样式，支持响应式布局
🕒 时间戳功能测试:
测试视频笔记时间戳功能：
- 在工具栏中找到时钟图标 ⏰（最右侧）
- 点击时钟按钮，会插入当前播放器的时间戳
- 插入的时间戳格式：
[00:30](timestamp:30) - 点击插入的时间戳链接，播放器会跳转到对应时间
- 适合在看视频时记录重要时间点
🎬 使用场景：视频学习笔记、会议记录、课程总结等需要标记时间点的场景