diff --git a/examples/sites/demos/pc/app/fall-menu/custom-menuitem.spec.ts b/examples/sites/demos/pc/app/fall-menu/custom-menuitem.spec.ts index 232129df7..34bf60b71 100644 --- a/examples/sites/demos/pc/app/fall-menu/custom-menuitem.spec.ts +++ b/examples/sites/demos/pc/app/fall-menu/custom-menuitem.spec.ts @@ -3,18 +3,15 @@ import { test, expect } from '@playwright/test' test('自定义内容', async ({ page }) => { page.on('pageerror', (exception) => expect(exception).toBeNull()) await page.goto('fall-menu#custom-menuitem') - const preview = page.locator('#preview') // 子菜单列表容器 - const fallMenuBox = preview.locator('.tiny-fall-menu__box') + const preview = page.locator('.tiny-fall-menu__wrap') // 父菜单列表 - const fallMenuList = preview.locator('.tiny-fall-menu__list') - await page.getByText('首页level1').hover() - await expect(fallMenuBox).toBeHidden() - await page.getByText('指南level1').hover() - await expect(fallMenuBox).toBeVisible() + const fallMenuList = page.locator('.tiny-fall-menu__list') + await preview.getByText('指南 level1').hover() + await page.waitForTimeout(1000) // 点击左、右侧图标切换列表 - await preview.locator('.icon-slot-right').click() + await preview.locator('.tiny-fall-menu__nav > .tiny-fall-menu__subnav > .icon-slot-right').click() await expect(fallMenuList).toHaveCSS('left', /^-\d+px/) - await preview.locator('.icon-slot-left').click() + await preview.locator('.tiny-fall-menu__nav > .tiny-fall-menu__subnav > .icon-slot-left').click() await expect(fallMenuList).toHaveCSS('left', '0px') }) diff --git a/examples/sites/demos/pc/app/fall-menu/custom-slider-icon.spec.ts b/examples/sites/demos/pc/app/fall-menu/custom-slider-icon.spec.ts index a5d0224da..f446cecea 100644 --- a/examples/sites/demos/pc/app/fall-menu/custom-slider-icon.spec.ts +++ b/examples/sites/demos/pc/app/fall-menu/custom-slider-icon.spec.ts @@ -1,28 +1,17 @@ import { test, expect } from '@playwright/test' -test('自定义左、右侧图标', async ({ page }) => { +test('自定义内容', async ({ page }) => { page.on('pageerror', (exception) => expect(exception).toBeNull()) - await page.goto('fall-menu#custom-slider-icon') - const preview = page.locator('#preview') - // 右侧插槽图标 - const rightSlotIcon = preview.locator('.icon-slot-right') + await page.goto('fall-menu#custom-menuitem') + // 子菜单列表容器 + const preview = page.locator('.tiny-fall-menu__wrap') // 父菜单列表 - const fallMenuList = preview.locator('.tiny-fall-menu__list') - // 是否是默认图标 - await expect(rightSlotIcon.locator('svg path').getAttribute('d')).not.toContain( - 'M7 21c.2 0 .5-.1.6-.2l9.9-8c.2-.2.4-.5.4-.8' - ) - // 点击右侧更多切换图标 - await rightSlotIcon.click() - // 向左移动 + const fallMenuList = page.locator('.tiny-fall-menu__list') + await preview.getByText('组件 level1').hover() + await page.waitForTimeout(1000) + // 点击左、右侧图标切换列表 + await preview.locator('.tiny-fall-menu__nav > .tiny-fall-menu__subnav > .icon-slot-right').click() await expect(fallMenuList).toHaveCSS('left', /^-\d+px/) - // 左侧插槽图标 - const leftSlotIcon = preview.locator('.icon-slot-left') - await expect(leftSlotIcon.locator('svg path').getAttribute('d')).not.toContain( - 'M17 21c-.2 0-.5-.1-.6-.2l-9.9-8c-.4-.2-.5-.5-.5-.8' - ) - // 点击左侧更多切换图标 - await leftSlotIcon.click() - // 向右移动 + await preview.locator('.tiny-fall-menu__nav > .tiny-fall-menu__subnav > .icon-slot-left').click() await expect(fallMenuList).toHaveCSS('left', '0px') }) diff --git a/examples/sites/demos/pc/app/fall-menu/data-resource.spec.ts b/examples/sites/demos/pc/app/fall-menu/data-resource.spec.ts index e924a5eea..96b9091c9 100644 --- a/examples/sites/demos/pc/app/fall-menu/data-resource.spec.ts +++ b/examples/sites/demos/pc/app/fall-menu/data-resource.spec.ts @@ -4,22 +4,19 @@ import { test, expect } from '@playwright/test' test('基础用法、数据源', async ({ page }) => { page.on('pageerror', (exception) => expect(exception).toBeNull()) await page.goto('fall-menu#data-resource') - const preview = page.locator('#preview') - await preview.getByRole('link', { name: '指南' }).hover() - const fallMenuBox = preview.locator('.tiny-fall-menu__box') + const preview = page.locator('.tiny-fall-menu__wrap') // 父菜单列表 - const fallMenuList = preview.locator('.tiny-fall-menu__list') + const fallMenuList = page.locator('.tiny-fall-menu__list') // 菜单列表应该可见 - await expect(fallMenuBox).toBeVisible() - await preview.getByRole('link', { name: '规范' }).hover() + await preview.getByText(/^指南*$/i).hover() + await page.waitForTimeout(1000) // 菜单列表应该不可见 - await expect(fallMenuBox).toBeHidden() // 点击右侧更多切换图标 - await preview.getByRole('img').nth(1).click() + await preview.locator('.tiny-fall-menu__nav > .tiny-fall-menu__subnav > .icon-slot-right').click() // 向左移动 await expect(fallMenuList).toHaveCSS('left', /^-\d+px/) // 点击左侧更多切换图标 - await preview.getByRole('img').nth(1).click() + await preview.locator('.tiny-fall-menu__nav > .tiny-fall-menu__subnav > .icon-slot-left').click() // 向右移动 await expect(fallMenuList).toHaveCSS('left', '0px') })