Fix render issue when removing search filter chips (#2038)

This commit is contained in:
bymyself
2024-12-24 08:13:14 -07:00
committed by GitHub
parent 96b2987590
commit 5da26e917a
2 changed files with 47 additions and 4 deletions

View File

@@ -107,26 +107,68 @@ test.describe('Node search box', () => {
})
test.describe('Filtering', () => {
const expectFilterChips = async (comfyPage, expectedTexts: string[]) => {
const chips = comfyPage.searchBox.filterChips
// Check that the number of chips matches the expected count
await expect(chips).toHaveCount(expectedTexts.length)
// Verify the text and visibility of each filter chip
await Promise.all(
expectedTexts.map(async (text, index) => {
const chip = chips.nth(index)
await expect(chip).toContainText(text)
await expect(chip).toBeVisible()
})
)
}
test.beforeEach(async ({ comfyPage }) => {
await comfyPage.doubleClickCanvas()
})
test('Can add filter', async ({ comfyPage }) => {
await comfyPage.searchBox.addFilter('MODEL', 'Input Type')
await expect(comfyPage.searchBox.filterChips).toHaveCount(1)
await expectFilterChips(comfyPage, ['MODEL'])
})
test('Can add multiple filters', async ({ comfyPage }) => {
await comfyPage.searchBox.addFilter('MODEL', 'Input Type')
await comfyPage.searchBox.addFilter('CLIP', 'Output Type')
await expect(comfyPage.searchBox.filterChips).toHaveCount(2)
await expectFilterChips(comfyPage, ['MODEL', 'CLIP'])
})
test('Can remove filter', async ({ comfyPage }) => {
await comfyPage.searchBox.addFilter('MODEL', 'Input Type')
await comfyPage.searchBox.addFilter('CLIP', 'Output Type')
await comfyPage.searchBox.removeFilter(0)
await expect(comfyPage.searchBox.filterChips).toHaveCount(1)
await expectFilterChips(comfyPage, [])
})
test.describe('Removing from multiple filters', () => {
test.beforeEach(async ({ comfyPage }) => {
await comfyPage.searchBox.addFilter('MODEL', 'Input Type')
await comfyPage.searchBox.addFilter('CLIP', 'Output Type')
await comfyPage.searchBox.addFilter('utils', 'Category')
})
test('Can remove first filter', async ({ comfyPage }) => {
await comfyPage.searchBox.removeFilter(0)
await expectFilterChips(comfyPage, ['CLIP', 'utils'])
await comfyPage.searchBox.removeFilter(0)
await expectFilterChips(comfyPage, ['utils'])
await comfyPage.searchBox.removeFilter(0)
await expectFilterChips(comfyPage, [])
})
test('Can remove middle filter', async ({ comfyPage }) => {
await comfyPage.searchBox.removeFilter(1)
await expectFilterChips(comfyPage, ['MODEL', 'utils'])
})
test('Can remove last filter', async ({ comfyPage }) => {
await comfyPage.searchBox.removeFilter(2)
await expectFilterChips(comfyPage, ['MODEL', 'CLIP'])
})
})
})

View File

@@ -54,6 +54,7 @@
<!-- FilterAndValue -->
<template v-slot:chip="{ value }">
<SearchFilterChip
:key="`${value[0].id}-${value[1]}`"
@remove="onRemoveFilter($event, value)"
:text="value[1]"
:badge="value[0].invokeSequence.toUpperCase()"