fix: suppress UA focus-visible outline on selected Vue nodes

Adds focus:outline-none focus-visible:outline-none scoped to the
selected-state class on the LGraphNode root, so a selected node never
gains a second, browser-default focus ring on top of the existing
selection overlay (the bug captured by the regression test in #11814).

The suppression is intentionally scoped to isSelected only — unselected
but Tab-focused nodes still get the UA focus ring for keyboard a11y.

Removes the test.fail annotation from the regression test; with this
fix in place the post-shift screenshot matches the no-shift baseline
byte-for-byte and the test passes naturally as a positive guard.

browser_tests/assets/nodes/single_note.json

@@ -0,0 +1,24 @@
+{
+  "last_node_id": 1,
+  "last_link_id": 0,
+  "nodes": [
+    {
+      "id": 1,
+      "type": "Note",
+      "pos": [200, 200],
+      "size": [240, 100],
+      "flags": {},
+      "order": 0,
+      "mode": 0,
+      "inputs": [],
+      "outputs": [],
+      "properties": {},
+      "widgets_values": ["Selected"]
+    }
+  ],
+  "links": [],
+  "groups": [],
+  "config": {},
+  "extra": {},
+  "version": 0.4
+}

browser_tests/tests/vueNodes/nodeStates/outline.spec.ts

@@ -0,0 +1,42 @@
+import {
+  comfyExpect as expect,
+  comfyPageFixture as test
+} from '@e2e/fixtures/ComfyPage'
+
+test.describe(
+  'Vue Node selection outline',
+  { tag: ['@vue-nodes', '@screenshot'] },
+  () => {
+    test('does not gain an extra focus outline when Shift is held on a selected node', async ({
+      comfyPage
+    }) => {
+      test.info().annotations.push({
+        type: 'regression',
+        description:
+          'Chromium paints a UA :focus-visible outline on a focused element after a bare Shift keypress; the LGraphNode root has tabindex="0", so a selected Vue node would otherwise gain a second outline. The selected-state class adds focus-visible:outline-none on the node root to suppress the UA outline, while leaving the focus ring intact for unselected (Tab-focused) nodes for keyboard a11y.'
+      })
+
+      await comfyPage.workflow.loadWorkflow('nodes/single_note')
+
+      const note = comfyPage.vueNodes.getNodeByTitle('Note').first()
+      await note.locator('.lg-node-header').click()
+      await expect(note).toHaveClass(/outline-node-component-outline/)
+
+      const box = await note.boundingBox()
+      if (!box) throw new Error('Node bounding box not available')
+      const PAD = 16
+      const clip = {
+        x: Math.max(0, Math.floor(box.x - PAD)),
+        y: Math.max(0, Math.floor(box.y - PAD)),
+        width: Math.ceil(box.width + PAD * 2),
+        height: Math.ceil(box.height + PAD * 2)
+      }
+
+      await comfyPage.page.keyboard.down('Shift')
+      await expect(comfyPage.page).toHaveScreenshot(
+        'vue-node-shift-focus-outline.png',
+        { clip }
+      )
+    })
+  }
+)

src/renderer/extensions/vueNodes/components/LGraphNode.vue

@@ -17,7 +17,8 @@
           ? 'h-(--node-height)'
           : 'min-h-(--node-height) min-w-(--min-node-width)',
         cursorClass,
-        isSelected && 'outline-node-component-outline',
+        isSelected &&
+          'outline-node-component-outline focus:outline-none focus-visible:outline-none',
         executing && 'outline-node-stroke-executing',
         shouldHandleNodePointerEvents &&
           !nodeData.flags?.ghost &&