forked from opentiny/tiny-vue
test(date-picker): [date-picker] optimize date-picker e2e test (#1076)
This commit is contained in:
GitHub
parent
9938413315
commit
d52e03f6cb
|
|
@ -6,6 +6,9 @@ concurrency:
|
|||
group: ${{ github.workflow }}-${{ github.sha }}
|
||||
cancel-in-progress: true
|
||||
|
||||
env:
|
||||
TZ: Asia/Shanghai
|
||||
|
||||
jobs:
|
||||
dispatch-test-all:
|
||||
name: Dispatch All Test
|
||||
|
|
|
|||
|
|
@ -12,6 +12,10 @@ on:
|
|||
concurrency:
|
||||
group: ${{ github.workflow }}-${{ github.sha }}
|
||||
cancel-in-progress: true
|
||||
|
||||
env:
|
||||
TZ: Asia/Shanghai
|
||||
|
||||
jobs:
|
||||
dispatch-tests:
|
||||
name: Dispatch Tests
|
||||
|
|
|
|||
|
|
@ -8,6 +8,9 @@ concurrency:
|
|||
group: ${{ github.workflow }}-${{ github.event.number || github.sha }}
|
||||
cancel-in-progress: true
|
||||
|
||||
env:
|
||||
TZ: Asia/Shanghai
|
||||
|
||||
jobs:
|
||||
parse-components:
|
||||
name: Parse Affected Components
|
||||
|
|
|
|||
|
|
@ -6,29 +6,28 @@ test('[DatePicker] 测试对齐方式', async ({ page }) => {
|
|||
|
||||
// 左对齐
|
||||
const leftDateInputDom = page.getByRole('textbox').nth(1)
|
||||
const leftDatePanelDom = page.locator('body > div:nth-child(3)')
|
||||
console.log('leftDatePanelDom', leftDatePanelDom)
|
||||
const leftDatePanelDom = page.locator('body > div:nth-child(8)')
|
||||
|
||||
const { x: leftDateInputX } = await leftDateInputDom.boundingBox()
|
||||
await leftDateInputDom.click()
|
||||
const { x: leftDatePanelX } = await leftDatePanelDom.boundingBox()
|
||||
expect(leftDateInputX - leftDatePanelX).toBeCloseTo(0)
|
||||
|
||||
// 右对齐
|
||||
const rightDateInputDom = page.getByRole('textbox').nth(2)
|
||||
const rightDatePanelDom = page.locator('body > div:nth-child(4)')
|
||||
const { x: rightDateInputX, width: rightDateInputWidth } = await rightDateInputDom.boundingBox()
|
||||
await rightDateInputDom.click()
|
||||
const { x: rightDatePanelX, width: rightDatePanelWidth } = await rightDatePanelDom.boundingBox()
|
||||
expect(rightDateInputX + rightDateInputWidth - rightDatePanelX - rightDatePanelWidth).toBeCloseTo(0)
|
||||
|
||||
// 居中对齐
|
||||
const centerDateInputDom = page.getByRole('textbox').nth(3)
|
||||
const centerDatePanelDom = page.locator('body > div:nth-child(5)')
|
||||
const centerDateInputDom = page.getByRole('textbox').nth(2)
|
||||
const centerDatePanelDom = page.locator('body > div:nth-child(9)')
|
||||
const { x: centerDateInputX, width: centerDateInputWidth } = await centerDateInputDom.boundingBox()
|
||||
await centerDateInputDom.click()
|
||||
const { x: centerDatePanelX, width: centerDatePanelWidth } = await centerDatePanelDom.boundingBox()
|
||||
expect(
|
||||
centerDateInputX + Math.round(centerDateInputWidth / 2) - centerDatePanelX - Math.round(centerDatePanelWidth / 2)
|
||||
).toBeCloseTo(0)
|
||||
|
||||
// 右对齐
|
||||
const rightDateInputDom = page.getByRole('textbox').nth(3)
|
||||
const rightDatePanelDom = page.locator('body > div:nth-child(10)')
|
||||
const { x: rightDateInputX, width: rightDateInputWidth } = await rightDateInputDom.boundingBox()
|
||||
await rightDateInputDom.click()
|
||||
const { x: rightDatePanelX, width: rightDatePanelWidth } = await rightDatePanelDom.boundingBox()
|
||||
expect(rightDateInputX + rightDateInputWidth - rightDatePanelX - rightDatePanelWidth).toBeCloseTo(0)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -3,75 +3,69 @@ import { test, expect } from '@playwright/test'
|
|||
test('[DatePicker] 测试日期选择和清除', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#basic-usage')
|
||||
|
||||
const dateInput = page.getByRole('textbox', { name: '2023-05-20' })
|
||||
const dateInput2 = page.getByRole('textbox', { name: '2023-05-21' })
|
||||
const clearIcon = page.locator('#preview').getByRole('img').nth(1)
|
||||
|
||||
await page.locator('#preview').getByRole('textbox').fill('2023-05-20')
|
||||
await page.locator('#preview').getByRole('textbox').press('Enter')
|
||||
await page.getByPlaceholder('请选择日期').nth(1).fill('2023-05-20')
|
||||
await page.getByPlaceholder('请选择日期').nth(1).press('Enter')
|
||||
await expect(dateInput).toBeVisible()
|
||||
|
||||
// 测试日期选择
|
||||
await dateInput.click()
|
||||
await page.getByText('21', { exact: true }).click()
|
||||
await page.getByRole('cell', { name: '21' }).getByText('21').click()
|
||||
await expect(dateInput2).toBeVisible()
|
||||
|
||||
// 测试日期清除
|
||||
await dateInput2.hover()
|
||||
await expect(clearIcon).toBeVisible()
|
||||
await clearIcon.click()
|
||||
await expect(dateInput2).not.toBeVisible()
|
||||
})
|
||||
|
||||
test('[DatePicker] 测试上一月/下一月/前一年/后一年', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#basic-usage')
|
||||
|
||||
const dateInputNextMonth = page.getByRole('textbox', { name: '2023-06-04' })
|
||||
const dateInputNextYear = page.getByRole('textbox', { name: '2024-06-01' })
|
||||
const dateInputNextYear = page.getByRole('textbox', { name: '2024-06-10' })
|
||||
const dateInputPreMonth = page.getByRole('textbox', { name: '2023-05-14' })
|
||||
const dateInputPreYear = page.getByRole('textbox', { name: '2023-06-11' })
|
||||
|
||||
// 先输入一个日期，确保后续选中的月份、年份正确
|
||||
await page.locator('#preview').getByRole('textbox').click()
|
||||
await page.locator('#preview').getByRole('textbox').fill('2023-05-20')
|
||||
await page.locator('#preview').getByRole('textbox').press('Enter')
|
||||
await page.getByPlaceholder('请选择日期').nth(1).fill('2023-05-20')
|
||||
await page.getByPlaceholder('请选择日期').nth(1).press('Enter')
|
||||
|
||||
// 下一月/后一年
|
||||
await page.locator('#preview').getByRole('textbox').click()
|
||||
await page.getByRole('textbox', { name: '2023-05-20' }).click()
|
||||
await page.getByRole('button', { name: '下个月' }).click()
|
||||
await page.getByRole('row', { name: '4 5 6 7 8 9 10' }).getByText('4').click()
|
||||
await expect(dateInputNextMonth).toBeVisible()
|
||||
|
||||
await dateInputNextMonth.click()
|
||||
await page.getByRole('button', { name: '后一年' }).click()
|
||||
await page.getByRole('row', { name: '26 27 28 29 30 31 1' }).getByText('1', { exact: true }).click()
|
||||
await page.getByRole('cell', { name: '10' }).getByText('10').click()
|
||||
await expect(dateInputNextYear).toBeVisible()
|
||||
|
||||
// 前一年/上一月
|
||||
await dateInputNextYear.click()
|
||||
await page.getByRole('button', { name: '前一年' }).click()
|
||||
await page.getByText('11', { exact: true }).click()
|
||||
await page.getByRole('cell', { name: '11' }).getByText('11').click()
|
||||
await expect(dateInputPreYear).toBeVisible()
|
||||
|
||||
await dateInputPreYear.click()
|
||||
await page.getByRole('button', { name: '上个月' }).click()
|
||||
await page.getByText('14').click()
|
||||
await page.getByRole('cell', { name: '14' }).getByText('14').click()
|
||||
await expect(dateInputPreMonth).toBeVisible()
|
||||
})
|
||||
|
||||
test('[DatePicker] 测试月份/年份选择', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#basic-usage')
|
||||
|
||||
const dateInputMonth = page.getByRole('textbox', { name: '2023-06-04' })
|
||||
const dateInputYear = page.getByRole('textbox', { name: '2024-02-07' })
|
||||
|
||||
// 先输入一个日期，确保后续选中的月份、年份正确
|
||||
await page.locator('#preview').getByRole('textbox').click()
|
||||
await page.locator('#preview').getByRole('textbox').fill('2023-04-20')
|
||||
await page.locator('#preview').getByRole('textbox').press('Enter')
|
||||
await page.getByPlaceholder('请选择日期').nth(1).fill('2023-04-20')
|
||||
await page.getByPlaceholder('请选择日期').nth(1).press('Enter')
|
||||
|
||||
// 选择月份
|
||||
await page.locator('#preview').getByRole('textbox').click()
|
||||
await page.getByRole('textbox', { name: '2023-04-20' }).click()
|
||||
await page.getByRole('button', { name: '4 月' }).click()
|
||||
await page.getByText('六月').click()
|
||||
await page.getByRole('row', { name: '4 5 6 7 8 9 10' }).getByText('4').click()
|
||||
|
|
@ -80,7 +74,7 @@ test('[DatePicker] 测试月份/年份选择', async ({ page }) => {
|
|||
// 选择年份
|
||||
await dateInputMonth.click()
|
||||
await page.getByRole('button', { name: '2023 年' }).click()
|
||||
await page.getByText('2024').click()
|
||||
await page.getByRole('cell', { name: '2024' }).getByText('2024').click()
|
||||
await page.getByText('二月', { exact: true }).click()
|
||||
await page.getByRole('row', { name: '4 5 6 7 8 9 10' }).getByText('7').click()
|
||||
await expect(dateInputYear).toBeVisible()
|
||||
|
|
|
|||
|
|
@ -3,9 +3,28 @@ import { test, expect } from '@playwright/test'
|
|||
test('[DatePicker] 测试清除输入', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#clear')
|
||||
const dateInputHasText = page.getByRole('textbox', { name: '2023-05-24' })
|
||||
await expect(dateInputHasText).toBeVisible()
|
||||
await dateInputHasText.hover()
|
||||
await page.locator('div:nth-child(2) > .tiny-date-editor .tiny-input__icon-container > svg').first().click()
|
||||
await expect(dateInputHasText).not.toBeVisible()
|
||||
|
||||
const datePickerDefaultClearIcon = page.getByRole('textbox', { name: '2023-05-24' }).first()
|
||||
const datePickerHideClearIcon = page.getByRole('textbox', { name: '2023-05-24' }).nth(1)
|
||||
const datePickerCustomClearIcon = page.getByRole('textbox', { name: '2023-05-24' }).nth(2)
|
||||
const clearIcon = page.locator('.tiny-date-editor .tiny-input__icon-container .baseClearicon')
|
||||
|
||||
// 默认显示清除按钮
|
||||
await datePickerDefaultClearIcon.hover()
|
||||
await expect(clearIcon).toBeVisible()
|
||||
await expect(clearIcon.locator('path')).toHaveAttribute('d', 'M12 24C5.4 24 0 18.6 0 12S5.4 0 12 0s12 5.4 12 12-5.4 12-12 12zm4.8-8.4L13.2 12l3.6-3.6c.3-.3.3-.9 0-1.2-.3-.3-.9-.3-1.2 0L12 10.8 8.4 7.2c-.3-.3-.9-.3-1.2 0s-.3.9 0 1.2l3.6 3.6-3.6 3.6c-.3.3-.3.9 0 1.2.2.1.4.2.6.2s.4-.1.6-.2l3.6-3.6 3.6 3.6c.2.2.4.2.6.2.2 0 .4-.1.6-.2.3-.4.3-.9 0-1.2z')
|
||||
|
||||
// 隐藏清除按钮
|
||||
await datePickerHideClearIcon.hover()
|
||||
await expect(clearIcon).not.toBeVisible()
|
||||
|
||||
// 自定义清除图标
|
||||
await datePickerCustomClearIcon.hover()
|
||||
await expect(clearIcon).toBeVisible()
|
||||
await expect(clearIcon.locator('path')).toHaveAttribute('d', 'm13.4 12 6.3-6.3c.4-.4.4-1 0-1.4-.4-.4-1-.4-1.4 0L12 10.6 5.7 4.3c-.4-.4-1-.4-1.4 0-.4.4-.4 1 0 1.4l6.3 6.3-6.3 6.3c-.4.4-.4 1 0 1.4.2.2.4.3.7.3.3 0 .5-.1.7-.3l6.3-6.3 6.3 6.3c.2.2.4.3.7.3s.5-.1.7-.3c.4-.4.4-1 0-1.4L13.4 12z')
|
||||
|
||||
// 测试清除功能
|
||||
await expect(datePickerCustomClearIcon).toHaveValue('2023-05-24')
|
||||
await page.locator('.tiny-input__icon-container > svg > .st0').click()
|
||||
await expect(datePickerCustomClearIcon).not.toBeVisible()
|
||||
})
|
||||
|
|
|
|||
|
|
@ -3,16 +3,68 @@ import { test, expect } from '@playwright/test'
|
|||
test('测试日期范围选择', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#date-range')
|
||||
const startDateDom = page.getByRole('textbox').nth(1)
|
||||
const endDateDom = page.getByRole('textbox').nth(2)
|
||||
|
||||
await startDateDom.click()
|
||||
await page.getByRole('row', { name: '14 15 16 17 18 19 20' }).getByText('14').click()
|
||||
await page.getByRole('row', { name: '14 15 16 17 18 19 20' }).getByText('20').click()
|
||||
expect(await startDateDom.inputValue()).toBe('2023-05-14')
|
||||
expect(await endDateDom.inputValue()).toBe('2023-05-20')
|
||||
await startDateDom.hover()
|
||||
await page.locator('#preview').getByRole('img').nth(1).click()
|
||||
expect(await startDateDom.inputValue()).not.toBe('2023-05-14')
|
||||
expect(await endDateDom.inputValue()).not.toBe('2023-05-20')
|
||||
// 日期范围
|
||||
// TINY-TODO: 日期范围和日期时间范围无法成功在输入框中输入日期
|
||||
const startDate = page.getByPlaceholder('开始日期').first()
|
||||
const endDate = page.getByPlaceholder('结束日期').first()
|
||||
await startDate.click()
|
||||
await startDate.fill('2023-05-20')
|
||||
await startDate.press('Tab')
|
||||
await endDate.fill('2023-06-20')
|
||||
await startDate.click()
|
||||
await page.getByRole('row', { name: '4 5 6 7 8 9 10' }).getByText('4').click()
|
||||
await page.getByRole('row', { name: '9 10 11 12 13 14 15' }).getByText('10').click()
|
||||
await expect(startDate).toHaveValue('2023-06-04')
|
||||
await expect(endDate).toHaveValue('2023-07-10')
|
||||
|
||||
// 日期时间范围
|
||||
const startDateTime = page.getByPlaceholder('开始日期').nth(1)
|
||||
const endDateTime = page.getByPlaceholder('结束日期').nth(1)
|
||||
await startDateTime.click()
|
||||
await startDateTime.fill('2023-05-20 08:00:00')
|
||||
await startDateTime.press('Tab')
|
||||
await endDateTime.fill('2023-06-20 18:00:00')
|
||||
await startDateTime.click()
|
||||
await startDateTime.press('Enter')
|
||||
await startDateTime.click()
|
||||
await page.getByRole('row', { name: '4 5 6 7 8 9 10' }).getByText('4').click()
|
||||
await page.getByRole('row', { name: '9 10 11 12 13 14 15' }).getByText('10').click()
|
||||
await page.getByRole('textbox', { name: '开始时间' }).click()
|
||||
await page.locator('li:nth-child(2) > span').first().click()
|
||||
await page.getByRole('button', { name: '确定' }).first().click()
|
||||
await page.getByRole('textbox', { name: '结束时间' }).click()
|
||||
await page.locator('span:nth-child(3) > span:nth-child(2) > .tiny-time-panel > .tiny-time-panel__content > .tiny-time-spinner > div > .tiny-scrollbar__wrap > .tiny-scrollbar__view > li:nth-child(3) > span').first().click()
|
||||
await page.getByRole('button', { name: '确定' }).first().click()
|
||||
await page.getByRole('button', { name: '确定' }).click()
|
||||
await expect(startDateTime).toHaveValue('2023-06-04 01:00:00')
|
||||
await expect(endDateTime).toHaveValue('2023-07-10 02:00:00')
|
||||
|
||||
// 月份范围
|
||||
const startMonth = page.getByPlaceholder('开始月份')
|
||||
const endMonth = page.getByPlaceholder('结束月份')
|
||||
await startMonth.click()
|
||||
await startMonth.fill('2023-05')
|
||||
await startMonth.press('Tab')
|
||||
await endMonth.fill('2023-06')
|
||||
await endMonth.press('Enter')
|
||||
await startMonth.click()
|
||||
await page.getByText('一月').first().click()
|
||||
await page.getByText('十二月').first().click()
|
||||
await expect(startMonth).toHaveValue('2023-01')
|
||||
await expect(endMonth).toHaveValue('2023-12')
|
||||
|
||||
// 年份范围
|
||||
const startYear = page.getByPlaceholder('开始年份')
|
||||
const endYear = page.getByPlaceholder('结束年份')
|
||||
await startYear.click()
|
||||
await startYear.fill('2022')
|
||||
await startYear.press('Tab')
|
||||
await endYear.fill('2023')
|
||||
await endYear.press('Enter')
|
||||
await endYear.click()
|
||||
await page.getByRole('cell', { name: '2020' }).getByText('2020').click()
|
||||
await page.getByRole('cell', { name: '2023' }).getByText('2023').click()
|
||||
await expect(startYear).toHaveValue('2020')
|
||||
await expect(endYear).toHaveValue('2023')
|
||||
})
|
||||
|
|
|
|||
|
|
@ -3,9 +3,24 @@ import { test, expect } from '@playwright/test'
|
|||
test('[DatePicker] 测试选择器打开时默认时间设置', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#default-value')
|
||||
const dateInput = page.getByRole('textbox', { name: '2000-11-11' })
|
||||
|
||||
await page.getByRole('textbox', { name: '2000-11-10' }).click()
|
||||
await page.getByText('11', { exact: true }).click()
|
||||
await expect(dateInput).toBeVisible()
|
||||
// default-value: 打开日期面板，默认显示的日期
|
||||
await page.getByRole('textbox').nth(1).click()
|
||||
await expect(page.getByRole('button', { name: '2000 年' })).toBeVisible()
|
||||
await expect(page.getByRole('button', { name: '11 月' })).toBeVisible()
|
||||
|
||||
// default-time: 日期时间(范围)，选择日期之后默认显示的时间(范围)
|
||||
const dateInputDefaultTime = page.getByRole('textbox').nth(2)
|
||||
await dateInputDefaultTime.fill('2023-05-20 09:00:00')
|
||||
await dateInputDefaultTime.press('Enter')
|
||||
|
||||
await page.getByRole('textbox', { name: '2023-05-20 09:00:00' }).click()
|
||||
await page.getByRole('cell', { name: '15' }).getByText('15').click()
|
||||
await expect(page.getByRole('textbox', { name: '选择时间' })).toHaveValue('09:00:00')
|
||||
|
||||
await page.getByRole('textbox').nth(3).click()
|
||||
await page.getByRole('cell', { name: '10' }).getByText('10').first().click()
|
||||
await page.getByRole('cell', { name: '10' }).getByText('10').nth(1).click()
|
||||
await expect(page.getByRole('textbox', { name: '开始时间' })).toHaveValue('09:00:00')
|
||||
await expect(page.getByRole('textbox', { name: '结束时间' })).toHaveValue('18:00:00')
|
||||
})
|
||||
|
|
|
|||
|
|
@ -4,20 +4,34 @@ test('[DatePicker] 测试事件', async ({ page }) => {
|
|||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#events')
|
||||
|
||||
// focus 事件
|
||||
await page.locator('input[type="text"]').nth(1).click()
|
||||
const focusEventMessageDom = page.locator('div').filter({ hasText: '触发 focus 事件' }).nth(1)
|
||||
await expect(focusEventMessageDom).toBeVisible()
|
||||
|
||||
// blur 事件
|
||||
await page.getByRole('textbox').nth(1).click()
|
||||
await page.getByText('blur：').click()
|
||||
const blurEventMessageDom = page.locator('div').filter({ hasText: '可获取组件实例' }).nth(1)
|
||||
const dateInputBlur = page.locator('input[type="text"]').nth(2)
|
||||
await dateInputBlur.fill('2023-05-20')
|
||||
await dateInputBlur.press('Enter')
|
||||
|
||||
await page.getByRole('textbox', { name: '2023-05-20' }).click()
|
||||
await page.getByRole('cell', { name: '15' }).getByText('15').click()
|
||||
const blurEventMessageDom = page.locator('div').filter({ hasText: '触发 blur 事件' }).nth(1)
|
||||
await expect(blurEventMessageDom).toBeVisible()
|
||||
|
||||
// change 事件
|
||||
await page.getByRole('textbox').nth(2).click()
|
||||
await page.getByRole('cell', { name: '20' }).getByText('20').last().click()
|
||||
const changeEventMessageDom = page.locator('div').filter({ hasText: '组件绑定值' }).nth(1)
|
||||
const dateInputChange = page.locator('input[type="text"]').nth(3)
|
||||
await dateInputChange.fill('2023-05-20')
|
||||
await dateInputChange.press('Enter')
|
||||
|
||||
await page.getByRole('textbox', { name: '2023-05-20' }).click()
|
||||
await page.getByRole('cell', { name: '15' }).getByText('15').click()
|
||||
const changeEventMessageDom = page.locator('div').filter({ hasText: '触发 change 事件，组件绑定值为：' }).nth(1)
|
||||
await expect(changeEventMessageDom).toBeVisible()
|
||||
|
||||
// focus 事件
|
||||
await page.getByRole('textbox').nth(3).click()
|
||||
const focusEventMessageDom = page.locator('div').filter({ hasText: '回调参数为组件实例' }).nth(1)
|
||||
await expect(focusEventMessageDom).toBeVisible()
|
||||
// onPick 事件
|
||||
await page.locator('#events').getByRole('textbox').nth(3).click()
|
||||
await page.getByRole('cell', { name: '10' }).getByText('10').first().click()
|
||||
const onPickEventMessageDom = page.locator('div').filter({ hasText: '触发 onPick 事件，开始日期为：' }).nth(1)
|
||||
await expect(onPickEventMessageDom).toBeVisible()
|
||||
})
|
||||
|
|
|
|||
|
|
@ -3,19 +3,20 @@ import { test, expect } from '@playwright/test'
|
|||
test('[DatePicker] 测试日期格式化', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#format')
|
||||
const dateInputDefault = page.getByRole('textbox', { name: '2023 年 05 月 20 日' })
|
||||
const dateInputTimestamp = page.getByRole('textbox', { name: '2020 年 5 月 20 日 0 时 0 分钟 0 秒 AM' })
|
||||
const dateInputString = page.getByRole('textbox', { name: '2020 年 05 月 20 日' })
|
||||
|
||||
await page.getByRole('textbox', { name: '2023 年 05 月 24 日' }).click()
|
||||
// format: 日期输入框中显示的格式
|
||||
await page.getByRole('textbox', { name: '2023 年 05 月 24 日' }).first().click()
|
||||
await page.getByRole('cell', { name: '20' }).getByText('20').click()
|
||||
await expect(dateInputDefault).toBeVisible()
|
||||
await expect(page.getByRole('textbox', { name: '2023 年 05 月 20 日' }).first()).toBeVisible()
|
||||
|
||||
await page.getByRole('textbox', { name: '2020 年 5 月 22 日 0 时 0 分钟 0 秒 AM' }).click()
|
||||
await page.getByRole('cell', { name: '20' }).getByText('20').nth(1).click()
|
||||
await expect(dateInputTimestamp).toBeVisible()
|
||||
// time-format: 时间输入框中显示的格式
|
||||
await page.getByRole('textbox', { name: '2023 年 05 月 20 日 00 时 00 分 00 秒' }).click()
|
||||
await page.getByRole('row', { name: '21 22 23 24 25 26 27' }).getByText('24').click()
|
||||
await page.getByRole('button', { name: '确定' }).click()
|
||||
await expect(page.getByRole('textbox', { name: '2023 年 05 月 24 日 00 时 00 分 00 秒' })).toBeVisible()
|
||||
|
||||
await page.getByRole('textbox', { name: '2020 年 05 月 22 日' }).click()
|
||||
await page.getByRole('cell', { name: '20' }).getByText('20').nth(1).click()
|
||||
await expect(dateInputString).toBeVisible()
|
||||
// value-format: 选中值的格式
|
||||
await page.locator('.tiny-date-editor input').nth(2).click()
|
||||
await page.getByRole('cell', { name: '20' }).getByText('20').click()
|
||||
await expect(page.locator('.select-date')).toHaveText(`当前选中时间：${1589904000000}`)
|
||||
})
|
||||
|
|
|
|||
|
|
@ -3,14 +3,15 @@ import { test, expect } from '@playwright/test'
|
|||
test('[DatePicker] 测试选择快捷选项日期：今天/昨天/一周前', async ({ page }) => {
|
||||
page.on('pageerror', (exception) => expect(exception).toBeNull())
|
||||
await page.goto('date-picker#shortcuts')
|
||||
const datePickerDom = page.locator('body > .tiny-date-picker')
|
||||
// 选择今天/昨天/一周前
|
||||
await page.locator('#preview').getByRole('textbox').click()
|
||||
|
||||
// 日期选择：今天/昨天/一周前
|
||||
const datePickerDom = page.getByRole('textbox', { name: '请选择日期' })
|
||||
await datePickerDom.click()
|
||||
await expect(datePickerDom).toBeVisible()
|
||||
await page.getByRole('button', { name: '今天' }).click()
|
||||
await page.locator('.tiny-date-editor input').click()
|
||||
await page.locator('.tiny-date-editor input').first().click()
|
||||
await page.getByRole('button', { name: '昨天' }).click()
|
||||
await page.locator('.tiny-date-editor input').click()
|
||||
await page.locator('.tiny-date-editor input').first().click()
|
||||
await page.getByRole('button', { name: '一周前' }).click()
|
||||
await expect(datePickerDom).not.toBeVisible()
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue