fix: replace package manager tab spec with select

Author: jonathanyeong

tests/package-manager-select.spec.ts

@@ -0,0 +1,33 @@
+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: 'domcontentloaded' })
+
+    const packageManagerButton = page.locator('button[aria-haspopup="listbox"]').first()
+    await expect(packageManagerButton).toBeVisible()
+
+    // Open dropdown
+    await packageManagerButton.click()
+    const packageManagerDropdown = page.locator('[role="listbox"]')
+    await expect(packageManagerDropdown).toBeVisible()
+
+    // Arrow keys navigate the listbox
+    await packageManagerButton.press('ArrowDown')
+    const firstDescendant = await packageManagerDropdown.getAttribute('aria-activedescendant')
+    await packageManagerButton.press('ArrowDown')
+    const secondDescendant = await packageManagerDropdown.getAttribute('aria-activedescendant')
+    expect(secondDescendant).not.toBe(firstDescendant)
+
+    // Escape closes dropdown and returns focus
+    await packageManagerButton.press('Escape')
+    await expect(packageManagerDropdown).not.toBeVisible()
+    await expect(packageManagerButton).toBeFocused()
+
+    // Enter selects option and closes dropdown
+    await packageManagerButton.click()
+    await packageManagerButton.press('ArrowDown')
+    await packageManagerButton.press('Enter')
+    await expect(packageManagerDropdown).not.toBeVisible()
+  })
+})