rabbit

- update plural item selected entry
- update mock bookmarts to default empty
- fix test testing already sorted data
- prevent autoExpand already expanded
- fix aria role
- add test + fix path matching

src/components/input/MultiSelect.vue

@@ -111,11 +111,7 @@
             v-if="showSelectedCount"
             class="px-1 text-sm text-base-foreground"
           >
-            {{
-              selectedCount > 0
-                ? $t('g.itemsSelected', { selectedCount })
-                : $t('g.itemSelected', { selectedCount })
-            }}
+            {{ $t('g.itemSelected', { count: selectedCount }, selectedCount) }}
           </span>
           <Button
             v-if="showClearButton"

src/components/searchbox/v2/NodeSearchCategorySidebar.vue

@@ -183,7 +183,13 @@ watch(
   categoryTree,
   (nodes) => {
     if (nodes.length === 1 && nodes[0].children?.length) {
-      emit('autoExpand', nodes[0].key)
+      const rootKey = nodes[0].key
+      if (
+        selectedCategory.value !== rootKey &&
+        !selectedCategory.value.startsWith(rootKey + '/')
+      ) {
+        emit('autoExpand', rootKey)
+      }
     }
   },
   { immediate: true }

src/components/searchbox/v2/NodeSearchCategoryTreeNode.vue

@@ -1,7 +1,5 @@
 <template>
   <div
-    role="treeitem"
-    :aria-expanded="node.children?.length ? isExpanded : undefined"
     :class="
       cn(
         selectedCategory === node.key &&
@@ -15,8 +13,10 @@
       <button
         ref="buttonEl"
         type="button"
+        role="treeitem"
         :data-testid="`category-${node.key}`"
         :aria-current="selectedCategory === node.key || undefined"
+        :aria-expanded="node.children?.length ? isExpanded : undefined"
         :style="{ paddingLeft: `${0.75 + depth * 1.25}rem` }"
         :class="
           cn(

src/components/searchbox/v2/NodeSearchContent.test.ts

@@ -56,7 +56,7 @@ describe('NodeSearchContent', () => {
 
   function mockBookmarks(
     isBookmarked: boolean | ((node: ComfyNodeDefImpl) => boolean) = true,
-    bookmarkList: string[] = ['placeholder']
+    bookmarkList: string[] = []
   ) {
     const bookmarkStore = useNodeBookmarkStore()
     if (typeof isBookmarked === 'function') {
@@ -71,7 +71,7 @@ describe('NodeSearchContent', () => {
     nodes: Parameters<typeof createMockNodeDef>[0][]
   ) {
     useNodeDefStore().updateNodeDefs(nodes.map(createMockNodeDef))
-    mockBookmarks()
+    mockBookmarks(true, ['placeholder'])
     const wrapper = await createWrapper()
     await wrapper.find('[data-testid="category-favorites"]').trigger('click')
     await nextTick()
@@ -136,7 +136,7 @@ describe('NodeSearchContent', () => {
       useNodeDefStore().updateNodeDefs([
         createMockNodeDef({ name: 'Node1', display_name: 'Node One' })
       ])
-      mockBookmarks(false)
+      mockBookmarks(false, ['placeholder'])
 
       const wrapper = await createWrapper()
       await wrapper.find('[data-testid="category-favorites"]').trigger('click')
@@ -334,7 +334,7 @@ describe('NodeSearchContent', () => {
       useNodeDefStore().updateNodeDefs([
         createMockNodeDef({ name: 'TestNode', display_name: 'Test Node' })
       ])
-      mockBookmarks()
+      mockBookmarks(true, ['placeholder'])
 
       const wrapper = await createWrapper()
 
@@ -529,7 +529,7 @@ describe('NodeSearchContent', () => {
     })
 
     it('should emit null hoverNode when no results', async () => {
-      mockBookmarks(false)
+      mockBookmarks(false, ['placeholder'])
       const wrapper = await createWrapper()
 
       await wrapper.find('[data-testid="category-favorites"]').trigger('click')

src/components/searchbox/v2/NodeSearchContent.vue

@@ -275,10 +275,15 @@ function getCategoryResults(baseNodes: ComfyNodeDefImpl[], category: string) {
   const categoryPath = category.startsWith(rootPrefix)
     ? category.slice(rootPrefix.length)
     : category
-  return baseNodes.filter(
-    (n) =>
-      n.category === categoryPath || n.category.startsWith(categoryPath + '/')
-  )
+  return baseNodes.filter((n) => {
+    const nodeCategory = n.category.startsWith(rootPrefix)
+      ? n.category.slice(rootPrefix.length)
+      : n.category
+    return (
+      nodeCategory === categoryPath ||
+      nodeCategory.startsWith(categoryPath + '/')
+    )
+  })
 }
 
 const displayedResults = computed<ComfyNodeDefImpl[]>(() => {

src/components/searchbox/v2/NodeSearchTypeFilterPopover.test.ts

@@ -80,7 +80,7 @@ describe(NodeSearchTypeFilterPopover, () => {
   })
 
   it('should display all options sorted alphabetically', async () => {
-    createWrapper()
+    createWrapper({ chip: createMockChip(['MODEL', 'IMAGE', 'LATENT']) })
     await openPopover(wrapper)
 
     const options = getOptions()

src/components/searchbox/v2/NodeSearchTypeFilterPopover.vue

@@ -35,7 +35,13 @@
 
         <div class="flex items-center justify-between py-3">
           <span class="text-sm text-muted-foreground">
-            {{ t('g.itemsSelected', { selectedCount: selectedValues.length }) }}
+            {{
+              t(
+                'g.itemSelected',
+                { count: selectedValues.length },
+                selectedValues.length
+              )
+            }}
           </span>
           <button
             v-if="selectedValues.length > 0"

src/components/searchbox/v2/__test__/testUtils.ts

@@ -54,7 +54,7 @@ export const testI18n = createI18n({
         blueprints: 'Blueprints',
         partnerNodes: 'Partner Nodes',
         remove: 'Remove',
-        itemsSelected: '{selectedCount} items selected',
+        itemSelected: '{count} item selected | {count} items selected',
         clearAll: 'Clear all'
       }
     }

src/locales/en/main.json

@@ -260,8 +260,7 @@
     "clearAll": "Clear all",
     "copyURL": "Copy URL",
     "releaseTitle": "{package} {version} Release",
-    "itemSelected": "{selectedCount} item selected",
-    "itemsSelected": "{selectedCount} items selected",
+    "itemSelected": "{count} item selected | {count} items selected",
     "multiSelectDropdown": "Multi-select dropdown",
     "singleSelectDropdown": "Single-select dropdown",
     "progressCountOf": "of",