fix: load all versions when semver range filter is entered (#1828)

The semver filter only searched against the ~10 versions from the initial
SSR payload, so filtering for versions outside that set returned no
results. Now, entering a valid semver range triggers loading all versions
and auto-expands the "Other versions" section. A guard prevents redundant
fetches across subsequent filter changes.

Author: serhalp

app/components/Package/Versions.vue

@@ -115,6 +115,22 @@ const effectiveCurrentVersion = computed(
 
 // Semver range filter
 const semverFilter = ref('')
+
+// Load all versions when a valid semver filter is entered
+watch(semverFilter, async newFilter => {
+  const trimmed = newFilter.trim()
+  if (trimmed === '' || hasLoadedAll.value) return
+  if (!validRange(trimmed)) return
+
+  try {
+    const allVersions = await loadAllVersions()
+    processLoadedVersions(allVersions)
+    // Auto-expand "Other versions" so filtered results are visible
+    otherVersionsExpanded.value = true
+  } catch {
+    // Silently fail — user can still use the filter with already-known versions
+  }
+})
 // Collect all known versions: initial props + dynamically loaded ones
 const allKnownVersions = computed(() => {
   const versions = new Set(Object.keys(props.versions))

test/nuxt/components/PackageVersions.spec.ts

@@ -1127,6 +1127,101 @@ 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: '1.0.0', time: '2024-01-01T00:00:00.000Z', hasProvenance: false },
+      ])
+
+      // Only provide a subset of versions in props (simulating initial SSR payload)
+      const component = await mountSuspended(PackageVersions, {
+        props: {
+          packageName: 'test-package',
+          versions: {
+            '3.0.0': createVersion('3.0.0'),
+          },
+          distTags: { latest: '3.0.0' },
+          time: { '3.0.0': '2024-04-01T00:00:00.000Z' },
+        },
+      })
+
+      // Filter for a version NOT in the initial props
+      const input = component.find('input[type="text"]')
+      await input.setValue('1.5.0')
+
+      // Should trigger loading all versions
+      await vi.waitFor(() => {
+        expect(mockFetchAllPackageVersions).toHaveBeenCalledWith('test-package')
+      })
+
+      // After loading, 1.5.0 should appear in the results
+      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')
+      })
+    })
+
+    it('does not load all versions for invalid semver filter', async () => {
+      const component = await mountSuspended(PackageVersions, {
+        props: {
+          packageName: 'test-package',
+          versions: {
+            '3.0.0': createVersion('3.0.0'),
+          },
+          distTags: { latest: '3.0.0' },
+          time: { '3.0.0': '2024-04-01T00:00:00.000Z' },
+        },
+      })
+
+      const input = component.find('input[type="text"]')
+      await input.setValue('not-a-range!!!')
+
+      // Should NOT trigger loading
+      expect(mockFetchAllPackageVersions).not.toHaveBeenCalled()
+    })
+
+    it('only fetches versions once across multiple filter changes', async () => {
+      mockFetchAllPackageVersions.mockResolvedValue([
+        { version: '3.0.0', time: '2024-04-01T00:00:00.000Z', hasProvenance: false },
+        { version: '2.0.0', time: '2024-02-01T00:00:00.000Z', hasProvenance: false },
+        { version: '1.0.0', time: '2024-01-01T00:00:00.000Z', hasProvenance: false },
+      ])
+
+      const component = await mountSuspended(PackageVersions, {
+        props: {
+          packageName: 'test-package',
+          versions: {
+            '3.0.0': createVersion('3.0.0'),
+          },
+          distTags: { latest: '3.0.0' },
+          time: { '3.0.0': '2024-04-01T00:00:00.000Z' },
+        },
+      })
+
+      const input = component.find('input[type="text"]')
+
+      // First valid filter triggers fetch
+      await input.setValue('^1.0.0')
+      await vi.waitFor(() => {
+        expect(mockFetchAllPackageVersions).toHaveBeenCalledTimes(1)
+      })
+
+      // Subsequent filter changes should NOT fetch again
+      await input.setValue('^2.0.0')
+      await input.setValue('~3.0.0')
+      await input.setValue('>=1.0.0')
+
+      expect(mockFetchAllPackageVersions).toHaveBeenCalledTimes(1)
+    })
+
     it('filters other major version groups', async () => {
       mockFetchAllPackageVersions.mockResolvedValue([
         { version: '3.0.0', time: '2024-04-01T00:00:00.000Z', hasProvenance: false },