fix: show filtered versions claimed by tag rows in semver filter

serhalp · serhalp · commit 78864eb67b21 · 2026-03-04T07:35:19.000-05:00
Tag rows were hidden when their primary version didn't match the filter,
even if child versions did. For example, filtering for `~3.4.0` on vue
hid the `latest` row (pointing to 3.5.13), making 3.4.0 invisible since
it was claimed by that tag and not in "Other versions".

Now tag rows stay visible when any child version matches, and matching
children are auto-expanded when a filter is active. Also fixes the test
to exercise the real bug scenario (same-major child version).
diff --git a/app/components/Package/Versions.vue b/app/components/Package/Versions.vue
@@ -212,8 +212,10 @@ const visibleTagRows = computed(() => {
     ? allTagRows.value
     : allTagRows.value.filter(row => !row.primaryVersion.deprecated)
   const rows = isFilterActive.value
-    ? rowsMaybeFilteredForDeprecation.filter(row =>
-        filteredVersionSet.value.has(row.primaryVersion.version),
+    ? rowsMaybeFilteredForDeprecation.filter(
+        row =>
+          filteredVersionSet.value.has(row.primaryVersion.version) ||
+          getTagVersions(row.tag).some(v => filteredVersionSet.value.has(v.version)),
       )
     : rowsMaybeFilteredForDeprecation
   const first = rows.slice(0, MAX_VISIBLE_TAGS)
@@ -231,7 +233,11 @@ const visibleTagRows = computed(() => {
 const hiddenTagRows = computed(() => {
   const hiddenRows = allTagRows.value.filter(row => !visibleTagRows.value.includes(row))
   const rows = isFilterActive.value
-    ? hiddenRows.filter(row => filteredVersionSet.value.has(row.primaryVersion.version))
+    ? hiddenRows.filter(
+        row =>
+          filteredVersionSet.value.has(row.primaryVersion.version) ||
+          getTagVersions(row.tag).some(v => filteredVersionSet.value.has(v.version)),
+      )
     : hiddenRows
   return rows
 })
@@ -688,7 +694,7 @@ function majorGroupContainsCurrent(group: (typeof otherMajorGroups.value)[0]): b
         <!-- Expanded versions -->
         <div
           v-if="
-            expandedTags.has(row.tag) &&
+            (expandedTags.has(row.tag) || isFilterActive) &&
             getExpandedTagVersions(row.tag, row.primaryVersion.version).length
           "
           class="ms-4 ps-2 border-is border-border space-y-0.5 pe-2"
diff --git a/test/nuxt/components/PackageVersions.spec.ts b/test/nuxt/components/PackageVersions.spec.ts
@@ -1129,43 +1129,43 @@ describe('PackageVersions', () => {
 
     it('loads all versions when a valid semver filter is entered', async () => {
       mockFetchAllPackageVersions.mockResolvedValue([
-        { version: '3.0.0', time: '2024-04-01T00:00:00.000Z', hasProvenance: false },
-        { version: '2.1.0', time: '2024-03-01T00:00:00.000Z', hasProvenance: false },
-        { version: '2.0.0', time: '2024-02-01T00:00:00.000Z', hasProvenance: false },
-        { version: '1.5.0', time: '2024-01-15T00:00:00.000Z', hasProvenance: false },
+        { version: '3.5.0', time: '2024-04-01T00:00:00.000Z', hasProvenance: false },
+        { version: '3.4.0', time: '2024-03-01T00:00:00.000Z', hasProvenance: false },
+        { version: '3.3.0', time: '2024-02-01T00:00:00.000Z', hasProvenance: false },
+        { version: '2.0.0', time: '2024-01-15T00:00:00.000Z', hasProvenance: false },
         { version: '1.0.0', time: '2024-01-01T00:00:00.000Z', hasProvenance: false },
       ])
 
-      // Only provide a subset of versions in props (simulating initial SSR payload)
+      // Only provide latest in props (simulating initial SSR payload)
       const component = await mountSuspended(PackageVersions, {
         props: {
           packageName: 'test-package',
           versions: {
-            '3.0.0': createVersion('3.0.0'),
+            '3.5.0': createVersion('3.5.0'),
           },
-          distTags: { latest: '3.0.0' },
-          time: { '3.0.0': '2024-04-01T00:00:00.000Z' },
+          distTags: { latest: '3.5.0' },
+          time: { '3.5.0': '2024-04-01T00:00:00.000Z' },
         },
       })
 
-      // Filter for a version NOT in the initial props
+      // Filter for a version in the SAME major group as latest (claimed by the tag)
       const input = component.find('input[type="text"]')
-      await input.setValue('1.5.0')
+      await input.setValue('~3.4.0')
 
       // Should trigger loading all versions
       await vi.waitFor(() => {
         expect(mockFetchAllPackageVersions).toHaveBeenCalledWith('test-package')
       })
 
-      // After loading, 1.5.0 should appear in the results
+      // After loading, 3.4.0 should appear as an auto-expanded child of the latest tag
       await vi.waitFor(() => {
         const versionLinks = component
           .findAll('a')
           .filter(
             a => !a.attributes('href')?.startsWith('#') && a.attributes('target') !== '_blank',
           )
         const versions = versionLinks.map(l => l.text())
-        expect(versions).toContain('1.5.0')
+        expect(versions).toContain('3.4.0')
       })
     })
 
