Jasmine logo

Jasmine

行为驱动开发的 JavaScript 测试框架

测试工具BDD测试单元测试JavaScript测试

Jasmine 是 BDD 风格的 JavaScript 测试框架,内置断言、Mock 和 Spy,无需额外依赖即可编写测试,曾广泛用于 Angular 项目,在遗留代码库中仍有存量。

Jasmine BDD 测试框架技术调研

Jasmine 是行为驱动开发(BDD)风格的 JavaScript 测试框架,内置断言、Mock 和 Spy,无需搭配 Chai 或 Sinon 即可编写测试。曾广泛用于 AngularJS、早期 Angular 和部分前端项目;随着 Jest/Vitest 普及,新项目采用减少,但在特定企业规范与遗留代码库中仍有存量。


一、 基本信息

维度关键指标 / 描述
技术标签BDD / 单元测试 / Spy / Mock / Angular 历史生态
开发商Jasmine 开源社区
官方网站https://jasmine.github.io/
GitHub 仓库jasmine/jasmine
npm 包jasmine
许可协议MIT License
首次发布2010 年
当前版本Jasmine 5.x
生态成熟度中高(存量为主)

二、 技术定位与简介

Jasmine 提供 自包含的 BDD 测试体验

  • describeitexpect 内置。
  • beforeEachafterEach 生命周期。
  • jasmine.createSpycreateSpyObj 内置 Spy。
  • jasmine.clock() 模拟时间。
  • 无需 DOM 断言库即可测纯逻辑。

Angular CLI 早期默认 Karma + Jasmine;Angular 现默认 Jest 或 Vitest,但大量 Angular 项目仍保留 Jasmine 测试。


三、 快速上手安装说明

1. 安装

pnpm add -D jasmine @types/jasmine jasmine-spec-reporter

2. spec/support/jasmine.json

{
  "spec_dir": "tests",
  "spec_files": ["**/*spec.ts"],
  "helpers": ["helpers/**/*.ts"],
  "stopSpecOnExpectationFailure": false,
  "random": true
}

3. 测试示例

describe('Calculator', () => {
  it('adds two numbers', () => {
    expect(1 + 2).toBe(3)
  })
 
  it('uses spy', () => {
    const callback = jasmine.createSpy('callback')
    callback('hello')
    expect(callback).toHaveBeenCalledWith('hello')
  })
})

4. 运行

npx jasmine

5. Angular 项目(Karma)

ng test

使用 karma-jasmine 在浏览器运行。


四、 核心特性

1. 内置断言

toBetoEqualtoContaintoThrow 等 matchers。

2. 异步支持

done callback、async/await、Promise。

3. Spy 与 Mock

const spy = spyOn(obj, 'method').and.returnValue(42)

4. 自定义 Matchers

jasmine.addMatchers 扩展断言。

5. 随机化顺序

random: true 暴露测试间依赖问题。

6. 报告器

jasmine-spec-reporter 美化终端输出。


五、 适用场景

1. 黄金适用场景

  • 遗留 Angular + Karma + Jasmine 项目。
  • 企业标准化 Jasmine 规范。
  • 纯逻辑 BDD 测试,无需额外断言库。
  • 教学 BDD 概念入门。

2. 局限适用场景

  • 新 Angular/React/Vue 项目(Jest/Vitest)。
  • 需要强大模块 Mock(Jest 更方便)。
  • Vite 现代工具链。
  • ESM 复杂配置场景。

六、 技术亮点

1. 零依赖断言

开箱即用,配置简单。

2. Spy API 直观

spyOn 语法清晰。

3. BDD 语义统一

describe/it 即文档。

4. Angular 历史深度集成

大量 Angular 测试资料基于 Jasmine。

5. 浏览器与 Node 双端


七、 核心概念与架构

digraph Jasmine_Architecture {
  rankdir=TB
  node [shape=box, style="rounded,filled", fillcolor="#f0f9ff"]
  Runner [label="Jasmine Runner", fillcolor="#bae6fd"]
  Suite [label="Suite / Spec"]
  Expect [label="Expect Matchers"]
  Spy [label="Spy / Clock"]
  Reporter [label="Reporter"]
 
  Runner -> Suite
  Suite -> Expect
  Suite -> Spy
  Runner -> Reporter
}

八、 技术局限与边界

  1. 生态萎缩:新项目选用少,社区活跃度低于 Jest。
  2. 模块 Mock 弱:无 Jest 级 jest.mock hoisting。
  3. Karma 依赖:浏览器测试常绑 Karma,配置繁重。
  4. TypeScript 需额外工具:jasmine-ts、esbuild 等。
  5. 快照测试:需第三方扩展。
  6. 与 Vitest 迁移:Angular 官方逐步推荐现代方案。

九、 生态地图

类别工具
运行器Karma、Node jasmine
Angular@angular/core/testing
报告jasmine-spec-reporter
替代Jest、Vitest

十、 生态集成

方向说明
Karma浏览器测试运行器 + ChromeHeadless CI。
Angular TestBed组件测试依赖 Jasmine expect。
Protractor历史 E2E(已废弃,换 Cypress/Playwright)。

十一、 开发与工程化

1. Angular 迁移评估

新项目采用 Angular 官方推荐的 Jest 或 Vitest 方案。

2. 消除测试顺序依赖

启用 random: true 在 CI 暴露问题。

3. Spy 清理

afterEach(() => {
  jasmine.clock().uninstall()
})

十二、 性能与安全

  • Karma 浏览器测试 CI 较慢,考虑 headless 优化。
  • Spy 未恢复可能导致用例间泄漏。
  • 测试数据勿含生产 secrets。

十三、 技术对比

框架优势局限适合
Jasmine内置断言、BDD生态老化Angular 遗留
JestMock 强、一体化-现代前端
Mocha+Chai灵活需拼装Node 定制
Vitest快、Vite较新Vite 栈

十四、 最佳实践

  1. 新 Angular 项目跟进官方测试栈迁移指南。
  2. beforeEach 重置 TestBed 与 spies。
  3. 避免测试实现细节,测公共行为。
  4. 使用 jasmine.objectContaining 部分匹配对象。
  5. CI 固定 Karma 浏览器版本。
  6. 逐步将纯逻辑测试迁移到 Vitest 降低 Karma 负担。

十五、 学习与社区资源