Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs(site): fix demos and test e2e #2444

Merged
merged 1 commit into from
Oct 28, 2024
Merged

docs(site): fix demos and test e2e #2444

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions examples/sites/demos/pc/app/color-picker/history-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
<template>
<div>
<ColorPicker v-model="color" :history="history" />
<tiny-color-picker v-model="color" :history="history" />
<br />
<Button @click="addHistoryColor">Append history color</Button>
<Button @click="popHistoryColor">Pop history color</Button>
<tiny-button @click="addHistoryColor">Append history color</tiny-button>
<tiny-button @click="popHistoryColor">Pop history color</tiny-button>
Comment on lines +3 to +6
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codebase verification

Tests need to be updated to cover history functionality

The current test file packages/vue/src/color-picker/__tests__/color-picker.spec.ts does not include any test cases for the history feature. The tests only cover basic functionality like color selection, visibility, and v-model handling. Since the component now supports history functionality with methods like addHistoryColor and popHistoryColor, corresponding test cases should be added.

  • Add test cases in packages/vue/src/color-picker/__tests__/color-picker.spec.ts to verify:
    • History prop functionality
    • addHistoryColor method behavior
    • popHistoryColor method behavior
    • History color selection interaction
🔗 Analysis chain

Verify e2e test coverage for the updated components.

Since this PR involves e2e test updates, ensure that the tests are updated to reflect the new component names and selectors.

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for related e2e tests
rg -t js -t ts "color-picker.*history.*test" test/ -A 5

Length of output: 103

Script:

#!/bin/bash
# First, let's find the test directory location since it might not be under 'test/'
fd -t d -i "test|specs|e2e"

# Then search for any color picker related test files
fd -t f -e js -e ts -e vue ".*color.*picker.*"

Length of output: 2983

Script:

#!/bin/bash
# Let's examine the color picker test file content to check for history-related tests
cat packages/vue/src/color-picker/__tests__/color-picker.spec.ts

Length of output: 2127

</div>
</template>

Expand Down
6 changes: 3 additions & 3 deletions examples/sites/demos/pc/app/color-picker/predefine-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
<template>
<div>
<ColorPicker v-model="color" :predefine="predefine" />
<tiny-color-picker v-model="color" :predefine="predefine" />
<br />
<Button @click="addPredefineColor">Append predefine color</Button>
<Button @click="popPredefineColor">Pop predefine color</Button>
<tiny-button @click="addPredefineColor">Append predefine color</tiny-button>
<tiny-button @click="popPredefineColor">Pop predefine color</tiny-button>
</div>
</template>

Expand Down
8 changes: 7 additions & 1 deletion examples/sites/demos/pc/app/color-select-panel/history-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,13 @@
<tiny-button @click="addHistoryColor">Append history color</tiny-button>
<tiny-button @click="popHistoryColor">Pop history color</tiny-button>
<div style="position: relative">
<ColorSelectPanel v-model="color" :visible="visible" @confirm="onConfirm" @cancel="onCancel" :history="history" />
<tiny-color-select-panel
v-model="color"
:visible="visible"
@confirm="onConfirm"
@cancel="onCancel"
:history="history"
/>
</div>
</div>
</template>
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/color-select-panel/predefine-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<tiny-button @click="addPredefineColor">Append predefine color</tiny-button>
<tiny-button @click="popPredefineColor">Pop predefine color</tiny-button>
<div style="position: relative">
<ColorSelectPanel
<tiny-color-select-panel
v-model="color"
:visible="visible"
@confirm="onConfirm"
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/editor/custom-editor-select-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
field="area"
title="区域"
:editor="{
component: Select,
component: TinySelect,
attrs: { options, textField: 'name', valueField: 'id' }
}"
:format-config="{ data: options, label: 'name', value: 'id' }"
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/editor/custom-editor-select.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
field="area"
title="区域"
:editor="{
component: Select,
component: TinySelect,
attrs: { options, textField: 'name', valueField: 'id' }
}"
:format-config="{ data: options, label: 'name', value: 'id' }"
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/editor/mutil-render-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
field="area"
title="区域"
:editor="{
component: Select,
component: TinySelect,
attrs: {
multiple: true,
options,
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/editor/mutil-render.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
field="area"
title="区域"
:editor="{
component: Select,
component: TinySelect,
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Move TinySelect to components registration.

The current implementation exposes TinySelect through data(), which is an unconventional pattern. Instead, register it in the components section for consistency and better maintainability.

export default {
  components: {
    TinyGrid,
-   TinyGridColumn
+   TinyGridColumn,
+   TinySelect
  },
  data() {
    return {
-     TinySelect,
      options: [
        { name: '华中区', id: '1' },
        // ...
      ],

Also applies to: 37-52

attrs: {
multiple: true,
options,
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/editor/popeditor-in-grid-remote-search-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<tiny-grid-column
field="id"
title="名称（Popeditor）"
:editor="{ component: Popeditor, attrs: getPopEditorOp }"
:editor="{ component: TinyPopeditor, attrs: getPopEditorOp }"
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codebase verification

Both demo files need to be updated for consistency

The regular version (popeditor-in-grid-remote-search.vue) is still using TinyPopeditor but in a different way - it's stored in the component's data. For consistency with the composition API version and modern Vue practices, it should be imported and used directly like in the composition API version.

  • examples/sites/demos/pc/app/grid/editor/popeditor-in-grid-remote-search.vue: Remove TinyPopeditor from data and use it directly in the template like the composition API version.
🔗 Analysis chain

LGTM! Please verify the demo functionality.

The change to use TinyPopeditor aligns with the component modernization effort. The integration looks correct with proper imports and maintained configuration.

Let's verify if any documentation updates are needed:

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for any remaining references to the old "Popeditor" in documentation
rg -i "popeditor" --type=md --type=vue

# Check if there are any related demo files that might need similar updates
fd -e vue "popeditor.*\.vue$"

Length of output: 266

Script:

#!/bin/bash
# Let's check the content of both files to see if they are consistent
echo "=== Content of composition API file ==="
cat examples/sites/demos/pc/app/grid/editor/popeditor-in-grid-remote-search-composition-api.vue

echo -e "\n=== Content of regular file ==="
cat examples/sites/demos/pc/app/grid/editor/popeditor-in-grid-remote-search.vue

# Also check for any documentation references
rg -i "popeditor" --type=markdown

Length of output: 10621

:format-config="{
type: 'enum',
async: true,
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/editor/popeditor-in-grid-remote-search.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<tiny-grid-column
field="id"
title="名称（Popeditor）"
:editor="{ component: Popeditor, attrs: getPopEditorOp }"
:editor="{ component: TinyPopeditor, attrs: getPopEditorOp }"
:format-config="{
type: 'enum',
async: true,
Expand Down
6 changes: 3 additions & 3 deletions examples/sites/demos/pc/app/grid/large-data/grid-large-tree-data-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,17 +43,17 @@
<tiny-grid-column
field="planDevEndTime"
title="计划开发结束时间"
:editor="{ component: DatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
:editor="{ component: TinyDatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
></tiny-grid-column>
<tiny-grid-column
field="planTestEndTime"
title="计划测试结束时间"
:editor="{ component: DatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
:editor="{ component: TinyDatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
></tiny-grid-column>
<tiny-grid-column
field="customerExpect"
title="用户期望交付时间"
:editor="{ component: DatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
:editor="{ component: TinyDatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
></tiny-grid-column>
<tiny-grid-column field="requireSource" title="需求来源">
<template #header="{ column }">{{ column.title }}</template>
Expand Down
6 changes: 3 additions & 3 deletions examples/sites/demos/pc/app/grid/large-data/grid-large-tree-data.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,17 +43,17 @@
<tiny-grid-column
field="planDevEndTime"
title="计划开发结束时间"
:editor="{ component: DatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
:editor="{ component: TinyDatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
></tiny-grid-column>
<tiny-grid-column
field="planTestEndTime"
title="计划测试结束时间"
:editor="{ component: DatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
:editor="{ component: TinyDatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
></tiny-grid-column>
<tiny-grid-column
field="customerExpect"
title="用户期望交付时间"
:editor="{ component: DatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
:editor="{ component: TinyDatePicker, attrs: { format: 'yyyy-MM-dd', valueFormat: 'yyyy-MM-dd' } }"
></tiny-grid-column>
<tiny-grid-column field="requireSource" title="需求来源">
<template #header="{ column }">{{ column.title }}</template>
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/renderer/async-colunm-render-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
value: 'value'
}"
:editor="{
component: Select,
component: TinySelect,
attrs: { textField: 'text', clearable: true }
}"
></tiny-grid-column>
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/renderer/async-colunm-render.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
value: 'value'
}"
:editor="{
component: Select,
component: TinySelect,
attrs: { textField: 'text', clearable: true }
}"
></tiny-grid-column>
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/renderer/custom-renderer-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
field="boole"
title="Vue 渲染器"
align="center"
:renderer="{ component: Switch }"
:renderer="{ component: TinySwitch }"
></tiny-grid-column>
<tiny-grid-column field="area" title="区域"></tiny-grid-column>
<tiny-grid-column field="createdDate" title="创建时间"></tiny-grid-column>
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/renderer/custom-renderer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
field="boole"
title="Vue 渲染器"
align="center"
:renderer="{ component: Switch }"
:renderer="{ component: TinySwitch }"
></tiny-grid-column>
<tiny-grid-column field="area" title="区域"></tiny-grid-column>
<tiny-grid-column field="createdDate" title="创建时间"></tiny-grid-column>
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/validation/valid-config-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
show-overflow="tooltip"
>
<tiny-grid-column type="index" width="60"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" :editor="{ component: Input }"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" :editor="{ component: TinyInput }"></tiny-grid-column>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codebase verification

Inconsistent editor component usage across grid validation demos

The change to use TinyInput is only present in a few validation demos (valid-config and validation-scroll-to-col variants), while most other validation demos are using the string literal 'input' as the editor component. This inconsistency should be addressed:

  • valid-config.vue and valid-config-composition-api.vue: Uses TinyInput
  • validation-scroll-to-col.vue and its composition API variant: Uses TinyInput
  • All other validation demos use 'input':
    • before-submit-validation*.vue
    • editing-isvalidalways-validation*.vue
    • editing-validation*.vue
    • select-validation*.vue
    • custcomp*.vue
🔗 Analysis chain

LGTM! Verify validation behavior with TinyInput.

The change from Input to TinyInput aligns with the standardization effort. The validation rules for the name field are properly configured to work with the editor component.

Let's verify that other grid validation demos are consistently using TinyInput:

Let me analyze the results from the grid validation demos:

  1. valid-config-composition-api.vue and valid-config.vue consistently use TinyInput for the name field
  2. validation-scroll-to-col.vue and validation-scroll-to-col-composition-api.vue also use TinyInput for the name field
  3. However, custcomp.vue and custcomp-composition-api.vue use 'input' for the name field

Let me verify if these are all the grid validation demos and check their specific purposes:

Let me check the content of other validation demos to understand if they also use TinyInput:

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Check for consistent usage of TinyInput in grid validation demos
# Expected: All grid validation demos should use TinyInput for consistency

rg -l "grid/validation" | xargs rg "editor.*Input" -A 1 -B 1

Length of output: 7089

Script:

#!/bin/bash
# List all grid validation demo files to ensure we haven't missed any
fd "validation.*vue" examples/sites/demos/pc/app/grid/validation/

# Check the purpose of custcomp demos by looking at their descriptions/comments
rg -B 5 -A 5 "title|description" examples/sites/demos/pc/app/grid/validation/custcomp*.vue

Length of output: 4793

Script:

#!/bin/bash
# Check editor components used in other validation demos
rg -A 1 -B 1 "editor.*component" examples/sites/demos/pc/app/grid/validation/before-submit-validation*.vue examples/sites/demos/pc/app/grid/validation/editing-isvalidalways-validation*.vue examples/sites/demos/pc/app/grid/validation/editing-validation*.vue examples/sites/demos/pc/app/grid/validation/select-validation*.vue

Length of output: 8645

<tiny-grid-column field="area" title="区域" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="address" title="地址" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="introduction" title="公司简介" :editor="{ component: 'input' }"></tiny-grid-column>
Comment on lines 19 to 21
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Consider using TinyInput consistently across all editable columns.

Currently, there's an inconsistency in how editor components are specified:

  • The 'name' column uses the TinyInput component reference
  • Other columns use the string 'input'

For better maintainability and consistency, consider using TinyInput for all editable columns.

      <tiny-grid-column field="name" title="名称" :editor="{ component: TinyInput }"></tiny-grid-column>
-     <tiny-grid-column field="area" title="区域" :editor="{ component: 'input' }"></tiny-grid-column>
-     <tiny-grid-column field="address" title="地址" :editor="{ component: 'input' }"></tiny-grid-column>
-     <tiny-grid-column field="introduction" title="公司简介" :editor="{ component: 'input' }"></tiny-grid-column>
+     <tiny-grid-column field="area" title="区域" :editor="{ component: TinyInput }"></tiny-grid-column>
+     <tiny-grid-column field="address" title="地址" :editor="{ component: TinyInput }"></tiny-grid-column>
+     <tiny-grid-column field="introduction" title="公司简介" :editor="{ component: TinyInput }"></tiny-grid-column>

Committable suggestion was skipped due to low confidence.

Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/validation/valid-config.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
show-overflow="tooltip"
>
<tiny-grid-column type="index" width="60"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" :editor="{ component: Input }"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" :editor="{ component: TinyInput }"></tiny-grid-column>
<tiny-grid-column field="area" title="区域" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="address" title="地址" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="introduction" title="公司简介" :editor="{ component: 'input' }"></tiny-grid-column>
Comment on lines +18 to 21
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Maintain consistency in editor component declarations.

While the name field uses TinyInput component, other fields still use the string literal 'input'. Consider updating all editor components consistently.

Apply this change to maintain consistency:

      <tiny-grid-column field="name" title="名称" :editor="{ component: TinyInput }"></tiny-grid-column>
-     <tiny-grid-column field="area" title="区域" :editor="{ component: 'input' }"></tiny-grid-column>
-     <tiny-grid-column field="address" title="地址" :editor="{ component: 'input' }"></tiny-grid-column>
-     <tiny-grid-column field="introduction" title="公司简介" :editor="{ component: 'input' }"></tiny-grid-column>
+     <tiny-grid-column field="area" title="区域" :editor="{ component: TinyInput }"></tiny-grid-column>
+     <tiny-grid-column field="address" title="地址" :editor="{ component: TinyInput }"></tiny-grid-column>
+     <tiny-grid-column field="introduction" title="公司简介" :editor="{ component: TinyInput }"></tiny-grid-column>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<tiny-grid-column field="name" title="名称" :editor="{ component: TinyInput }"></tiny-grid-column>
<tiny-grid-column field="area" title="区域" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="address" title="地址" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="introduction" title="公司简介" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" :editor="{ component: TinyInput }"></tiny-grid-column>
<tiny-grid-column field="area" title="区域" :editor="{ component: TinyInput }"></tiny-grid-column>
<tiny-grid-column field="address" title="地址" :editor="{ component: TinyInput }"></tiny-grid-column>
<tiny-grid-column field="introduction" title="公司简介" :editor="{ component: TinyInput }"></tiny-grid-column>

Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/validation/validation-scroll-to-col-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
<tiny-grid-toolbar :buttons="toolbarButtons" @button-click="toolbarButtonClickEvent"></tiny-grid-toolbar>
</template>
<tiny-grid-column type="index" width="160"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" width="460" :editor="{ component: Input }"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" width="460" :editor="{ component: TinyInput }"></tiny-grid-column>
<tiny-grid-column field="area" title="区域" width="460" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="address" title="地址" width="460" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/grid/validation/validation-scroll-to-col.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
<tiny-grid-toolbar :buttons="toolbarButtons" @button-click="toolbarButtonClickEvent"></tiny-grid-toolbar>
</template>
<tiny-grid-column type="index" width="160"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" width="460" :editor="{ component: Input }"></tiny-grid-column>
<tiny-grid-column field="name" title="名称" width="460" :editor="{ component: TinyInput }"></tiny-grid-column>
<tiny-grid-column field="area" title="区域" width="460" :editor="{ component: 'input' }"></tiny-grid-column>
<tiny-grid-column field="address" title="地址" width="460" :editor="{ component: 'input' }"></tiny-grid-column>
Comment on lines +14 to 16
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Consider standardizing editor components across columns.

While the name column uses the TinyInput component directly, other columns use the string literal 'input'. Consider standardizing this approach across all columns for consistency.

Apply this pattern to other columns:

-      <tiny-grid-column field="area" title="区域" width="460" :editor="{ component: 'input' }"></tiny-grid-column>
-      <tiny-grid-column field="address" title="地址" width="460" :editor="{ component: 'input' }"></tiny-grid-column>
-      <tiny-grid-column field="introduction" title="公司简介" width="460" :editor="{ component: 'input' }"></tiny-grid-column>
+      <tiny-grid-column field="area" title="区域" width="460" :editor="{ component: TinyInput }"></tiny-grid-column>
+      <tiny-grid-column field="address" title="地址" width="460" :editor="{ component: TinyInput }"></tiny-grid-column>
+      <tiny-grid-column field="introduction" title="公司简介" width="460" :editor="{ component: TinyInput }"></tiny-grid-column>

Committable suggestion was skipped due to low confidence.

<tiny-grid-column
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/select/nest-grid-remote.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ test.describe('下拉表格远程搜索', () => {
const row2 = page.getByRole('row', { name: '省份2 城市2 区域2' })
await expect(row2).not.toBeVisible()
await row1.getByRole('cell').first().click()
await expect(row1).toHaveClass(/tiny-grid-body__row row__selected/)
await expect(row1).toHaveClass(/tiny-grid-body__row row__radio/)
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codebase verification

Inconsistent class names found in related test files

The verification reveals inconsistencies in the class naming across test files:

  • Files still using row__selected:
    • examples/sites/demos/pc/app/select/map-field.spec.ts
    • examples/sites/demos/pc/app/select/nest-grid.spec.ts (uses both old and new class names)
🔗 Analysis chain

LGTM! Verify similar class name changes across related tests.

The class name change from row__selected to row__radio is consistent with the component updates mentioned in the AI summary.

Let's verify if all related test files have been updated consistently:

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Search for any remaining instances of the old class name in test files
rg -g "*.spec.ts" "row__selected"

# Search for the new class name pattern to ensure consistent usage
rg -g "*.spec.ts" "row__radio"

Length of output: 723

await expect(input).toHaveValue('省1-市1')

const row3 = page.getByRole('row', { name: '省份10 城市10 区域10' })
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/select/nest-grid-remote.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,7 @@ export default {
methods: {
remoteMethod(value) {
const filterData = this.filter(value)

console.log(filterData, value)
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Remove console.log statement from production code.

The added console.log statement appears to be for debugging purposes. Since this is a documentation demo, it should maintain clean console output for better developer experience.

- console.log(filterData, value)
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
console.log(filterData, value)

return new Promise((resolve) => {
setTimeout(() => {
resolve(filterData)
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/select/nest-grid.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ test('嵌套表格（单选）', async ({ page }) => {
await row.nth(1).getByRole('cell').first().click()
await expect(input).toHaveValue('深圳1')
await input.click()
await expect(row.filter({ hasText: '深圳1' })).toHaveClass(/tiny-grid-body__row row__selected/)
await expect(row.filter({ hasText: '深圳1' })).toHaveClass(/tiny-grid-body__row row__radio/)
})

test('嵌套表格（多选）', async ({ page }) => {
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/select/nest-radio-grid-much-data.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ test('下拉表格大数据', async ({ page }) => {

await input.click()
await page.waitForTimeout(200)
await expect(row.nth(1)).toHaveClass(/tiny-grid-body__row row__selected/)
await expect(row.nth(1)).toHaveClass(/tiny-grid-body__row row__radio/)
await expect(row).toHaveCount(6)
await expect(page.getByRole('row', { name: '华南区12 广东省 广州市' })).toBeHidden()
await row.nth(5).scrollIntoViewIfNeeded()
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/select/size.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,5 +57,5 @@ test('mini 尺寸', async ({ page }) => {
await expect(input).toHaveClass(/tiny-input-mini/)
await expect(tag.nth(0)).toHaveClass(/tiny-tag--mini tiny-tag--light/)
// TODO: 此处继承input 尺寸的话，应该是24
expect(height).toBeCloseTo(27, 1)
expect(height).toBeCloseTo(24, 1)
})
4 changes: 2 additions & 2 deletions examples/sites/demos/pc/app/slider/max-min.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,11 @@ test('最大值最小值', async ({ page }) => {
await page.mouse.down()
await page.mouse.move(sliderWidth * -0.3 + x, y)
const sliderTip = slider.locator('div').nth(2)
await expect(sliderTip).toHaveText('0')
await expect(sliderTip).toHaveText('30')
await page.waitForTimeout(1000)
await page.mouse.move(sliderWidth * 0.81 + x, y)
const sliderTip1 = slider.locator('div').nth(2)
await expect(sliderTip1).toHaveText('100')
await expect(sliderTip1).toHaveText('62')
await page.waitForTimeout(1000)
await page.mouse.up()
})
Loading