如何为Angular中带条件判断的switch(true)逻辑编写测试用例

针对该方法中switch(true)形式的多分支判断、结合d3 DOM操作的业务逻辑，按照全分支覆盖的测试要求，可按照以下思路落地测试用例：

测试前置准备 #

• 给被测组件实例提前注入固定的常量测试值，统一设置KilobyteConst = 1024、MegabyteConst = 1048576，避免动态常量值导致测试结果抖动
• 搭建测试DOM环境：按层级构造g.axis-y > g.tick > text的虚拟DOM结构，为每个text节点绑定对应的d3数据值，确保方法内调用selectAll时能正确选中节点、触发each循环的执行
• Mock d3全局依赖：拦截selectAll、select、format方法，以及链式调用的style、html方法，方便后续断言方法入参、校验逻辑执行正确性

全分支覆盖用例设计 #

分支1：命中default逻辑（d ≤ KilobyteConst） #

• 触发条件：给节点绑定的d值设置三类边界值，包括0、512、1024（刚好等于KilobyteConst）
• 校验要点：
  • 换算逻辑为直接取原始d值，不做除以常量的计算
  • 最终写入text节点的HTML内容结构符合要求：带千分位整数格式化的数值 + 带两位小数格式化的数值包裹在<title>标签内
  • 三个内置样式配置（12px字体、#525252文字色、pointer光标）都被正确应用到对应text节点上

分支2：命中第一个case逻辑（KilobyteConst < d < MegabyteConst） #

• 触发条件：绑定的d值设置为1025、524288、1048575（即刚超过KilobyteConst的临界值、区间中间值、刚到MegabyteConst的临界前值）
• 校验要点：
  • 换算逻辑为d / KilobyteConst，计算结果符合预期
  • 生成的HTML文本为换算后数值的格式化结果，title标签内保留两位小数的换算值
  • 样式配置的调用和应用无异常

分支3：命中第二个case逻辑（d > MegabyteConst） #

• 触发条件：绑定的d值设置为1048577、2097152、5242880（即刚超过MegabyteConst的临界值、2MB值、5MB值）
• 校验要点：
  • 换算逻辑为d / MegabyteConst，计算结果符合预期
  • 生成的文本结构和其他分支保持一致，整数带千分位格式化、title内保留两位小数精度
  • 样式配置无遗漏

易漏测的边界校验 #

• 单独验证临界值的分支跳转逻辑：d刚好等于KilobyteConst时，因为case判断是严格大于，会走default分支，不会误触发KB换算；d刚好等于MegabyteConst时，因为第一个case的判断是严格小于上限，会走KB换算分支，不会直接触发MB换算
• 验证d3.format的调用次数：每个被遍历的text节点，都会触发两次格式化调用，分别对应整数显示格式、title内的两位小数格式

内容的提问来源于stack exchange，提问作者Mohan Nalgire