QUnit 是轻量易用的 JavaScript 单元测试框架，适用于浏览器端库测试；通过引入 CSS、JS、源码、测试脚本及两个 DOM 容器即可运行，支持模块分组、生命周期钩子和多种断言方法。
QUnit 是轻量、易上手的 JavaScript 单元测试框架，特别适合浏览器端库（如 js-cookie）的测试。集成它不需复杂构建流程，核心是 HTML 入口 + 依赖引入 + 测试组织。
准备 QUnit 运行环境
在项目中新建一个测试 HTML 文件（例如 test/index.html），按顺序引入以下内容：
-
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.20.0.css">（样式文件，用于渲染测试界面） -
<script src="https://code.jquery.com/qunit/qunit-2.20.0.js"></script>（核心测试引擎） - 被测源码（如
<script src="../src/cookies.js"></script>） - 测试脚本（如
<script src="./tests.js"></script>） - 两个必需的 DOM 容器：
<div id="qunit"></div>和<div id="qunit-fixture"></div>
编写可执行的测试用例
在 tests.js 中使用 QUnit.test() 定义测试单元，每个测试应聚焦单一行为。例如验证 cookie 写入与读取：
QUnit.test('get() returns value after set()', function(assert) {
Cookies.set('test', 'ok');
assert.strictEqual(Cookies.get('test'), 'ok', 'value matches');
});
常用断言方法包括：
-
assert.ok(condition, msg)：判断布尔值为真 -
assert.equal(actual, expected, msg)：宽松相等（==） -
assert.strictEqual(actual, expected, msg)：严格相等（===） -
assert.deepEqual(actual, expected, msg)：深度比较对象/数组
若测试含多个断言，建议用 assert.expect(n) 显式声明数量，避免漏执行导致误判通过。
组织测试结构与生命周期
用 QUnit.module() 对测试分组，便于归类和复用前置/后置逻辑：
QUnit.module('Cookie expiration', {
beforeEach: function() {
document.cookie = ''; // 清空已有 cookie
}
});
QUnit.test('expires in 1 day', function(assert) {
Cookies.set('tmp', 'x', { expires: 1 });
assert.ok(document.cookie.includes('tmp=x'), 'cookie is set');
});
支持 beforeEach 和 afterEach 钩子，适合清理 DOM、重置状态等操作。
运行与调试测试
直接用浏览器打开 test/index.html 即可看到 QUnit 界面，所有测试实时运行并显示通过/失败详情。失败时会高亮展示「期望值 vs 实际值」，定位问题非常直观。
如需自动化或 CI 集成，可搭配 grunt-qunit 或 puppeteer 启动无头浏览器执行测试，但日常开发只需本地 HTML 页面即可高效验证。
