64 lines
2.8 KiB
TypeScript
64 lines
2.8 KiB
TypeScript
import type { APIRequestContext, Page } from '@playwright/test'
|
|
import { expect, test } from './fixtures'
|
|
|
|
async function csrf(request: APIRequestContext) {
|
|
const state = await request.storageState()
|
|
return state.cookies.find(cookie => cookie.name === 'dodo_csrf')?.value ?? ''
|
|
}
|
|
|
|
async function createTask(request: APIRequestContext, baseURL: string, listId: string, title: string) {
|
|
const response = await request.post('/api/v1/tasks', {
|
|
data: { title, list_id: listId },
|
|
headers: { 'x-csrf-token': await csrf(request), origin: baseURL },
|
|
})
|
|
expect(response.ok(), await response.text()).toBeTruthy()
|
|
}
|
|
|
|
async function openInbox(page: Page) {
|
|
const inbox = page.locator('.sidebar').getByRole('button', { name: '收集箱', exact: true })
|
|
if (await page.evaluate(() => window.innerWidth <= 930)) {
|
|
await page.locator('main .topbar > button').first().click()
|
|
}
|
|
await inbox.click()
|
|
}
|
|
|
|
test('task pagination stays below the list and returns to the list start after navigation', async ({ page, request, baseURL }) => {
|
|
const bootstrapResponse = await request.get('/api/v1/bootstrap')
|
|
expect(bootstrapResponse.ok()).toBeTruthy()
|
|
const inbox = (await bootstrapResponse.json()).lists.find((item: { is_inbox: boolean }) => item.is_inbox)
|
|
expect(inbox).toBeTruthy()
|
|
|
|
for (let index = 1; index <= 51; index += 1) {
|
|
await createTask(request, baseURL!, inbox.id, `分页验收任务 ${String(index).padStart(2, '0')}`)
|
|
}
|
|
|
|
await page.goto('/')
|
|
await openInbox(page)
|
|
|
|
const taskList = page.locator('.task-list')
|
|
const pager = page.locator('.pager')
|
|
await expect(taskList.locator('.task-row')).toHaveCount(50)
|
|
await expect(pager).toBeVisible()
|
|
await expect(pager).toContainText('1 / 2')
|
|
|
|
const firstPageGeometry = await page.evaluate(() => {
|
|
const list = document.querySelector<HTMLElement>('.task-list')!.getBoundingClientRect()
|
|
const pagerBox = document.querySelector<HTMLElement>('.pager')!.getBoundingClientRect()
|
|
return { listBottom: list.bottom, pagerTop: pagerBox.top }
|
|
})
|
|
expect(firstPageGeometry.pagerTop).toBeGreaterThanOrEqual(firstPageGeometry.listBottom)
|
|
|
|
await pager.getByRole('button', { name: '下一页' }).click()
|
|
await expect(pager).toContainText('2 / 2')
|
|
await expect(taskList.locator('.task-row')).toHaveCount(1)
|
|
|
|
const secondPageGeometry = await page.evaluate(() => {
|
|
const list = document.querySelector<HTMLElement>('.task-list')!.getBoundingClientRect()
|
|
const pagerBox = document.querySelector<HTMLElement>('.pager')!.getBoundingClientRect()
|
|
return { listTop: list.top, listBottom: list.bottom, pagerTop: pagerBox.top, viewportHeight: innerHeight }
|
|
})
|
|
expect(secondPageGeometry.listTop).toBeGreaterThanOrEqual(-1)
|
|
expect(secondPageGeometry.listTop).toBeLessThan(secondPageGeometry.viewportHeight / 2)
|
|
expect(secondPageGeometry.pagerTop).toBeGreaterThanOrEqual(secondPageGeometry.listBottom)
|
|
})
|