fix: left-align widget actions dropdown menu items

The button base variant includes justify-center, causing menu items in
the WidgetActions popover to be center-aligned. Add justify-start to
each menu button to override this and left-align options as expected.

Also adds e2e tests for the widget actions dropdown menu covering open,
alignment, visible actions, and close behavior.

browser_tests/tests/propertiesPanel/widgetActionsMenu.spec.ts

@@ -0,0 +1,79 @@
+import { expect } from '@playwright/test'
+
+import { comfyPageFixture as test } from '@e2e/fixtures/ComfyPage'
+import { TestIds } from '@e2e/fixtures/selectors'
+import { PropertiesPanelHelper } from '@e2e/tests/propertiesPanel/PropertiesPanelHelper'
+
+test.describe('Properties panel - Widget actions menu', { tag: '@ui' }, () => {
+  let panel: PropertiesPanelHelper
+
+  test.beforeEach(async ({ comfyPage }) => {
+    panel = new PropertiesPanelHelper(comfyPage.page)
+    await comfyPage.actionbar.propertiesButton.click()
+    await expect(panel.root).toBeVisible()
+    await comfyPage.nodeOps.selectNodes(['KSampler'])
+  })
+
+  test('menu opens when clicking the more button', async ({ comfyPage }) => {
+    const moreButton = panel.root
+      .getByTestId(TestIds.subgraphEditor.widgetActionsMenuButton)
+      .first()
+    await expect(moreButton).toBeVisible()
+    await moreButton.click()
+
+    const menu = comfyPage.page.getByTestId(TestIds.menu.moreMenuContent)
+    await expect(menu).toBeVisible()
+    await expect(menu.getByText('Rename')).toBeVisible()
+  })
+
+  test('menu items are left-aligned', async ({ comfyPage }) => {
+    const moreButton = panel.root
+      .getByTestId(TestIds.subgraphEditor.widgetActionsMenuButton)
+      .first()
+    await moreButton.click()
+
+    const menu = comfyPage.page.getByTestId(TestIds.menu.moreMenuContent)
+    await expect(menu).toBeVisible()
+
+    const menuButtons = menu.getByRole('button')
+    const count = await menuButtons.count()
+    expect(count).toBeGreaterThan(0)
+
+    for (let i = 0; i < count; i++) {
+      const button = menuButtons.nth(i)
+      await expect
+        .poll(() =>
+          button.evaluate((el) => {
+            const style = getComputedStyle(el)
+            return style.justifyContent
+          })
+        )
+        .toBe('flex-start')
+    }
+  })
+
+  test('menu shows Rename and Favorite actions', async ({ comfyPage }) => {
+    const moreButton = panel.root
+      .getByTestId(TestIds.subgraphEditor.widgetActionsMenuButton)
+      .first()
+    await moreButton.click()
+
+    const menu = comfyPage.page.getByTestId(TestIds.menu.moreMenuContent)
+    await expect(menu).toBeVisible()
+    await expect(menu.getByText('Rename')).toBeVisible()
+    await expect(menu.getByText('Favorite')).toBeVisible()
+  })
+
+  test('menu closes after clicking an action', async ({ comfyPage }) => {
+    const moreButton = panel.root
+      .getByTestId(TestIds.subgraphEditor.widgetActionsMenuButton)
+      .first()
+    await moreButton.click()
+
+    const menu = comfyPage.page.getByTestId(TestIds.menu.moreMenuContent)
+    await expect(menu).toBeVisible()
+
+    await menu.getByText('Favorite').click()
+    await expect(menu).toBeHidden()
+  })
+})

src/components/rightSidePanel/parameters/WidgetActions.vue

@@ -124,7 +124,7 @@ function handleResetToDefault() {
       <Button
         variant="textonly"
         size="unset"
-        class="flex w-full items-center gap-2 rounded-sm px-3 py-2 text-sm transition-all active:scale-95"
+        class="flex w-full items-center justify-start gap-2 rounded-sm px-3 py-2 text-sm transition-all active:scale-95"
         @click="
           () => {
             handleRename()
@@ -140,7 +140,7 @@ function handleResetToDefault() {
         v-if="canToggleVisibility"
         variant="textonly"
         size="unset"
-        class="flex w-full items-center gap-2 rounded-sm px-3 py-2 text-sm transition-all active:scale-95"
+        class="flex w-full items-center justify-start gap-2 rounded-sm px-3 py-2 text-sm transition-all active:scale-95"
         @click="
           () => {
             if (isShownOnParents) handleHideInput()
@@ -162,7 +162,7 @@ function handleResetToDefault() {
       <Button
         variant="textonly"
         size="unset"
-        class="flex w-full items-center gap-2 rounded-sm px-3 py-2 text-sm transition-all active:scale-95"
+        class="flex w-full items-center justify-start gap-2 rounded-sm px-3 py-2 text-sm transition-all active:scale-95"
         @click="
           () => {
             handleToggleFavorite()
@@ -184,7 +184,7 @@ function handleResetToDefault() {
         v-if="hasDefault"
         variant="textonly"
         size="unset"
-        class="flex w-full items-center gap-2 rounded-sm px-3 py-2 text-sm transition-all active:scale-95"
+        class="flex w-full items-center justify-start gap-2 rounded-sm px-3 py-2 text-sm transition-all active:scale-95"
         :disabled="isCurrentValueDefault"
         @click="
           () => {