-
Notifications
You must be signed in to change notification settings - Fork 266
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(virtual-scroll): demo with tests (#1986)
- Loading branch information
Showing
24 changed files
with
741 additions
and
191 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,39 @@ | ||
import { test, expect } from '@playwright/test' | ||
|
||
test('基本用法', async ({ page }) => { | ||
page.on('pageerror', (exception) => expect(exception).toBeNull()) | ||
await page.goto('virtual-scroll#basic-usage') | ||
const virtualScroll = page.locator('#basic-usage .tiny-virtual-scroll') | ||
const virtualScrollItem = virtualScroll.locator('.tiny-virtual-scroll-item') | ||
await expect(virtualScroll).toBeVisible() | ||
await expect(virtualScrollItem.nth(0)).toBeVisible() | ||
await expect(virtualScrollItem.nth(0)).toHaveText('第1项') | ||
await page.waitForTimeout(500) | ||
const containerBox = await virtualScroll.boundingBox() | ||
let visibleCount = 0 | ||
let visibleItems = [] | ||
const visibleItemsCount = await virtualScrollItem.count() | ||
for (let i = 0; i < visibleItemsCount; i++) { | ||
const itemBox = await virtualScrollItem.nth(i).boundingBox() | ||
if (itemBox && containerBox) { | ||
if (itemBox.y >= containerBox.y && itemBox.y + itemBox.height <= containerBox.y + containerBox.height) { | ||
visibleCount++ | ||
const itemText = await virtualScrollItem.nth(i).textContent() | ||
visibleItems.push(itemText.trim()) | ||
} | ||
} | ||
} | ||
console.log('Visible items:', visibleItems) | ||
await expect(visibleCount).toBe(6) | ||
for (let i = 0; i < visibleItems.length; i++) { | ||
console.log(`Item ${i + 1}:`, visibleItems[i]) | ||
} | ||
await virtualScroll.evaluate((scroll) => scroll.scrollTo(0, 25000)) | ||
await page.waitForTimeout(500) | ||
const targetItem = virtualScroll.locator('.tiny-virtual-scroll-item', { hasText: '第500项' }) | ||
await expect(targetItem).toBeVisible() | ||
await virtualScroll.evaluate((scroll) => scroll.scrollTo(0, 50000)) | ||
await expect(virtualScrollItem.last()).toHaveText('第1000项') | ||
let errors = [] | ||
expect(errors.length).toBe(0) | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Empty file.
30 changes: 30 additions & 0 deletions
30
examples/sites/demos/pc/app/virtual-scroll/dynamic-height.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,30 @@ | ||
import { test, expect } from '@playwright/test' | ||
|
||
test('基本用法', async ({ page }) => { | ||
page.on('pageerror', (exception) => expect(exception).toBeNull()) | ||
await page.goto('virtual-scroll#dynamic-height') | ||
const virtualScroll = page.locator('#dynamic-height .tiny-virtual-scroll') | ||
const virtualScrollItem = virtualScroll.locator('.tiny-virtual-scroll-item') | ||
await expect(virtualScroll).toBeVisible() | ||
await expect(virtualScrollItem.nth(0)).toBeVisible() | ||
await virtualScroll.evaluate((scroll) => { | ||
for (let i = 0; i < 50; i++) { | ||
scroll.scrollBy(0, 200) | ||
} | ||
}) | ||
await expect(virtualScrollItem.last()).toBeVisible() | ||
const midItem = virtualScrollItem.nth(0) | ||
await expect(midItem).toBeVisible() | ||
const midItemText = await midItem.textContent() | ||
expect(midItemText).not.toBeNull() | ||
let allVisibleItems = await virtualScrollItem.all() | ||
await virtualScroll.evaluate((scroll) => scroll.scrollTo(0, scroll.scrollHeight)) | ||
const lastItem = virtualScrollItem.last() | ||
await expect(lastItem).toBeVisible() | ||
const lastItemText = await lastItem.textContent() | ||
expect(lastItemText).not.toBeNull() | ||
allVisibleItems = await virtualScrollItem.all() | ||
for (const item of allVisibleItems) { | ||
await expect(item).toBeVisible() | ||
} | ||
}) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.