diff --git a/web/e2e/publish-flow-ui.spec.ts b/web/e2e/publish-flow-ui.spec.ts
index 867c8248..d1e325ce 100644
--- a/web/e2e/publish-flow-ui.spec.ts
+++ b/web/e2e/publish-flow-ui.spec.ts
@@ -35,7 +35,7 @@ test.describe('Publish Flow UI (Real API)', () => {
       const namespaceTrigger = page.locator('#namespace')
       await expect(namespaceTrigger).toBeVisible()
       await namespaceTrigger.click()
-      const namespaceOption = page.getByRole('option', {
+      const namespaceOption = page.getByRole('dialog').getByRole('button', {
         name: new RegExp(`\\(@${namespace.slug}\\)`),
       }).first()
       await expect(namespaceOption).toBeVisible()
diff --git a/web/src/pages/dashboard/publish.tsx b/web/src/pages/dashboard/publish.tsx
index c921b5e1..2fc2d8d5 100644
--- a/web/src/pages/dashboard/publish.tsx
+++ b/web/src/pages/dashboard/publish.tsx
@@ -163,8 +163,9 @@ export function PublishPage() {
 
       <Card className="p-8 space-y-8">
         <div className="space-y-3">
-          <Label className="text-sm font-semibold font-heading">{t('publish.namespace')}</Label>
+          <Label htmlFor="namespace" className="text-sm font-semibold font-heading">{t('publish.namespace')}</Label>
           <NamespacePicker
+            id="namespace"
             value={namespaceSlug}
             onValueChange={setNamespaceSlug}
             status="ACTIVE"
diff --git a/web/src/shared/components/namespace-picker.test.tsx b/web/src/shared/components/namespace-picker.test.tsx
index ea89e20a..c9e317cb 100644
--- a/web/src/shared/components/namespace-picker.test.tsx
+++ b/web/src/shared/components/namespace-picker.test.tsx
@@ -79,6 +79,14 @@ describe('NamespacePicker', () => {
     }, true)
   })
 
+  it('forwards the trigger id for labels and stable form selectors', () => {
+    render(<NamespacePicker id="namespace" value="" onValueChange={vi.fn()} />)
+
+    expect(document.getElementById('namespace')).toBe(
+      screen.getByRole('button', { name: 'namespacePicker.placeholder' }),
+    )
+  })
+
   it('paginates bounded results and emits the selected slug', () => {
     const onValueChange = vi.fn()
     render(<NamespacePicker value="selected-outside-page" onValueChange={onValueChange} />)
diff --git a/web/src/shared/components/namespace-picker.tsx b/web/src/shared/components/namespace-picker.tsx
index e8a7007c..ab918629 100644
--- a/web/src/shared/components/namespace-picker.tsx
+++ b/web/src/shared/components/namespace-picker.tsx
@@ -16,6 +16,7 @@ import { useMyNamespacesPage } from '@/shared/hooks/use-namespace-queries'
 const PAGE_SIZE = 20
 
 interface NamespacePickerProps {
+  id?: string
   value: string
   onValueChange: (slug: string) => void
   status?: 'ACTIVE' | 'FROZEN' | 'ARCHIVED'
@@ -27,6 +28,7 @@ interface NamespacePickerProps {
  * Server-paged namespace selector that keeps request and render size bounded.
  */
 export function NamespacePicker({
+  id,
   value,
   onValueChange,
   status,
@@ -58,7 +60,7 @@ export function NamespacePicker({
   return (
     <Dialog open={open} onOpenChange={setOpen}>
       <DialogTrigger asChild>
-        <Button type="button" variant="outline" disabled={disabled} className="w-full justify-start">
+        <Button id={id} type="button" variant="outline" disabled={disabled} className="w-full justify-start">
           {value ? `@${value}` : emptyValueLabel ?? t('namespacePicker.placeholder')}
         </Button>
       </DialogTrigger>