这篇文章用于验证当前 Hugo 博客模板 template-v1.0.1 是否完整保留所有已经实现的功能。

需要重点测试：

  • 基础 Markdown
  • 表格
  • 代码块自动换行
  • 长链接自动换行
  • 图片 Lightbox
  • ArtPlayer 视频播放器
  • APlayer 音乐播放器
  • Bilibili lazy 嵌入
  • 下载附件卡片
  • 书影音卡片
  • 内链文章卡片
  • 提示块
  • details 折叠内容
  • 脚注
  • 搜索索引
  • 移动端适配
  • 深色 / 浅色模式

1. 基础 Markdown

这是普通段落，用来测试中文排版、段落间距、行高和移动端换行。

这是粗体文本，这是斜体文本，这是删除线文本，这里还有 行内代码 inline code。

这是一个很长的连续字符串，用来测试自动换行：

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

这是一个很长的链接，用来测试不会撑破页面：

https://example.com/this/is/a/very/very/very/long/url/for/testing/template-v101-responsive-wrapping?query=abcdefghijklmnopqrstuvwxyz0123456789&from=hugo-template-test

2. 列表测试

无序列表

  • 首页导航
  • 搜索页面
  • 404 页面
  • ArtPlayer 视频
  • APlayer 音乐
  • 封面
  • 进度条
  • 移动端适配

有序列表

  • 打开文章
  • 切换深色 / 浅色模式
  • 点击图片
  • 播放视频
  • 播放音乐
  • 测试下载按钮

任务列表

  • Markdown 正常
  • 图片 Lightbox 正常
  • ArtPlayer 正常
  • APlayer 正常
  • 部署后最终人工确认

3. 提示块测试

提示这是一个 info 提示块，用于测试普通提示内容。注意这是一个 warning 提示块，用于测试注意事项。风险这是一个 danger 提示块，用于测试风险提醒。

4. 表格测试

功能状态说明Markdown正常标题、段落、列表、引用等基础格式图片 Lightbox正常点击图片后应在站内弹层打开ArtPlayer正常支持 MP4 直链、倍速、全屏、进度记忆APlayer正常支持封面、歌曲信息、进度条搜索页面正常支持关键词附近摘要和高亮

5. 多列表格测试

编号组件桌面端移动端深色模式浅色模式备注A001ArtPlayer正常正常正常正常移动端保留原生全屏A002APlayer正常正常正常正常手机端歌曲信息完整显示A003Search正常正常正常正常搜索结果显示关键词附近内容A004Download正常正常正常正常下载按钮醒目A005404正常正常正常正常独立页面，不继承普通模板

6. 代码块测试

Bash

1hugo --gc --minify
2grep -R "template-v101-acceptance-test" public/posts/template-v101-acceptance-test/index.html

JavaScript

1document.addEventListener("DOMContentLoaded", function () {
2  const message = "Template v1.0.1 acceptance test loaded.";
3  console.log(message);
4});

C#

1using System;
2
3class Program
4{
5    static void Main()
6    {
7        Console.WriteLine("Hugo Template v1.0.1");
8    }
9}

7. 图片 Lightbox 测试

点击下面的图片，应该在站内 Lightbox 中打开，而不是跳转外站。

山谷湖泊

海边日落

8. ArtPlayer 视频测试

下面的视频应该使用本地化 ArtPlayer 播放器，不请求 ArtPlayer CDN。

检查点：

  • 可以播放
  • 有画面和声音
  • 设置按钮正常
  • 倍速正常
  • 画中画正常
  • 全屏正常
  • 移动端长按不弹下载菜单
  • 播放进度记忆正常

9. APlayer 音乐卡片测试

下面的音乐卡片应该使用本地化 APlayer，不显示原生 audio 控件。

检查点：

  • 有封面
  • 有歌曲名
  • 有作者和专辑
  • 有进度条
  • 可以拖动进度
  • 手机端不溢出
  • 深色模式可读

10. Bilibili lazy 嵌入测试

下面应显示一个 Bilibili 懒加载占位卡片，点击后再加载播放器。

▶
点击播放 Bilibili 视频

11. 下载附件卡片测试

Seer2CoreDLL.swf SWF 文件 / Flash 资源文件 / 用于测试下载按钮下载附件

12. 书影音卡片测试

哥德尔、艾舍尔、巴赫 Book哥德尔、艾舍尔、巴赫集异璧之大成个人评分：9.5 一本关于数学、音乐、艺术和意识的经典著作。 查看详情A River Runs Through It MovieA River Runs Through It大河恋个人评分：9.0 一部关于家庭、成长、自然与人生选择的电影。 查看详情

13. 内链文章卡片测试

推荐阅读全组件压力测试测试 Markdown、图片、视频、附件、表格和移动端适配。→视频测试公共领域电影播放测试测试多个 ArtPlayer 长视频播放器是否正常工作。→

14. 折叠内容测试

点击展开模板说明这里是折叠内容，用于测试 “details” 和 “summary”。

  • 支持列表
  • 支持 粗体
  • 支持 `行内代码
  • 移动端应该正常显示

15. 引用和脚注测试

这是一个引用块，用来测试引用样式在深色和浅色模式下的显示效果。

这里是一段带脚注的文字。1

16. HTML 块测试

这是一个 HTML 块，用于确认 Goldmark unsafe HTML 仍然可以正常渲染。

17. 搜索测试关键词

为了测试搜索页面，请在部署后访问 “/search/” 搜索以下关键词：

  • “template-v101-video-oceans”
  • “SoundHelix”
  • “Seer2CoreDLL”
  • “全功能验收”
  • “Bilibili” 搜索结果应该能显示关键词附近的正文摘要，并高亮关键词。

18. 结论

如果这篇文章中的所有组件在桌面端、移动端、深色模式和浅色模式下都能正常显示，说明 “template-v1.0.1” 模板基本验收通过。

这是模板 v1.0.1 验收测试中的脚注内容。 ↩︎