03 C₁ — 组件:名词点名

如果你翻过任何一份"架构图",看到那一堆框框和箭头,你的第一反应可能是"这是工程师的活,我离远点。"

拆掉那层印象。\ 组件不是架构图,组件是一张名词表。

你列名词的能力,比你想象的要好。\ 你不需要会画 UML、不需要知道"依赖注入""聚合关系"这些词的意思。你要做的,就是把你正在测试的东西拆成"一个个它不能扔的部分"——

而已。


开篇除恐

"组件"听起来像工程师的黑话,是因为它确实从工程师那里来。但用法不复杂。

把你正在测的产品放在你面前,当成一个你自己搭出来的手工模型。\ 木块、钉子、胶水——逐个点名,说出它的名字。\ 这就是组件。

你不知道"依赖倒置"也没关系。你知道"这块离了那块还能转不转"就够了。


白话化

C₁ — Component(组件)

组件是产品的零件

  • 一个名词就是一个组件。UI、缓存层、搜索引擎、配置文件、用户头像服务——都是组件。它们不是随意排列的,彼此之间有联系。
  • 组件不是"模块"。模块更偏向工程组织;组件是说哪些东西在功能上必须各司其职
  • 每个组件都存在一个独立的测试关注点。

组件之间的关系类型

关系 日常类比 测试含义
调用 A 请 B 做一件事 测 A 时别忘了 B 那边的返回对 A 来说是什么
组合 A 包着 B,B 是 A 的一部分 拆掉 B,A 不正常——测试 A 时必须检 B
继承 B 已经会所有 A 会的,再加点自己的 测 B 时要先确认 A 的基础还在;测 A 不影响 B
事件 A 触发,B 响应 测 A 是不够的,还要看 B 收到事件时做了什么

不需要对号入座去背。肉身认识这些关系的办法:

  • 调用——我给同事发消息,他回不回是另一回事。我发了,是我的动作;收到回复,是他的响应。\
  • 组合——我把车拆了,零件扔了,这仍叫"车"吗?不。车身是组合关系。\
  • 继承——我爸妈的好厨艺传给了我,我还会做更多。子类继承了父类。

四种关系你本能都懂,你不用从教科书里重新学。

规矩

  • 组件名字要具体,不要"后台""前端"这种边界模糊的词。前者可能包了二十个服务,后者可能含了十几页。让人(和测试)看到名字就知道该打哪扇门。
  • 粒度可以分层写。"用户管理"下面可以细分"注册、登录、找回密码、个人信息编辑",这是一个字面上不想省的一件事——层次越深,测试可瞄准的区域越细。
  • 顶级组件数量控制在 5 到 15 个之间。多到记不住,就拆不彻底;少到看不出结构,就欠挖掘。

猜测 vs 确认

你自己列出来的组件,不一定是准确的。\ 没关系——ACC 地图本身就是迭代的。第一次列出来的名单是第一次猜测,随着你对产品的使用加深,你会不断修正。每一个修正都让你离真实产品更近一步。

这其实是 ACC 最良性的副作用之一:你在做计划的过程中,实际上对产品的了解会加深。


直觉先行

打开任何一个网站的"关于我们"页面,找"Our Team"或者它的中文对等词。

你会看到一排名字和头像。每个人有头衔,有职责范围。\ 销售、开发、设计、运维——每个名字就是一个组件。

公司就是产品。销售是组件,运维是组件,前台是组件(不给你开门试试)。\ 你可以一页纸道出这家公司有多少"部件"——不需要任何专门知识。

产品的组件,就是这种站在门外也能猜到的名字。


例子贴身

☼☼ 正经:RedPen 的组件点名(自编)

我们回看第一章写下的条目,拆得更细一点。RedPen 是一个虚构的开源 Markdown 编辑器,启动后界面简洁,初始分为四个区域。

以下是我们逐步点名并补充后的清单:

顶级组件(不可再拆的最小单元)

  1. 主编辑窗口(输入 caret 所在之处)
  2. 侧边栏(文件树、目录)
  3. 命令面板(快捷键触发的指令列表)
  4. 语法高亮引擎
  5. 状态栏(行号、光标位置、编码格式)
  6. 缩略预览窗格(右边,实时渲染)
  7. 插件管理器(发现、安装、卸载插件)
  8. 配置读取器(读 .redpenrc 文件,加载用户环境)
  9. PDF 导出模块
  10. 拼写检查器

这是第一版——真实产品开发中你一定会遗漏、命名不准,或者在工程变更后需要对号入座——没关系,你先有,再修正。

组件之间清晰的关系

  • 命令面板调用语法高亮引擎(输入 "ToggleHighlight" 时,该引擎被激活/解除)
  • PDF 导出模块组合了语法高亮引擎的输出(没有高亮渲染,PDF 是白纸黑字 plain)
  • 拼写检查器事件驱动于主编辑窗口(用户手一停,后台跑一次检查)
  • 配置读取器被所有组件调用——它是最初的那个读取,所有人的起点

☼☼☼ 硬骨头:RedPen 组件层的测试关注点

(自编)

从上面的关系出发,每个组件对应的测试问题至少一条:

主编辑窗口

  • 输入中文字符、emoji、特殊符号,光标位置是否正常?
  • 粘贴一大段 Markdown 表格,窗口有没有订阅不匹配的换行错误?

命令面板

  • 快捷键 Ctrl+Shift+P 在不同系统(Win / Mac / Linux)上的差异?
  • 空搜索 + 下拉页面 + 手动目录到达底部,向下滚动是否平滑?

语法高亮引擎

  • 自定义语言 XML 文件加载失败,会不会白屏?
  • 嵌套代码块里的语法高亮,边界处会不会交叉污染(比如把代码注释里的 # 也当标题标记)?

PDF 导出模块

  • 文件包含本地图片,路径相对,导出时能否跟着另存?
  • 图片 URL 是 http 而非本地路径,离线状态下导出会报错还是自动跳过?

拼写检查器

  • 英文拼写错误是否正确识别?富文本区域的拼音呢?
  • 用户库自定义词条加载,重启后仍保留?

每一个问题对应一片测试疆域。

你不需要现在就读完"怎么测"——这属于后面的 C₂。这一阶段的产出是:你有了一张名词表,知道该问哪些问题了。


这一章要带走的东西

  • 组件 = 产品的零件,用名词列出
  • 组件之间有四种关系:调用、组合、继承、事件。你的本能懂这些关系
  • 第一次的名单不必完美 —— ACC 地图是迭代品
  • 每个组件天然对应一片测试关注区,问题会自己冒出来

就这样。