Skip to content

Commit 0be23c8

Browse files
committed
fix: update 单测
1 parent 216df5e commit 0be23c8

File tree

1 file changed

+132
-0
lines changed

1 file changed

+132
-0
lines changed

src/packages/elevator/__tests__/elevator.spec.tsx

Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -175,3 +175,135 @@ test('should render empty when list is empty', () => {
175175
const { container } = render(<Elevator list={[]} />)
176176
expect(container.querySelectorAll('.nut-elevator-list-item').length).toBe(0)
177177
})
178+
179+
// 测试非标准属性的渲染
180+
test('should render with custom floor key', () => {
181+
const customList = [
182+
{
183+
customTitle: 'A',
184+
list: [
185+
{
186+
name: '安徽',
187+
id: 1,
188+
},
189+
],
190+
},
191+
{
192+
customTitle: 'B',
193+
list: [
194+
{
195+
name: '北京',
196+
id: 2,
197+
},
198+
],
199+
},
200+
]
201+
202+
const { container } = render(
203+
<Elevator list={customList} floorKey="customTitle" />
204+
)
205+
const barItems = container.querySelectorAll('.nut-elevator-bars-inner-item')
206+
207+
expect(barItems[0].textContent).toBe('A')
208+
expect(barItems[1].textContent).toBe('B')
209+
})
210+
211+
// 测试非字符串值的正确渲染
212+
test('should render non-string values properly', () => {
213+
const numericKeyList = [
214+
{
215+
index: 1,
216+
list: [
217+
{
218+
name: '项目1',
219+
id: 1,
220+
},
221+
],
222+
},
223+
{
224+
index: 2,
225+
list: [
226+
{
227+
name: '项目2',
228+
id: 2,
229+
},
230+
],
231+
},
232+
]
233+
234+
const { container } = render(
235+
<Elevator list={numericKeyList} floorKey="index" />
236+
)
237+
const barItems = container.querySelectorAll('.nut-elevator-bars-inner-item')
238+
239+
expect(barItems[0].textContent).toBe('1')
240+
expect(barItems[1].textContent).toBe('2')
241+
})
242+
243+
// 测试列表项点击后索引值的正确传递
244+
test('should pass correct index value when clicking bars item', () => {
245+
const testClick = vi.fn()
246+
const { container } = render(
247+
<Elevator list={list} onIndexClick={(key: string) => testClick(key)} />
248+
)
249+
250+
// 点击第二个索引
251+
const indexItem = container.querySelectorAll(
252+
'.nut-elevator-bars-inner-item'
253+
)[1]
254+
fireEvent.click(indexItem)
255+
256+
expect(testClick).toHaveBeenCalledWith('B')
257+
})
258+
259+
// 测试列表滚动时高亮显示的正确性
260+
test('should highlight the correct index when scrolling', async () => {
261+
const { container } = render(<Elevator list={list} height={200} />)
262+
263+
// 模拟滚动
264+
const listView = container.querySelector('.nut-elevator-list-inner')
265+
266+
await act(() => {
267+
// 手动触发点击索引,应该会导致滚动和高亮
268+
const indexItem = container.querySelectorAll(
269+
'.nut-elevator-bars-inner-item'
270+
)[2]
271+
fireEvent.click(indexItem)
272+
})
273+
274+
// 检查是否正确高亮了第三个索引
275+
waitFor(() => {
276+
const activeIndex = container.querySelector(
277+
'.nut-elevator-bars-inner-item-active'
278+
)
279+
expect(activeIndex?.textContent).toBe('G')
280+
})
281+
})
282+
283+
// 测试当存在垂直模式和sticky时,固定头部是否正确显示
284+
test('should show fixed title in vertical mode with sticky', async () => {
285+
const { container } = render(
286+
<Elevator list={list} mode="vertical" sticky height={200} />
287+
)
288+
289+
// 首先触发点击以模拟滚动
290+
await act(() => {
291+
const indexItem = container.querySelectorAll(
292+
'.nut-elevator-bars-inner-item'
293+
)[1]
294+
fireEvent.click(indexItem)
295+
296+
// 模拟滚动事件
297+
const listView = container.querySelector('.nut-elevator-list-inner')
298+
if (listView) {
299+
Object.defineProperty(listView, 'scrollTop', { value: 50 })
300+
fireEvent.scroll(listView)
301+
}
302+
})
303+
304+
// 等待滚动效果完成后检查固定标题
305+
waitFor(() => {
306+
const fixedTitle = container.querySelector('.nut-elevator-list-fixed-title')
307+
expect(fixedTitle).not.toBeNull()
308+
})
309+
})

0 commit comments

Comments
 (0)