刘光辉
7 小时以前 cf11e63b659afcc9792ab3e395f1b45d844431a8
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
import type { OperationState, RuntimeStatus } from '../../src/stores/annotation';
 
import { mount } from '@vue/test-utils';
 
import Antd, { Alert, Badge, Result, Spin } from 'ant-design-vue';
import { describe, expect, it } from 'vitest';
 
import OperationStatus from '../../src/components/OperationStatus.vue';
 
function mountStatus(status: RuntimeStatus, operation: OperationState, extra: { fatalMessage?: string; retryable?: boolean; sdkAvailable?: boolean } = {}) {
  return mount(OperationStatus, { props: { status, operation, ...extra }, global: { plugins: [Antd] } });
}
 
describe('operationStatus', () => {
  it('initializing 只显示紧凑状态,不再占用第二行显示 Spin', () => {
    const wrapper = mountStatus('initializing', { kind: 'idle', message: '' });
 
    expect(wrapper.findComponent(Spin).exists()).toBe(false);
    expect(wrapper.find('[data-test="runtime-message"]').exists()).toBe(false);
    expect(wrapper.get('[data-test="connection-status"]').text()).toBe('加载中');
  });
 
  it('working 顶部只显示紧凑连接状态,进度留给当前任务区', () => {
    const wrapper = mountStatus('working', { kind: 'working', message: '正在定位字段...' });
 
    expect(wrapper.findComponent(Spin).exists()).toBe(false);
    expect(wrapper.find('[data-test="runtime-message"]').exists()).toBe(false);
    expect(wrapper.get('[data-test="connection-status"]').text()).toBe('处理中');
  });
 
  it('ready 使用状态圆点和文字显示已连接,idle 不渲染操作提示', () => {
    const wrapper = mountStatus('ready', { kind: 'idle', message: '' });
 
    expect(wrapper.findComponent(Badge).props('status')).toBe('success');
    expect(wrapper.findComponent(Badge).props('text')).toBe('已连接');
    expect(wrapper.get('[data-test="connection-status"]').text()).toBe('已连接');
    expect(wrapper.get('[data-test="plugin-version"]').text()).toBe('v0.1.0');
    expect(wrapper.find('[data-test="operation-message"]').exists()).toBe(false);
  });
 
  it('不持续显示自动刷新成功文案', () => {
    const wrapper = mountStatus('ready', { kind: 'success', message: '文档字段已刷新' });
 
    expect(wrapper.find('[data-test="operation-message"]').exists()).toBe(false);
  });
 
  it('成功反馈不常驻顶部布局', () => {
    const wrapper = mountStatus('ready', { kind: 'success', message: '字段已定位' });
 
    expect(wrapper.find('[data-test="operation-message"]').exists()).toBe(false);
  });
 
  it('ready 状态的任务错误不占用顶部布局', () => {
    const wrapper = mountStatus('ready', { kind: 'error', message: '读取内容控件失败' });
 
    expect(wrapper.findComponent(Alert).exists()).toBe(false);
    expect(wrapper.text()).not.toContain('读取内容控件失败');
  });
 
  it('初始化失败在顶部显示完整错误并可重试', async () => {
    const wrapper = mountStatus('error', { kind: 'error', message: '读取模板标注失败:网络异常' }, { retryable: true });
 
    expect(wrapper.findComponent(Result).exists() || wrapper.findComponent(Alert).exists()).toBe(true);
    expect(wrapper.text()).toContain('读取模板标注失败:网络异常');
    await wrapper.get('[data-test="retry-initialization"]').trigger('click');
    expect(wrapper.emitted('retry')).toHaveLength(1);
  });
 
  it('sDK 缺失显示不可继续的 fatal 结果', () => {
    const wrapper = mountStatus('error', { kind: 'idle', message: '' }, { sdkAvailable: false });
 
    expect(wrapper.findComponent(Result).exists() || wrapper.findComponent(Alert).exists()).toBe(true);
    expect(wrapper.text()).toContain('ONLYOFFICE SDK 未加载,无法初始化插件');
  });
});