test(grid): [grid] grid test case fix

opentiny · Sep 19, 2024 · e7bd963 · e7bd963
1 parent afed7c9
commit e7bd963
Show file tree

Hide file tree

Showing 13 changed files with 36 additions and 24 deletions.
diff --git a/examples/sites/demos/pc/app/grid/drag/row-drag-ctrl-composition-api.vue b/examples/sites/demos/pc/app/grid/drag/row-drag-ctrl-composition-api.vue
@@ -1,7 +1,7 @@
 <template>
   <tiny-grid :row-class-name="rowClassName" :data="tableData" row-key :drop-config="dropConfig">
     <tiny-grid-column field="id" width="60"></tiny-grid-column>
-    <tiny-grid-column field="name" title="触发源" width="100">
+    <tiny-grid-column field="name" title="触发源" width="120">
       <template #default="{ row }">
         <div class="only-me-can-drag">拖拽触发源{{ row.id }}</div>
       </template>

diff --git a/examples/sites/demos/pc/app/grid/drag/row-drag-ctrl.spec.js b/examples/sites/demos/pc/app/grid/drag/row-drag-ctrl.spec.js
@@ -4,6 +4,10 @@ test('拖拽控制', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-drag#drag-row-drag-ctrl')
   const diabledDragDom = page.getByRole('cell', { name: '拖拽触发源1' })
+  await page.setViewportSize({
+    width: 1600,
+    height: 1200
+  })
   // 获取拖拽元素位置
   const { x, y } = await diabledDragDom.boundingBox()
   // 验证不可拖拽
@@ -23,7 +27,7 @@ test('拖拽控制', async ({ page }) => {
   await draggerDom.hover()
   await page.mouse.down()
   await page.waitForTimeout(200)
-  await page.mouse.move(left, top - 200)
+  await page.mouse.move(left, top - 240)
   await page.waitForTimeout(200)
   await page.mouse.up()
   await page.waitForTimeout(200)

diff --git a/examples/sites/demos/pc/app/grid/drag/row-drag-ctrl.vue b/examples/sites/demos/pc/app/grid/drag/row-drag-ctrl.vue
@@ -1,7 +1,7 @@
 <template>
   <tiny-grid :row-class-name="rowClassName" :data="tableData" row-key :drop-config="dropConfig">
     <tiny-grid-column field="id" width="60"></tiny-grid-column>
-    <tiny-grid-column field="name" title="触发源" width="100">
+    <tiny-grid-column field="name" title="触发源" width="120">
       <template #default="{ row }">
         <div class="only-me-can-drag">拖拽触发源{{ row.id }}</div>
       </template>

diff --git a/examples/sites/demos/pc/app/grid/editor/mutil-render.spec.js b/examples/sites/demos/pc/app/grid/editor/mutil-render.spec.js
@@ -3,6 +3,10 @@ import { test, expect } from '@playwright/test'
 test('Grid-编辑器-下拉多选', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-editor#editor-mutil-render')
+  await page.setViewportSize({
+    width: 1600,
+    height: 1200
+  })
   await page.getByText('华中区;华南区').click()
   await page.locator('.tiny-input__suffix-inner > .tiny-svg').click()
   await page.locator('li').filter({ hasText: '华东区' }).click()

diff --git a/examples/sites/demos/pc/app/grid/filter/simple-date-filter.spec.ts b/examples/sites/demos/pc/app/grid/filter/simple-date-filter.spec.ts
@@ -3,12 +3,16 @@ import { test, expect } from '@playwright/test'
 test('简化版筛选面板-时间日期菜单', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-filter#filter-simple-date-filter')
+  await page.setViewportSize({
+    width: 1600,
+    height: 1200
+  })
   await page.getByRole('cell', { name: '开始时间' }).getByRole('img').click()
-  await page.locator('.tiny-input__suffix-inner').nth(0).click()
+  await page.locator('.tiny-date-editor').nth(0).click()
   await page.getByRole('textbox', { name: '选择日期' }).fill('2021-12-03')
   await page.getByRole('button', { name: '确定' }).nth(1).click()
   await page.waitForTimeout(200)
-  await page.locator('.tiny-input__suffix-inner').nth(1).click()
+  await page.locator('.tiny-date-editor').nth(1).click()
   await page.getByRole('textbox', { name: '选择日期' }).fill('2023-11-19')
   await page.getByRole('button', { name: '确定' }).nth(1).click()
   await page.getByRole('button', { name: '确定' }).first().click()

diff --git a/examples/sites/demos/pc/app/grid/highlight/highlight-hover-row.spec.js b/examples/sites/demos/pc/app/grid/highlight/highlight-hover-row.spec.js
@@ -6,5 +6,5 @@ test('高亮悬停行', async ({ page }) => {
   const tr = page.locator('.tiny-grid-body__row').first()
   await tr.hover()
   await page.waitForTimeout(500)
-  await expect(tr).toHaveCSS('background-color', 'rgb(242, 245, 252)')
+  await expect(tr).toHaveCSS('background-color', 'rgb(245, 245, 245)')
 })
diff --git a/examples/sites/demos/pc/app/grid/large-data/full-data-loading.spec.js b/examples/sites/demos/pc/app/grid/large-data/full-data-loading.spec.js
@@ -6,11 +6,11 @@ test('全量加载', async ({ page }) => {
   await page.locator('.tiny-grid__body').hover()
   // 先滚动1000px
   await page.mouse.wheel(0, 1000)
-  await expect(page.getByRole('cell', { name: '33' })).toBeVisible()
+  await expect(page.getByRole('cell', { name: '28' })).toBeVisible()
   await page.waitForTimeout(500)
   await page.locator('.tiny-grid__body').hover()
   // 先滚动4000px
   await page.mouse.wheel(0, 5000)
   await page.waitForTimeout(200)
-  await expect(page.getByRole('cell', { name: '175' })).toBeVisible()
+  await expect(page.getByRole('cell', { name: '153' })).toBeVisible()
 })
diff --git a/examples/sites/demos/pc/app/grid/renderer/inner-renderer-rate.spec.js b/examples/sites/demos/pc/app/grid/renderer/inner-renderer-rate.spec.js
@@ -4,9 +4,9 @@ test('比率渲染器', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-renderer#renderer-inner-renderer-rate')
   const redCell = page.getByRole('cell', { name: '200.0000%' }).first().locator('.tiny-grid__rate-chart')
-  await expect(redCell).toHaveCSS('background-color', 'rgb(222, 80, 78)')
+  await expect(redCell).toHaveCSS('background-color', 'rgb(242, 48, 48)')
   const yellowCell = page.getByRole('cell', { name: '34.4500%' }).nth(1).locator('.tiny-grid__rate-chart')
-  await expect(yellowCell).toHaveCSS('background-color', 'rgb(250, 152, 65)')
+  await expect(yellowCell).toHaveCSS('background-color', 'rgb(255, 136, 0)')
   const blueCell = page.getByRole('cell', { name: '60.0500%' }).nth(1).locator('.tiny-grid__rate-chart')
-  await expect(blueCell).toHaveCSS('background-color', 'rgb(94, 124, 224)')
+  await expect(blueCell).toHaveCSS('background-color', 'rgb(25, 25, 25)')
 })
diff --git a/examples/sites/demos/pc/app/grid/renderer/inner-renderer.spec.js b/examples/sites/demos/pc/app/grid/renderer/inner-renderer.spec.js
@@ -4,5 +4,5 @@ test('内置渲染器', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-renderer#renderer-inner-renderer')
   const cell = page.getByRole('cell', { name: '90.0%' }).locator('.tiny-grid__rate-chart')
-  await expect(cell).toHaveCSS('background-color', 'rgb(80, 212, 171)')
+  await expect(cell).toHaveCSS('background-color', 'rgb(92, 179, 0)')
 })
diff --git a/examples/sites/demos/pc/app/grid/size/adaptive-column-width.spec.js b/examples/sites/demos/pc/app/grid/size/adaptive-column-width.spec.js
@@ -5,9 +5,9 @@ test('列宽自适应撑开', async ({ page }) => {
   await page.goto('grid-size#size-adaptive-column-width')
   const th = page.getByRole('cell', { name: '公司简介' }).nth(0)
   const { width } = await th.boundingBox()
-  await expect(width).toBeGreaterThan(42)
+  await expect(width).toBeGreaterThan(72)
 
   const th1 = page.getByRole('cell', { name: '公司简介' }).nth(1)
   const { width: width1 } = await th1.boundingBox()
-  await expect(width1).toBeLessThanOrEqual(42)
+  await expect(width1).toBeLessThanOrEqual(72)
 })
diff --git a/examples/sites/demos/pc/app/grid/size/max-min-grid-height.spec.js b/examples/sites/demos/pc/app/grid/size/max-min-grid-height.spec.js
@@ -3,6 +3,6 @@ import { test, expect } from '@playwright/test'
 test('设置 maxHeight 最大高度', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-size#size-max-min-grid-height')
-  await expect(page.locator('.tiny-grid__body-wrapper').nth(0)).toHaveCSS('max-height', '165px')
-  await expect(page.locator('.tiny-grid__body-wrapper').nth(1)).toHaveCSS('min-height', '265px')
+  await expect(page.locator('.tiny-grid__body-wrapper').nth(0)).toHaveCSS('max-height', '160px')
+  await expect(page.locator('.tiny-grid__body-wrapper').nth(1)).toHaveCSS('min-height', '260px')
 })
diff --git a/examples/sites/demos/pc/app/grid/slot/editor-slot.spec.js b/examples/sites/demos/pc/app/grid/slot/editor-slot.spec.js
@@ -3,6 +3,10 @@ import { test, expect } from '@playwright/test'
 test('编辑器插槽', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-slot#slot-editor-slot')
+  await page.setViewportSize({
+    width: 1600,
+    height: 1200
+  })
   await page.getByText('WWWW科技YX公司').click()
   await page.getByRole('textbox', { name: '请输入内容', exact: true }).click()
   await page.getByRole('textbox', { name: '请输入内容', exact: true }).fill('WWWWsdfd科技YX公司')

diff --git a/examples/sites/demos/pc/app/grid/tree-table/tree-grid-index.spec.js b/examples/sites/demos/pc/app/grid/tree-table/tree-grid-index.spec.js
@@ -3,21 +3,17 @@ import { test, expect } from '@playwright/test'
 test('展开行序号列配置', async ({ page }) => {
   page.on('pageerror', (exception) => expect(exception).toBeNull())
   await page.goto('grid-tree-table#tree-table-tree-grid-index')
-  await page
-    .getByRole('row', { name: '1 GFD科技YX公司 华东区 800' })
-    .locator('.tiny-grid-tree__node-btn')
-    .first()
-    .click()
+  await page.getByRole('row', { name: '1 GFD科技YX公司 华东区 800' }).locator('.tiny-grid-tree-wrapper').first().click()
   await page
     .getByRole('row', { name: '2 WWWW科技YX公司 华南区 500' })
-    .locator('.tiny-grid-tree__node-btn')
+    .locator('.tiny-grid-tree-wrapper')
     .first()
     .click()
-  await page.getByRole('row', { name: '3 TGBYX公司 华南区 360' }).locator('.tiny-grid-tree__node-btn').first().click()
+  await page.getByRole('row', { name: '3 TGBYX公司 华南区 360' }).locator('.tiny-grid-tree-wrapper').first().click()
   await page.getByText('3.1').first().click()
   await page
     .getByRole('row', { name: '4 康康物业YX公司 华南区 400' })
-    .locator('.tiny-grid-tree__node-btn')
+    .locator('.tiny-grid-tree-wrapper')
     .first()
     .click()