feat: new routing schema - updated cache routes, docs and tests

Author: mikouaji

docs/content/2.guide/1.features.md

@@ -92,19 +92,19 @@ Quick access to online development environments detected from package READMEs:
 
 ### Custom badges
 
-You can add custom npmx badges to your markdown files using the following syntax: `[![Open on npmx.dev](https://npmx.dev/api/registry/badge/YOUR_PACKAGE)](https://npmx.dev/YOUR_PACKAGE)`
+You can add custom npmx badges to your markdown files using the following syntax: `[![Open on npmx.dev](https://npmx.dev/api/registry/badge/YOUR_PACKAGE)](https://npmx.dev/package/YOUR_PACKAGE)`
 
 Do not forget to replace `YOUR_PACKAGE` with the actual package name.
 
 Here are some examples:
 
 ```
 # Default
-[![Open on npmx.dev](https://npmx.dev/api/registry/badge/nuxt)](https://npmx.dev/nuxt)
+[![Open on npmx.dev](https://npmx.dev/api/registry/badge/nuxt)](https://npmx.dev/package/nuxt)
 
 # Organization packages
-[![Open on npmx.dev](https://npmx.dev/api/registry/badge/@nuxt/kit)](https://npmx.dev/@nuxt/kit)
+[![Open on npmx.dev](https://npmx.dev/api/registry/badge/@nuxt/kit)](https://npmx.dev/package/@nuxt/kit)
 
 # Version-specific badges
-[![Open on npmx.dev](https://npmx.dev/api/registry/badge/nuxt/v/3.12.0)](https://npmx.dev/nuxt/v/3.12.0)
+[![Open on npmx.dev](https://npmx.dev/api/registry/badge/nuxt/v/3.12.0)](https://npmx.dev/package/nuxt/v/3.12.0)
 ```

nuxt.config.ts

@@ -99,9 +99,9 @@ export default defineNuxtConfig({
     '/search': { isr: false, cache: false },
     '/api/auth/**': { isr: false, cache: false },
     // infinite cache (versioned - doesn't change)
-    '/code/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
-    '/docs/:pkg/v/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
-    '/docs/:scope/:pkg/v/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
+    '/package-code/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
+    '/package-docs/:pkg/v/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
+    '/package-docs/:scope/:pkg/v/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
     '/api/registry/docs/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
     '/api/registry/file/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },
     '/api/registry/files/**': { isr: true, cache: { maxAge: 365 * 24 * 60 * 60 } },

test/e2e/create-command.spec.ts

@@ -6,7 +6,7 @@ test.describe('Create Command', () => {
 
   test.describe('Visibility', () => {
     test('/vite - should show create command (same maintainers)', async ({ page, goto }) => {
-      await goto('/vite', { waitUntil: 'domcontentloaded' })
+      await goto('/package/vite', { waitUntil: 'domcontentloaded' })
 
       // Create command section should be visible (SSR)
       // Use specific container to avoid matching README code blocks
@@ -15,14 +15,14 @@ test.describe('Create Command', () => {
       await expect(createCommandSection.locator('code')).toContainText(/create vite/i)
 
       // Link to create-vite should be present (uses sr-only text, so check attachment not visibility)
-      await expect(page.locator('a[href="/create-vite"]').first()).toBeAttached()
+      await expect(page.locator('a[href="/package/create-vite"]').first()).toBeAttached()
     })
 
     test('/next - should show create command (shared maintainer, same repo)', async ({
       page,
       goto,
     }) => {
-      await goto('/next', { waitUntil: 'domcontentloaded' })
+      await goto('/package/next', { waitUntil: 'domcontentloaded' })
 
       // Create command section should be visible (SSR)
       // Use specific container to avoid matching README code blocks
@@ -31,14 +31,14 @@ test.describe('Create Command', () => {
       await expect(createCommandSection.locator('code')).toContainText(/create next-app/i)
 
       // Link to create-next-app should be present (uses sr-only text, so check attachment not visibility)
-      await expect(page.locator('a[href="/create-next-app"]').first()).toBeAttached()
+      await expect(page.locator('a[href="/package/create-next-app"]').first()).toBeAttached()
     })
 
     test('/nuxt - should show create command (same maintainer, same org)', async ({
       page,
       goto,
     }) => {
-      await goto('/nuxt', { waitUntil: 'domcontentloaded' })
+      await goto('/package/nuxt', { waitUntil: 'domcontentloaded' })
 
       // Create command section should be visible (SSR)
       // nuxt has create-nuxt package, so command is "npm create nuxt"
@@ -52,7 +52,7 @@ test.describe('Create Command', () => {
       page,
       goto,
     }) => {
-      await goto('/color', { waitUntil: 'domcontentloaded' })
+      await goto('/package/color', { waitUntil: 'domcontentloaded' })
 
       // Wait for package to load
       await expect(page.locator('h1').filter({ hasText: 'color' })).toBeVisible()
@@ -67,7 +67,7 @@ test.describe('Create Command', () => {
       page,
       goto,
     }) => {
-      await goto('/lodash', { waitUntil: 'domcontentloaded' })
+      await goto('/package/lodash', { waitUntil: 'domcontentloaded' })
 
       // Wait for package to load
       await expect(page.locator('h1').filter({ hasText: 'lodash' })).toBeVisible()
@@ -81,7 +81,7 @@ test.describe('Create Command', () => {
 
   test.describe('Copy Functionality', () => {
     test('hovering create command shows copy button', async ({ page, goto }) => {
-      await goto('/vite', { waitUntil: 'hydration' })
+      await goto('/package/vite', { waitUntil: 'hydration' })
 
       await expect(page.locator('h1')).toContainText('vite', { timeout: 15000 })
 
@@ -112,7 +112,7 @@ test.describe('Create Command', () => {
       // Grant clipboard permissions
       await context.grantPermissions(['clipboard-read', 'clipboard-write'])
 
-      await goto('/vite', { waitUntil: 'hydration' })
+      await goto('/package/vite', { waitUntil: 'hydration' })
       await expect(page.locator('h1')).toContainText('vite', { timeout: 15000 })
 
       await expect(page.locator('main header').locator('text=/v\\d+\\.\\d+/')).toBeVisible({
@@ -142,7 +142,7 @@ test.describe('Create Command', () => {
 
   test.describe('Install Command Copy', () => {
     test('hovering install command shows copy button', async ({ page, goto }) => {
-      await goto('/lodash', { waitUntil: 'hydration' })
+      await goto('/package/lodash', { waitUntil: 'hydration' })
 
       // Find the install command container
       const installCommandContainer = page.locator('.group\\/installcmd').first()
@@ -167,7 +167,7 @@ test.describe('Create Command', () => {
       // Grant clipboard permissions
       await context.grantPermissions(['clipboard-read', 'clipboard-write'])
 
-      await goto('/lodash', { waitUntil: 'hydration' })
+      await goto('/package/lodash', { waitUntil: 'hydration' })
 
       // Find and hover over the install command container
       const installCommandContainer = page.locator('.group\\/installcmd').first()

test/e2e/docs.spec.ts

@@ -3,7 +3,7 @@ import { expect, test } from '@nuxt/test-utils/playwright'
 test.describe('API Documentation Pages', () => {
   test('docs page loads and shows content for a package', async ({ page, goto }) => {
     // Use a small, stable package with TypeScript types
-    await goto('/docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
+    await goto('/package-docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
 
     // Page title should include package name
     await expect(page).toHaveTitle(/ufo.*docs/i)
@@ -24,7 +24,7 @@ test.describe('API Documentation Pages', () => {
   })
 
   test('docs page shows TOC sidebar on desktop', async ({ page, goto }) => {
-    await goto('/docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
+    await goto('/package-docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
 
     // TOC sidebar should be visible (on desktop viewport)
     const tocSidebar = page.locator('aside')
@@ -38,7 +38,7 @@ test.describe('API Documentation Pages', () => {
   })
 
   test('TOC links navigate to sections', async ({ page, goto }) => {
-    await goto('/docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
+    await goto('/package-docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
 
     // Click on Functions in TOC
     const functionsLink = page.locator('aside a[href="#section-function"]')
@@ -53,7 +53,7 @@ test.describe('API Documentation Pages', () => {
   })
 
   test('clicking symbol name scrolls to symbol', async ({ page, goto }) => {
-    await goto('/docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
+    await goto('/package-docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
 
     // Find a symbol link in the TOC
     const symbolLink = page.locator('aside a[href^="#function-"]').first()
@@ -67,14 +67,14 @@ test.describe('API Documentation Pages', () => {
   })
 
   test('docs page without version redirects to latest', async ({ page, goto }) => {
-    await goto('/docs/ufo', { waitUntil: 'networkidle' })
+    await goto('/package-docs/ufo', { waitUntil: 'networkidle' })
 
     // Should redirect to include version
     await expect(page).toHaveURL(/\/docs\/ufo\/v\//)
   })
 
   test('package link in header navigates to package page', async ({ page, goto }) => {
-    await goto('/docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
+    await goto('/package-docs/ufo/v/1.6.3', { waitUntil: 'networkidle' })
 
     // Click on package name in header
     const packageLink = page.locator('header a').filter({ hasText: 'ufo' })
@@ -87,7 +87,7 @@ test.describe('API Documentation Pages', () => {
   test('docs page handles package gracefully when types unavailable', async ({ page, goto }) => {
     // Use a simple JS package - the page should load without crashing
     // regardless of whether it has types or shows an error state
-    await goto('/docs/is-odd/v/3.0.1', { waitUntil: 'networkidle' })
+    await goto('/package-docs/is-odd/v/3.0.1', { waitUntil: 'networkidle' })
 
     // Header should always show the package name
     await expect(page.locator('header').getByText('is-odd')).toBeVisible()
@@ -105,7 +105,7 @@ test.describe('API Documentation Pages', () => {
 
 test.describe('Version Selector', () => {
   test('version selector dropdown shows versions', async ({ page, goto }) => {
-    await goto('/docs/ufo/v/1.6.3', { waitUntil: 'hydration' })
+    await goto('/package-docs/ufo/v/1.6.3', { waitUntil: 'hydration' })
 
     // Find and click the version selector button (wait for it to be visible)
     const versionButton = page.locator('header button').filter({ hasText: '1.6.3' })
@@ -123,7 +123,7 @@ test.describe('Version Selector', () => {
   })
 
   test('selecting a version navigates to that version', async ({ page, goto }) => {
-    await goto('/docs/ufo/v/1.6.3', { waitUntil: 'hydration' })
+    await goto('/package-docs/ufo/v/1.6.3', { waitUntil: 'hydration' })
 
     // Find and click the version selector button (wait for it to be visible)
     const versionButton = page.locator('header button').filter({ hasText: '1.6.3' })
@@ -132,7 +132,7 @@ test.describe('Version Selector', () => {
     await versionButton.click()
 
     // Find a version link that's not the current version by checking the href
-    const versionLinks = page.locator('[role="option"] a[href*="/docs/ufo/v/"]')
+    const versionLinks = page.locator('[role="option"] a[href*="/package-docs/ufo/v/"]')
     const count = await versionLinks.count()
 
     // Find first link that doesn't point to 1.6.3
@@ -157,7 +157,7 @@ test.describe('Version Selector', () => {
   })
 
   test('escape key closes version dropdown', async ({ page, goto }) => {
-    await goto('/docs/ufo/v/1.6.3', { waitUntil: 'hydration' })
+    await goto('/package-docs/ufo/v/1.6.3', { waitUntil: 'hydration' })
 
     // Wait for version button to be visible
     const versionButton = page.locator('header button').filter({ hasText: '1.6.3' })

test/e2e/interactions.spec.ts

@@ -21,9 +21,9 @@ test.describe('Search Pages', () => {
     await page.keyboard.press('ArrowUp')
 
     // Enter navigates to the selected result
-    // URL is /vue not /package/vue (cleaner URLs)
+    // URL is /package/vue not /vue
     await page.keyboard.press('Enter')
-    await expect(page).toHaveURL(/\/vue/)
+    await expect(page).toHaveURL(/\/package\/vue/)
   })
 
   test('/search?q=vue → "/" focuses the search input from results', async ({ page, goto }) => {
@@ -109,7 +109,7 @@ test.describe('Keyboard Shortcuts', () => {
     page,
     goto,
   }) => {
-    await goto('/vue', { waitUntil: 'hydration' })
+    await goto('/package/vue', { waitUntil: 'hydration' })
 
     await page.keyboard.press('c')
 
@@ -136,7 +136,7 @@ test.describe('Keyboard Shortcuts', () => {
     page,
     goto,
   }) => {
-    await goto('/vue', { waitUntil: 'hydration' })
+    await goto('/package/vue', { waitUntil: 'hydration' })
 
     await page.keyboard.press('Shift+c')
     await expect(page).toHaveURL(/\/vue/)

test/e2e/package-manager-select.spec.ts

@@ -2,7 +2,7 @@ import { expect, test } from '@nuxt/test-utils/playwright'
 
 test.describe('Package Page', () => {
   test('/vue → package manager select dropdown works', async ({ page, goto }) => {
-    await goto('/vue', { waitUntil: 'hydration' })
+    await goto('/package/vue', { waitUntil: 'hydration' })
 
     await expect(page.locator('h1')).toContainText('vue', { timeout: 15000 })
 

test/nuxt/a11y.spec.ts

@@ -626,7 +626,7 @@ describe('component accessibility audits', () => {
         props: {
           tree: mockTree,
           currentPath: '',
-          baseUrl: '/code/vue',
+          baseUrl: '/package-code/vue',
         },
       })
       const results = await runAxe(component)
@@ -638,7 +638,7 @@ describe('component accessibility audits', () => {
         props: {
           tree: mockTree,
           currentPath: 'src',
-          baseUrl: '/code/vue',
+          baseUrl: '/package-code/vue',
         },
       })
       const results = await runAxe(component)
@@ -662,7 +662,7 @@ describe('component accessibility audits', () => {
         props: {
           tree: mockTree,
           currentPath: '',
-          baseUrl: '/code/vue',
+          baseUrl: '/package-code/vue',
         },
       })
       const results = await runAxe(component)
@@ -674,7 +674,7 @@ describe('component accessibility audits', () => {
         props: {
           tree: mockTree,
           currentPath: 'src/index.ts',
-          baseUrl: '/code/vue',
+          baseUrl: '/package-code/vue',
         },
       })
       const results = await runAxe(component)
@@ -889,7 +889,7 @@ describe('component accessibility audits', () => {
         props: {
           tree: mockTree,
           currentPath: '',
-          baseUrl: '/code/vue',
+          baseUrl: '/package-code/vue',
         },
       })
       const results = await runAxe(component)
@@ -1766,7 +1766,7 @@ describe('component accessibility audits', () => {
           currentVersion: '3.5.0',
           versions: mockVersions,
           distTags: mockDistTags,
-          urlPattern: '/vue/v/{version}',
+          urlPattern: '/package/vue/v/{version}',
         },
       })
       const results = await runAxe(component)
@@ -1780,7 +1780,7 @@ describe('component accessibility audits', () => {
           currentVersion: '3.4.0',
           versions: mockVersions,
           distTags: mockDistTags,
-          urlPattern: '/vue/v/{version}',
+          urlPattern: '/package/vue/v/{version}',
         },
       })
       const results = await runAxe(component)