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

fix(tabs): [tabs] modify tabs demo bug #2274

Merged
merged 3 commits into from
Oct 16, 2024
Merged

fix(tabs): [tabs] modify tabs demo bug #2274

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
7bac816
fix: modify tabs bug
James-9696 Oct 16, 2024
8a11891
fix: modify e2e-test
James-9696 Oct 16, 2024
87f8b6a
fix: modify code conflict
James-9696 Oct 16, 2024
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
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/tabs/basic-usage-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
import { ref } from 'vue'
import { Tabs as TinyTabs, TabItem as TinyTabItem } from '@opentiny/vue'

const activeName = ref('second')
const activeName = ref('first')
</script>

<style scoped>
Expand Down
11 changes: 8 additions & 3 deletions examples/sites/demos/pc/app/tabs/basic-usage.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,15 @@ test('基本用法', async ({ page }) => {
const activeBar = tabs.locator('.tiny-tabs__active-bar')

await expect(tabItems).toHaveCount(4)
await expect(tabItems).toHaveClass([/is-top/, /is-top is-active/, /is-top/, /is-top/])
await expect(content).toHaveText(/数据组件/)
await expect(tabItems).toHaveClass([
/tiny-tabs__item is-top is-active/,
/tiny-tabs__item is-top is-disabled/,
/tiny-tabs__item is-top/,
/tiny-tabs__item is-top/
])
Comment on lines +16 to +21
Copy link

Choose a reason for hiding this comment

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

💡 Codebase verification

Inconsistency between test and component implementation.

The updated class names in examples/sites/demos/pc/app/tabs/basic-usage.spec.ts were not found in the component's .vue files within src/tabs. Please ensure that the component uses the updated class names to maintain consistency with the tests.

🔗 Analysis chain

LGTM! Verify component implementation for consistency.

The updated class names for tab items provide more specific information about their states (active, disabled). This change improves the test's accuracy and likely reflects updates in the component's implementation.

To ensure consistency, please run the following script to verify the component's implementation:

Adjusting search method for .vue files. Please run the following script to verify the class names:

🏁 Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify the tab item class names in the component implementation

# Test: Search for the class names in the component files
rg --type vue 'tiny-tabs__item is-(top|active|disabled)' src/tabs

Length of output: 95

Script:

#!/bin/bash
# Description: Locate .vue files and verify the presence of specific tab item class names

# Find all .vue files within src/tabs and search for the specified class names
fd --extension vue src/tabs | xargs rg 'tiny-tabs__item is-(top|active|disabled)'

Length of output: 436

await expect(content).toHaveText(/表单组件/)
await expect(activeBar).toHaveCSS('width', '64px')
await expect(activeBar).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 96, 0)')
await expect(activeBar).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)')
await item1.click()
await expect(item1).toHaveClass(/is-active/)
await expect(activeBar).toHaveCSS('width', '64px')
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/tabs/basic-usage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export default {
},
data() {
return {
activeName: 'second'
activeName: 'first'
}
}
}
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/tabs/tabs-separator-composition-api.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
<tiny-tab-item title="业务组件" name="fourth"> 业务组件,与业务紧密相关实现某种业务功能的组件集。 </tiny-tab-item>
</tiny-tabs>
<br /><br /><br /><br />
<tiny-tabs separator :editable="false" :with-add="true" @add="handleadd" style="width: 500px" show-more-tabs>
<tiny-tabs separator :editable="false" :with-add="true" @add="handleadd" style="width: 500px">
<tiny-tab-item :key="item.name" v-for="item in Tabs" :title="item.title" :name="item.name">
{{ item.content }}
</tiny-tab-item>
Expand Down
2 changes: 1 addition & 1 deletion examples/sites/demos/pc/app/tabs/tabs-separator.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
<tiny-tab-item title="业务组件" name="fourth"> 业务组件,与业务紧密相关实现某种业务功能的组件集。 </tiny-tab-item>
</tiny-tabs>
<br /><br /><br /><br />
<tiny-tabs separator :editable="false" :with-add="true" @add="handleadd" style="width: 500px" show-more-tabs>
<tiny-tabs separator :editable="false" :with-add="true" @add="handleadd" style="width: 500px">
<tiny-tab-item :key="item.name" v-for="item in Tabs" :title="item.title" :name="item.name">
{{ item.content }}
</tiny-tab-item>
Expand Down
Loading