File size: 4,949 Bytes
8059bf0
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
/**
 * useNavigationLoading 组合式函数单元测试
 */
import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
import {
  useNavigationLoading,
  _resetNavigationLoadingInstance
} from '../useNavigationLoading'

describe('useNavigationLoading', () => {
  beforeEach(() => {
    vi.useFakeTimers()
    _resetNavigationLoadingInstance()
  })

  afterEach(() => {
    vi.useRealTimers()
  })

  describe('startNavigation', () => {
    it('导航开始时 isNavigating 应变为 true', () => {
      const { isNavigating, startNavigation } = useNavigationLoading()

      expect(isNavigating.value).toBe(false)

      startNavigation()

      expect(isNavigating.value).toBe(true)
    })

    it('导航开始后延迟显示加载指示器(防闪烁)', () => {
      const { isLoading, startNavigation, ANTI_FLICKER_DELAY } = useNavigationLoading()

      startNavigation()

      // 立即检查,不应该显示
      expect(isLoading.value).toBe(false)

      // 经过防闪烁延迟后应该显示
      vi.advanceTimersByTime(ANTI_FLICKER_DELAY)
      expect(isLoading.value).toBe(true)
    })
  })

  describe('endNavigation', () => {
    it('导航结束时 isLoading 应变为 false', () => {
      const { isLoading, startNavigation, endNavigation, ANTI_FLICKER_DELAY } = useNavigationLoading()

      startNavigation()
      vi.advanceTimersByTime(ANTI_FLICKER_DELAY)
      expect(isLoading.value).toBe(true)

      endNavigation()
      expect(isLoading.value).toBe(false)
    })

    it('导航结束时 isNavigating 应变为 false', () => {
      const { isNavigating, startNavigation, endNavigation } = useNavigationLoading()

      startNavigation()
      expect(isNavigating.value).toBe(true)

      endNavigation()
      expect(isNavigating.value).toBe(false)
    })
  })

  describe('快速导航(< 100ms)防闪烁', () => {
    it('快速导航不应触发显示加载指示器', () => {
      const { isLoading, startNavigation, endNavigation, ANTI_FLICKER_DELAY } = useNavigationLoading()

      startNavigation()

      // 在防闪烁延迟之前结束导航
      vi.advanceTimersByTime(ANTI_FLICKER_DELAY - 50)
      endNavigation()

      // 不应该显示加载指示器
      expect(isLoading.value).toBe(false)

      // 即使继续等待也不应该显示
      vi.advanceTimersByTime(100)
      expect(isLoading.value).toBe(false)
    })
  })

  describe('cancelNavigation', () => {
    it('导航取消时应正确重置状态', () => {
      const { isLoading, startNavigation, cancelNavigation, ANTI_FLICKER_DELAY } = useNavigationLoading()

      startNavigation()
      vi.advanceTimersByTime(ANTI_FLICKER_DELAY / 2)

      cancelNavigation()

      // 取消后不应该触发显示
      vi.advanceTimersByTime(ANTI_FLICKER_DELAY)
      expect(isLoading.value).toBe(false)
    })
  })

  describe('getNavigationDuration', () => {
    it('应该返回正确的导航持续时间', () => {
      const { startNavigation, getNavigationDuration } = useNavigationLoading()

      expect(getNavigationDuration()).toBeNull()

      startNavigation()
      vi.advanceTimersByTime(500)

      const duration = getNavigationDuration()
      expect(duration).toBe(500)
    })

    it('导航结束后应返回 null', () => {
      const { startNavigation, endNavigation, getNavigationDuration } = useNavigationLoading()

      startNavigation()
      vi.advanceTimersByTime(500)
      endNavigation()

      expect(getNavigationDuration()).toBeNull()
    })
  })

  describe('resetState', () => {
    it('应该重置所有状态', () => {
      const { isLoading, isNavigating, startNavigation, resetState, ANTI_FLICKER_DELAY } = useNavigationLoading()

      startNavigation()
      vi.advanceTimersByTime(ANTI_FLICKER_DELAY)

      expect(isLoading.value).toBe(true)
      expect(isNavigating.value).toBe(true)

      resetState()

      expect(isLoading.value).toBe(false)
      expect(isNavigating.value).toBe(false)
    })
  })

  describe('连续导航场景', () => {
    it('连续快速导航应正确处理状态', () => {
      const { isLoading, startNavigation, cancelNavigation, endNavigation, ANTI_FLICKER_DELAY } = useNavigationLoading()

      // 第一次导航
      startNavigation()
      vi.advanceTimersByTime(30)

      // 第二次导航(取消第一次)
      cancelNavigation()
      startNavigation()
      vi.advanceTimersByTime(30)

      // 第三次导航(取消第二次)
      cancelNavigation()
      startNavigation()

      // 这次等待足够长时间
      vi.advanceTimersByTime(ANTI_FLICKER_DELAY)
      expect(isLoading.value).toBe(true)

      // 结束导航
      endNavigation()
      expect(isLoading.value).toBe(false)
    })
  })

  describe('ANTI_FLICKER_DELAY 常量', () => {
    it('应该为 100ms', () => {
      const { ANTI_FLICKER_DELAY } = useNavigationLoading()
      expect(ANTI_FLICKER_DELAY).toBe(100)
    })
  })
})