From fcb0a1080fa7af98bacdbaefe4418a769c7fc629 Mon Sep 17 00:00:00 2001
From: Robin Pyon <robin.pyon@gmail.com>
Date: Wed, 6 Dec 2023 16:16:43 +0000
Subject: [PATCH] test: add test ids to PTE toolbar component, fix failing ct
 test

---
 .../formBuilder/inputs/PortableText/Toolbar.spec.tsx   |  6 ++----
 .../form/inputs/PortableText/toolbar/ActionMenu.tsx    |  8 +++++++-
 .../form/inputs/PortableText/toolbar/InsertMenu.tsx    | 10 ++++++----
 .../components/list/CommentsListItemContextMenu.tsx    |  9 +--------
 .../src/ui/contextMenuButton/ContextMenuButton.tsx     |  1 -
 5 files changed, 16 insertions(+), 18 deletions(-)

diff --git a/packages/sanity/playwright-ct/tests/formBuilder/inputs/PortableText/Toolbar.spec.tsx b/packages/sanity/playwright-ct/tests/formBuilder/inputs/PortableText/Toolbar.spec.tsx
index 324e9c47958..df85b85f903 100644
--- a/packages/sanity/playwright-ct/tests/formBuilder/inputs/PortableText/Toolbar.spec.tsx
+++ b/packages/sanity/playwright-ct/tests/formBuilder/inputs/PortableText/Toolbar.spec.tsx
@@ -17,11 +17,9 @@ test.describe('Portable Text Input', () => {
         // Adjust the viewport size to make the Inline Object button hidden
         await page.setViewportSize({width: 800, height: 1000})
 
-        const $contextMenuButton = $portableTextInput
-          .getByRole('button')
-          .locator('[data-sanity-icon="add"]')
+        const $contextMenuButton = $portableTextInput.getByTestId('insert-menu-button')
 
-        // Assertion: Check if the Add + button is showing
+        // Assertion: Check if the context menu button is showing
         await expect($contextMenuButton).toBeVisible()
 
         // Assertion: Check if the Inline Object button is now hidden
diff --git a/packages/sanity/src/core/form/inputs/PortableText/toolbar/ActionMenu.tsx b/packages/sanity/src/core/form/inputs/PortableText/toolbar/ActionMenu.tsx
index f8b5d4a08e1..74aa31d05a9 100644
--- a/packages/sanity/src/core/form/inputs/PortableText/toolbar/ActionMenu.tsx
+++ b/packages/sanity/src/core/form/inputs/PortableText/toolbar/ActionMenu.tsx
@@ -7,6 +7,8 @@ import {
   usePortableTextEditorSelection,
 } from '@sanity/portable-text-editor'
 import {isKeySegment} from '@sanity/types'
+import {useTranslation} from 'react-i18next'
+import {ContextMenuButton} from '../../../../../ui/contextMenuButton'
 import {CollapseMenu, CollapseMenuButton} from '../../../../components/collapseMenu'
 import {ContextMenuButton} from '../../../../../ui/contextMenuButton'
 import {PTEToolbarAction, PTEToolbarActionGroup} from './types'
@@ -122,7 +124,11 @@ export const ActionMenu = memo(function ActionMenu(props: ActionMenuProps) {
   const menuButtonProps = useMemo(
     () => ({
       button: (
-        <ContextMenuButton disabled={disabled} tooltipProps={{placement: tooltipPlacement}} />
+        <ContextMenuButton
+          data-testid="action-menu-button"
+          disabled={disabled}
+          tooltipProps={{placement: tooltipPlacement}}
+        />
       ),
       popover: MENU_POPOVER_PROPS,
     }),
diff --git a/packages/sanity/src/core/form/inputs/PortableText/toolbar/InsertMenu.tsx b/packages/sanity/src/core/form/inputs/PortableText/toolbar/InsertMenu.tsx
index f0faafc3ae0..ae2857a7e57 100644
--- a/packages/sanity/src/core/form/inputs/PortableText/toolbar/InsertMenu.tsx
+++ b/packages/sanity/src/core/form/inputs/PortableText/toolbar/InsertMenu.tsx
@@ -1,14 +1,12 @@
 import React, {memo, useCallback, useMemo} from 'react'
-import {AddIcon} from '@sanity/icons'
 import {PopoverProps} from '@sanity/ui'
 import {PortableTextEditor, usePortableTextEditor} from '@sanity/portable-text-editor'
 import {upperFirst} from 'lodash'
+import {ContextMenuButton} from '../../../../../ui/contextMenuButton'
 import {useTranslation} from '../../../../i18n'
 import {CollapseMenu, CollapseMenuButton} from '../../../../components/collapseMenu'
-import {Button} from '../../../../../ui'
 import {BlockItem} from './types'
 import {useFocusBlock} from './hooks'
-import {ContextMenuButton} from '../../../../../ui/contextMenuButton'
 
 const CollapseMenuMemo = memo(CollapseMenu)
 
@@ -73,7 +71,11 @@ export const InsertMenu = memo(function InsertMenu(props: InsertMenuProps) {
   const menuButtonProps = useMemo(
     () => ({
       button: (
-        <ContextMenuButton disabled={disabled} tooltipProps={{placement: tooltipPlacement}} />
+        <ContextMenuButton
+          data-testid="insert-menu-button"
+          disabled={disabled}
+          tooltipProps={{placement: tooltipPlacement}}
+        />
       ),
       popover: MENU_POPOVER_PROPS,
     }),
diff --git a/packages/sanity/src/desk/comments/src/components/list/CommentsListItemContextMenu.tsx b/packages/sanity/src/desk/comments/src/components/list/CommentsListItemContextMenu.tsx
index 92ba06a45a8..99b8bb47059 100644
--- a/packages/sanity/src/desk/comments/src/components/list/CommentsListItemContextMenu.tsx
+++ b/packages/sanity/src/desk/comments/src/components/list/CommentsListItemContextMenu.tsx
@@ -1,12 +1,5 @@
 import React from 'react'
-import {
-  CheckmarkCircleIcon,
-  UndoIcon,
-  EllipsisHorizontalIcon,
-  EditIcon,
-  TrashIcon,
-  LinkIcon,
-} from '@sanity/icons'
+import {CheckmarkCircleIcon, UndoIcon, EditIcon, TrashIcon, LinkIcon} from '@sanity/icons'
 import {
   MenuButtonProps,
   TooltipDelayGroupProvider,
diff --git a/packages/sanity/src/ui/contextMenuButton/ContextMenuButton.tsx b/packages/sanity/src/ui/contextMenuButton/ContextMenuButton.tsx
index a7a25c95de5..11b2e83309e 100644
--- a/packages/sanity/src/ui/contextMenuButton/ContextMenuButton.tsx
+++ b/packages/sanity/src/ui/contextMenuButton/ContextMenuButton.tsx
@@ -1,4 +1,3 @@
-/* eslint-disable no-restricted-imports */
 import {EllipsisHorizontalIcon} from '@sanity/icons'
 import React, {HTMLProps, forwardRef} from 'react'
 import {Button, ButtonProps} from '../button'