---
title: 测试文档
order: 4
category: pro
---

# PisellTimeRangeDisplay 组件测试用例文档

## 测试概览

本文档列出 PisellTimeRangeDisplay 组件的所有测试用例点，包括同一天/跨天展示、字段显隐与排序、持续时长格式、布局与样式等。

**测试范围**：

- 基础渲染与数据解析（startAt/endAt）
- 同一天 vs 跨天展示
- 布局（按块换行，无 layout）
- 字段显隐与 fieldOrder（time/date/weekday/duration）
- showDateForSameDay
- 时间/日期/星期/持续时长格式
- 样式与事件

---

## 一、基础渲染测试

### 1.1 同一天展示

| 测试项     | 测试步骤                             | 预期结果                  | 测试类型 |
|---------|----------------------------------|-----------------------|------|
| 默认同一天   | startAt/endAt 同一天（如 09:00-18:00） | 显示 HH:mm-HH:mm + 持续时长 | 自动化  |
| 时间区间格式  | 同一天，默认 timeFormat                | 如 9:00-18:00          | 自动化  |
| 持续时长    | 同一天 9h                           | 显示 9h                 | 自动化  |
| 不显示日期星期 | 同一天，showDateForSameDay=false     | 不显示日期、星期块             | 自动化  |

### 1.2 跨天展示

| 测试项    | 测试步骤                | 预期结果      | 测试类型 |
|--------|---------------------|-----------|------|
| 跨天时间区间 | startAt 昨日，endAt 今日 | 显示起止日期+时间 | 自动化  |
| 跨年     | startAt 去年，endAt 今年 | 显示跨年起止    | 人工   |

### 1.3 数据输入

| 测试项      | 测试步骤                                                 | 预期结果    | 测试类型 |
|----------|------------------------------------------------------|---------|------|
| 字符串      | startAt="2026-02-04 09:00", endAt="2026-02-04 18:00" | 正常解析并展示 | 自动化  |
| 时间戳      | startAt/endAt 为 number                               | 正常解析并展示 | 自动化  |
| dayjs 对象 | startAt/endAt 为 dayjs()                              | 正常解析并展示 | 自动化  |

---

## 二、布局配置测试

### 2.1 布局方向

| 测试项  | 测试步骤                        | 预期结果             | 测试类型 |
|------|-----------------------------|------------------|------|
| 按块换行 | 默认                          | 一行放不下时按块换行，块内不换行 | 自动化  |
| 对齐方式 | textAlign left/center/right | 对应对齐             | 人工   |

---

## 三、字段配置测试

### 3.1 字段显隐

| 测试项    | 测试步骤                          | 预期结果                         | 测试类型 |
|--------|-------------------------------|------------------------------|------|
| 显示时间区间 | fields.showTimeRange=true（默认） | 显示时间区间块                      | 自动化  |
| 显示日期   | fields.showDate=true（默认）      | 跨天或 showDateForSameDay 时显示日期 | 自动化  |
| 显示星期   | fields.showWeekday=true（默认）   | 跨天或 showDateForSameDay 时显示星期 | 自动化  |
| 显示持续时长 | fields.showDuration=true（默认）  | 显示 d h m s                   | 自动化  |
| 隐藏时间区间 | fields.showTimeRange=false    | 不显示时间区间                      | 自动化  |
| 隐藏持续时长 | fields.showDuration=false     | 不显示持续时长                      | 自动化  |
| 全部隐藏   | 四个 show 均为 false              | 组件返回 null，不渲染                | 自动化  |

### 3.2 字段顺序（fieldOrder）

| 测试项     | 测试步骤                                            | 预期结果                  | 测试类型 |
|---------|-------------------------------------------------|-----------------------|------|
| 默认顺序    | fieldOrder=['time','duration','date','weekday'] | 时间区间 → 持续时长 → 日期 → 星期 | 自动化  |
| 持续时间在中间 | 默认即 duration 在 time 与 date 之间                   | 视觉顺序正确                | 人工   |
| 自定义顺序   | fieldOrder=['duration','time','date','weekday'] | 持续时长在最前               | 自动化  |

### 3.3 同一天显示日期

| 测试项      | 测试步骤                            | 预期结果     | 测试类型 |
|----------|---------------------------------|----------|------|
| 不显示日期    | 同一天，showDateForSameDay=false    | 不显示日期、星期 | 自动化  |
| 显示日期（默认） | 同一天，showDateForSameDay=true（默认） | 显示日期、星期  | 自动化  |

---

## 四、时间格式测试

| 测试项        | 测试步骤                        | 预期结果              | 测试类型 |
|------------|-----------------------------|-------------------|------|
| 24 小时制（默认） | 不设置 timeFormat.use12Hour    | 如 9:00-18:00      | 自动化  |
| 12 小时制     | timeFormat.use12Hour=true   | 如 9:00 AM-6:00 PM | 人工   |
| 显示秒        | timeFormat.showSeconds=true | 时间带秒              | 人工   |
| 小时补零       | timeFormat.padHour=true     | 如 09:00           | 人工   |

---

## 五、日期与星期格式测试

| 测试项  | 测试步骤                              | 预期结果    | 测试类型 |
|------|-----------------------------------|---------|------|
| 日期顺序 | dateFormat.order YMD/MDY/DMY      | 对应顺序    | 人工   |
| 显示年份 | dateFormat.showYear=true          | 日期含年    | 人工   |
| 星期格式 | weekdayFormat.full / singleLetter | 完整/单字母  | 人工   |
| 中文环境 | locale="zh-cn" + showChineseUnit  | 如 3月21日 | 人工   |

---

## 六、持续时长格式测试

| 测试项      | 测试步骤                             | 预期结果                      | 测试类型 |
|----------|----------------------------------|---------------------------|------|
| 不显示秒（默认） | durationFormat.showSeconds=false | 如 9h、2h30m                | 自动化  |
| 显示秒      | durationFormat.showSeconds=true  | 如 2h30m23s                | 自动化  |
| 不足 1 分钟  | 时长 < 1 分钟                        | 如 0m 或 45s（依 showSeconds） | 人工   |
| 跨天时长     | 时长 > 24h                         | 如 1d2h30m                 | 自动化  |

---

## 七、样式与事件测试

### 7.1 样式

| 测试项          | 测试步骤                              | 预期结果 | 测试类型 |
|--------------|-----------------------------------|------|------|
| 容器样式         | containerStyle 背景、圆角、padding      | 生效   | 人工   |
| 时间/日期/持续时长样式 | timeStyle、dateStyle、durationStyle | 生效   | 人工   |
| className    | className="custom"                | 类名应用 | 自动化  |

### 7.2 事件

| 测试项  | 测试步骤       | 预期结果     | 测试类型 |
|------|------------|----------|------|
| 点击回调 | onClick 传入 | 点击组件触发回调 | 自动化  |

---

## 八、国际化测试

| 测试项 | 测试步骤           | 预期结果     | 测试类型 |
|-----|----------------|----------|------|
| 中文  | locale="zh-cn" | 日期/星期为中文 | 人工   |
| 英文  | locale="en"    | 日期/星期为英文 | 人工   |

---

## 九、边界与兼容性

| 测试项     | 测试步骤                | 预期结果               | 测试类型 |
|---------|---------------------|--------------------|------|
| 无任何字段显示 | 四个 show 均为 false    | 返回 null            | 自动化  |
| 同一天判定   | 同一天 23:50 到次日 00:10 | 按自然日判定为跨天          | 人工   |
| 自适应换行   | 容器宽度变小              | flex-wrap 换行，无固定断点 | 人工   |

---

## Bug 汇总

### 待修复的 Bug

| Bug ID | 描述 | 优先级 | 状态 | 发现时间 | 发现人 |
|--------|----|-----|----|------|-----|
| -      | -  | -   | -  | -    | -   |

### 已修复的 Bug

| Bug ID | 描述 | 优先级 | 修复时间 | 修复方案 | 修复人 |
|--------|----|-----|------|------|-----|
| -      | -  | -   | -    | -    | -   |
