diff --git a/examples/user_profile_examples/public/tooltip_demo.tsx b/examples/user_profile_examples/public/tooltip_demo.tsx index 6cd371810c0bf..af1ca0cbb9534 100644 --- a/examples/user_profile_examples/public/tooltip_demo.tsx +++ b/examples/user_profile_examples/public/tooltip_demo.tsx @@ -41,12 +41,7 @@ export const ToolTipDemo: FunctionComponent = () => { } username={ - + {userProfile.user.full_name} } diff --git a/package.json b/package.json index 200fe8c65661e..b7fe63b65a825 100644 --- a/package.json +++ b/package.json @@ -145,7 +145,7 @@ "@elastic/elasticsearch": "9.3.4", "@elastic/ems-client": "8.7.0", "@elastic/esql": "3.0.0", - "@elastic/eui": "114.3.0", + "@elastic/eui": "115.0.0", "@elastic/eui-theme-borealis": "7.0.0", "@elastic/filesaver": "1.1.2", "@elastic/kibana-d3-color": "npm:@elastic/kibana-d3-color@2.0.1", @@ -1605,7 +1605,7 @@ "@cypress/debugging-proxy": "2.0.1", "@cypress/grep": "5.1.0", "@cypress/webpack-preprocessor": "6.0.2", - "@elastic/eslint-plugin-eui": "2.11.1", + "@elastic/eslint-plugin-eui": "2.12.0", "@elastic/makelogs": "6.1.1", "@emotion/babel-preset-css-prop": "11.11.0", "@emotion/jest": "11.11.0", diff --git a/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_action_button.tsx b/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_action_button.tsx index 19eabae1525ad..ab76166881a89 100644 --- a/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_action_button.tsx +++ b/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_action_button.tsx @@ -151,7 +151,7 @@ export const AppMenuActionButton = (props: AppMenuActionButtonProps) => { */ const button = showTooltip && !hasSplitItems ? ( - + {buttonComponent} ) : ( diff --git a/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_item.tsx b/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_item.tsx index 252fbbf23c7cf..3b338425b27b6 100644 --- a/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_item.tsx +++ b/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_item.tsx @@ -111,7 +111,7 @@ export const AppMenuItem = ({ */ const button = showTooltip && !hasItems ? ( - + {buttonComponent} ) : ( diff --git a/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_popover.tsx b/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_popover.tsx index 1abd66f0fe534..6518537eb5578 100644 --- a/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_popover.tsx +++ b/src/core/packages/chrome/app-menu/core-chrome-app-menu-components/src/components/app_menu_popover.tsx @@ -73,7 +73,7 @@ export const AppMenuPopover = ({ const showTooltip = Boolean(content || title); const button = showTooltip ? ( - + {anchorElement} ) : ( diff --git a/src/platform/kbn-ui/side-navigation/src/__tests__/both_modes.test.tsx b/src/platform/kbn-ui/side-navigation/src/__tests__/both_modes.test.tsx index a6d9f340902b1..62691b476bf59 100644 --- a/src/platform/kbn-ui/side-navigation/src/__tests__/both_modes.test.tsx +++ b/src/platform/kbn-ui/side-navigation/src/__tests__/both_modes.test.tsx @@ -787,38 +787,6 @@ describe('Both modes', () => { expect(integrationsLink).toHaveAttribute('data-highlighted', 'true'); }); - /** - * GIVEN there are footer items - * WHEN I hover over a footer item - * THEN a tooltip appears with the item label - * AND when I click on the trigger - * AND then I hover out - * THEN the tooltip disappears - */ - it('should display a tooltip with the item label on hover, and hide on hover out', async () => { - render(); - - const developerToolsLink = screen.getByTestId(footerItemId('developer_tools')); - - await user.hover(developerToolsLink); - flushPopoverTimers(); - - const tooltip = await screen.findByRole('tooltip', { - name: 'Developer tools', - }); - - expect(tooltip).toBeInTheDocument(); - - await user.click(developerToolsLink); - await user.unhover(developerToolsLink); - - // Even after clicking on the trigger which makes the `EuiToolTip` persistent by default - // See: https://eui.elastic.co/docs/components/display/tooltip/ - await waitFor(() => { - expect(tooltip).not.toBeInTheDocument(); - }); - }); - it('should switch popover when hovering from one item to another', async () => { const customNavItems = { ...basicMock.navItems, diff --git a/src/platform/kbn-ui/side-navigation/src/__tests__/collapsed_mode.test.tsx b/src/platform/kbn-ui/side-navigation/src/__tests__/collapsed_mode.test.tsx index da2e9f065f029..b65bada46fe70 100644 --- a/src/platform/kbn-ui/side-navigation/src/__tests__/collapsed_mode.test.tsx +++ b/src/platform/kbn-ui/side-navigation/src/__tests__/collapsed_mode.test.tsx @@ -77,38 +77,6 @@ describe('Collapsed mode', () => { // See: https://eui.elastic.co/docs/utilities/accessibility/#screen-reader-only expect(solutionLogo.children[1].className).toContain('euiScreenReaderOnly'); }); - - /** - * GIVEN the side navigation is in collapsed mode - * WHEN I hover over the solution logo - * THEN a tooltip appears with the item label - * AND when I click on the trigger - * AND then I hover out - * THEN the tooltip disappears - */ - it('should display a tooltip with the solution label on hover, and hide on hover out', async () => { - render(); - - const solutionLogo = screen.getByTestId(logoId); - - await user.hover(solutionLogo); - flushPopoverTimers(); - - const tooltip = await screen.findByRole('tooltip', { - name: 'Solution', - }); - - expect(tooltip).toBeInTheDocument(); - - await user.click(solutionLogo); - await user.unhover(solutionLogo); - - // Even after clicking on the trigger which makes the `EuiToolTip` persistent by default - // See: https://eui.elastic.co/docs/components/display/tooltip/ - await waitFor(() => { - expect(tooltip).not.toBeInTheDocument(); - }); - }); }); describe('Primary menu', () => { @@ -262,38 +230,6 @@ describe('Collapsed mode', () => { expect(dashboardsLink).toHaveAttribute('href', expectedHref); }); - /** - * GIVEN the side navigation is in collapsed mode - * WHEN I hover over a primary menu item - * THEN a tooltip appears with the item label - * AND when I click on the trigger - * AND then I hover out - * THEN the tooltip disappears - */ - it('should display a tooltip with the item label on hover, and hide on hover out', async () => { - render(); - - const dashboardsLink = screen.getByTestId(primaryItemId('dashboards')); - - await user.hover(dashboardsLink); - flushPopoverTimers(); - - const tooltip = await screen.findByRole('tooltip', { - name: 'Dashboards', - }); - - expect(tooltip).toBeInTheDocument(); - - await user.click(dashboardsLink); - await user.unhover(dashboardsLink); - - // Even after clicking on the trigger which makes the `EuiToolTip` persistent by default - // See: https://eui.elastic.co/docs/components/display/tooltip/ - await waitFor(() => { - expect(tooltip).not.toBeInTheDocument(); - }); - }); - /** * GIVEN the side navigation is in collapsed mode * AND a primary menu item is in beta diff --git a/src/platform/kbn-ui/side-navigation/src/components/footer/item.tsx b/src/platform/kbn-ui/side-navigation/src/components/footer/item.tsx index 984aed8939862..5a1af21e7f3d3 100644 --- a/src/platform/kbn-ui/side-navigation/src/components/footer/item.tsx +++ b/src/platform/kbn-ui/side-navigation/src/components/footer/item.tsx @@ -18,7 +18,6 @@ import { BetaBadge } from '../beta_badge'; import { NAVIGATION_SELECTOR_PREFIX, TOOLTIP_OFFSET } from '../../constants'; import { focusMainContent } from '../../utils/focus_main_content'; import { useHighContrastModeStyles } from '../../hooks/use_high_contrast_mode_styles'; -import { useTooltip } from '../../hooks/use_tooltip'; import { NewItemIndicator } from '../new_item_indicator'; export interface FooterItemProps extends Omit, MenuItem { @@ -43,7 +42,6 @@ export const FooterItem = forwardRef( ref: ForwardedRef ) => { const { euiTheme } = useEuiTheme(); - const { tooltipRef, handleMouseOut } = useTooltip(); const highContrastModeStyles = useHighContrastModeStyles(); const handleFooterItemKeyDown = (e: KeyboardEvent) => { @@ -125,9 +123,7 @@ export const FooterItem = forwardRef( }} content={tooltipContent} disableScreenReaderOutput - onMouseOut={handleMouseOut} position="right" - ref={tooltipRef} repositionOnScroll offset={TOOLTIP_OFFSET} > diff --git a/src/platform/kbn-ui/side-navigation/src/components/primary_menu/item.tsx b/src/platform/kbn-ui/side-navigation/src/components/primary_menu/item.tsx index 0a7dfbf92f177..d8276cd039f89 100644 --- a/src/platform/kbn-ui/side-navigation/src/components/primary_menu/item.tsx +++ b/src/platform/kbn-ui/side-navigation/src/components/primary_menu/item.tsx @@ -17,7 +17,6 @@ import type { MenuItem } from '../../../types'; import { BetaBadge } from '../beta_badge'; import { MenuItem as MenuItemComponent } from '../menu_item'; import { NAVIGATION_SELECTOR_PREFIX, TOOLTIP_OFFSET } from '../../constants'; -import { useTooltip } from '../../hooks/use_tooltip'; export interface PrimaryMenuItemProps extends Omit { as?: 'a' | 'button'; @@ -57,7 +56,6 @@ export const PrimaryMenuItem = forwardRef< ref: ForwardedRef ): JSX.Element => { const { euiTheme } = useEuiTheme(); - const { tooltipRef, handleMouseOut } = useTooltip(); const wrapperStyles = css` display: flex; @@ -110,11 +108,9 @@ export const PrimaryMenuItem = forwardRef< if (tooltipContent) { return ( , 'onClick'>, SideNavLogo { @@ -36,7 +35,6 @@ export const Logo = ({ }: LogoProps): JSX.Element => { const euiThemeContext = useEuiTheme(); const { euiTheme } = euiThemeContext; - const { tooltipRef, handleMouseOut } = useTooltip(); /** * **Icon size** @@ -90,14 +88,7 @@ export const Logo = ({ if (isCollapsed) { return ( - + {menuItem} ); diff --git a/src/platform/kbn-ui/side-navigation/src/hooks/use_tooltip.test.ts b/src/platform/kbn-ui/side-navigation/src/hooks/use_tooltip.test.ts deleted file mode 100644 index 661234195624b..0000000000000 --- a/src/platform/kbn-ui/side-navigation/src/hooks/use_tooltip.test.ts +++ /dev/null @@ -1,28 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the "Elastic License - * 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side - * Public License v 1"; you may not use this file except in compliance with, at - * your election, the "Elastic License 2.0", the "GNU Affero General Public - * License v3.0 only", or the "Server Side Public License, v 1". - */ - -import { renderHook } from '@testing-library/react'; - -import { useTooltip } from './use_tooltip'; - -describe('useTooltip', () => { - it('exposes a ref and hides the tooltip on mouse out', () => { - const { result } = renderHook(() => useTooltip<{ hideToolTip: () => void }>()); - - expect(result.current.tooltipRef.current).toBeNull(); - - const hideToolTip = jest.fn(); - - result.current.tooltipRef.current = { hideToolTip }; - - result.current.handleMouseOut(); - - expect(hideToolTip).toHaveBeenCalledTimes(1); - }); -}); diff --git a/src/platform/kbn-ui/side-navigation/src/hooks/use_tooltip.ts b/src/platform/kbn-ui/side-navigation/src/hooks/use_tooltip.ts deleted file mode 100644 index 6cc6c1c43f599..0000000000000 --- a/src/platform/kbn-ui/side-navigation/src/hooks/use_tooltip.ts +++ /dev/null @@ -1,32 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the "Elastic License - * 2.0", the "GNU Affero General Public License v3.0 only", and the "Server Side - * Public License v 1"; you may not use this file except in compliance with, at - * your election, the "Elastic License 2.0", the "GNU Affero General Public - * License v3.0 only", or the "Server Side Public License, v 1". - */ - -import type { EuiToolTip } from '@elastic/eui'; -import { useCallback, useRef } from 'react'; - -/** - * Hook to manage tooltip visibility. - * - * @returns An object containing: - * - `tooltipRef` - a ref to the `EuiToolTip` component. - * - `handleMouseOut` - a callback to handle the mouse out event. - */ -interface TooltipLike { - hideToolTip: () => void; -} - -export const useTooltip = () => { - const tooltipRef = useRef(null); - - const handleMouseOut = useCallback(() => { - tooltipRef.current?.hideToolTip(); - }, []); - - return { tooltipRef, handleMouseOut }; -}; diff --git a/src/platform/packages/private/kbn-esql-editor/src/editor_footer/keyboard_shortcuts.tsx b/src/platform/packages/private/kbn-esql-editor/src/editor_footer/keyboard_shortcuts.tsx index d59be8c4a08c0..779ed50664f3a 100644 --- a/src/platform/packages/private/kbn-esql-editor/src/editor_footer/keyboard_shortcuts.tsx +++ b/src/platform/packages/private/kbn-esql-editor/src/editor_footer/keyboard_shortcuts.tsx @@ -104,7 +104,7 @@ export function KeyboardShortcuts() { anchorPosition="downRight" panelPaddingSize="none" button={ - + = ({ return ( <> {condition ? ( - + <>{children} ) : ( diff --git a/src/platform/packages/private/kbn-ui-shared-deps-npm/version_dependencies.txt b/src/platform/packages/private/kbn-ui-shared-deps-npm/version_dependencies.txt index c53db4e82b606..2033e37eb5fc7 100644 --- a/src/platform/packages/private/kbn-ui-shared-deps-npm/version_dependencies.txt +++ b/src/platform/packages/private/kbn-ui-shared-deps-npm/version_dependencies.txt @@ -18,7 +18,7 @@ @elastic/esql@3.0.0 @elastic/eui-theme-borealis@7.0.0 @elastic/eui-theme-common@9.0.0 -@elastic/eui@114.3.0 +@elastic/eui@115.0.0 @elastic/numeral@2.5.1 @elastic/prismjs-esql@1.1.2 @emotion/babel-plugin@11.13.5 diff --git a/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_extra_actions.tsx b/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_extra_actions.tsx index 3663e66359fb0..cf4e3d399f6e6 100644 --- a/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_extra_actions.tsx +++ b/src/platform/packages/shared/kbn-coloring/src/shared_components/coloring/color_ranges/color_ranges_extra_actions.tsx @@ -64,7 +64,6 @@ export function ColorRangesExtraActions({ )} condition={shouldDisableAdd} position="top" - delay="regular" > + + = ({ return ( <> {condition ? ( - + <>{children} ) : ( diff --git a/src/platform/packages/shared/kbn-cps-utils/components/project_picker.tsx b/src/platform/packages/shared/kbn-cps-utils/components/project_picker.tsx index 2124ca01d2d61..91cf854beacd0 100644 --- a/src/platform/packages/shared/kbn-cps-utils/components/project_picker.tsx +++ b/src/platform/packages/shared/kbn-cps-utils/components/project_picker.tsx @@ -68,7 +68,6 @@ export const ProjectPicker = ({ const button = ( diff --git a/src/platform/packages/shared/kbn-data-grid-in-table-search/src/in_table_search_control.tsx b/src/platform/packages/shared/kbn-data-grid-in-table-search/src/in_table_search_control.tsx index 67c52778e835b..a5b356196ecce 100644 --- a/src/platform/packages/shared/kbn-data-grid-in-table-search/src/in_table_search_control.tsx +++ b/src/platform/packages/shared/kbn-data-grid-in-table-search/src/in_table_search_control.tsx @@ -188,7 +188,6 @@ export const InTableSearchControl: React.FC = ({ content={i18n.translate('dataGridInTableSearch.inputPlaceholder', { defaultMessage: 'Find in table', })} - delay="long" > } - delay="regular" - disableScreenReaderOutput={false} - display="inlineBlock" - position="top" > Upserted @@ -55,10 +51,6 @@ exports[`DocumentsPanel renders 1`] = ` } /> } - delay="regular" - disableScreenReaderOutput={false} - display="inlineBlock" - position="top" > Deleted @@ -87,10 +79,6 @@ exports[`DocumentsPanel renders 1`] = ` } /> } - delay="regular" - disableScreenReaderOutput={false} - display="inlineBlock" - position="top" > Volume diff --git a/src/platform/packages/shared/kbn-unified-data-table/src/components/custom_control_columns/additional_row_control/row_control_column.tsx b/src/platform/packages/shared/kbn-unified-data-table/src/components/custom_control_columns/additional_row_control/row_control_column.tsx index 0e03b756c17b6..4086f2e4fd65d 100644 --- a/src/platform/packages/shared/kbn-unified-data-table/src/components/custom_control_columns/additional_row_control/row_control_column.tsx +++ b/src/platform/packages/shared/kbn-unified-data-table/src/components/custom_control_columns/additional_row_control/row_control_column.tsx @@ -57,11 +57,7 @@ export const RowControlCell = ({ if (tooltipContent) { return ( - + {control} ); diff --git a/src/platform/packages/shared/kbn-unified-data-table/src/components/custom_control_columns/additional_row_control/row_menu_control_column.tsx b/src/platform/packages/shared/kbn-unified-data-table/src/components/custom_control_columns/additional_row_control/row_menu_control_column.tsx index d67b26924eac4..104078d339da4 100644 --- a/src/platform/packages/shared/kbn-unified-data-table/src/components/custom_control_columns/additional_row_control/row_menu_control_column.tsx +++ b/src/platform/packages/shared/kbn-unified-data-table/src/components/custom_control_columns/additional_row_control/row_menu_control_column.tsx @@ -77,7 +77,7 @@ export const RowMenuControlCell = ({ id={`rowMenuActionsPopover_${props.rowIndex}`} className="unifiedDataTable__rowControl" button={ - + { const { record, rowIndex } = useControlColumn(props); - const toolTipRef = useRef(null); + const toolTipRef = useRef(null); const [pressed, setPressed] = useState(false); const { expanded, setExpanded, componentsTourSteps } = useContext(UnifiedDataTableContext); @@ -51,7 +51,6 @@ export const ExpandButton = (props: EuiDataGridCellValueElementProps) => { return ( - + {fieldDisplayName} @@ -83,7 +78,6 @@ export function FieldName({ {isMultiField && !disableMultiFieldBadge && ( = ({ count, }, })} - delay="long" > = ({ `} > {(formattedFieldValue?.length ?? 0) > 0 ? ( - + {formattedFieldValue} diff --git a/src/platform/packages/shared/kbn-user-profile-components/src/user_avatar_tip.tsx b/src/platform/packages/shared/kbn-user-profile-components/src/user_avatar_tip.tsx index f62155e72bdf0..19da636d8d6ff 100644 --- a/src/platform/packages/shared/kbn-user-profile-components/src/user_avatar_tip.tsx +++ b/src/platform/packages/shared/kbn-user-profile-components/src/user_avatar_tip.tsx @@ -23,7 +23,7 @@ export const UserAvatarTip: FunctionComponent = ({ user, avatar } return ( - + ); diff --git a/src/platform/packages/shared/kbn-user-profile-components/src/user_tooltip.test.tsx b/src/platform/packages/shared/kbn-user-profile-components/src/user_tooltip.test.tsx index f30ff9f452323..8b5f8d29ced31 100644 --- a/src/platform/packages/shared/kbn-user-profile-components/src/user_tooltip.test.tsx +++ b/src/platform/packages/shared/kbn-user-profile-components/src/user_tooltip.test.tsx @@ -28,7 +28,6 @@ describe('UserToolTip', () => { imageUrl: 'https://source.unsplash.com/64x64/?cat', }} position="top" - delay="regular" > diff --git a/src/platform/packages/shared/kbn-visualization-ui-components/components/color_picker.tsx b/src/platform/packages/shared/kbn-visualization-ui-components/components/color_picker.tsx index dd3fba9682072..546c64d8882f4 100644 --- a/src/platform/packages/shared/kbn-visualization-ui-components/components/color_picker.tsx +++ b/src/platform/packages/shared/kbn-visualization-ui-components/components/color_picker.tsx @@ -121,7 +121,6 @@ export const ColorPicker = ({ fullWidth label={ {isDisabled ? ( - + {colorPicker} ) : ( diff --git a/src/platform/packages/shared/kbn-visualization-utils/src/tooltip_wrapper.tsx b/src/platform/packages/shared/kbn-visualization-utils/src/tooltip_wrapper.tsx index 2ef1a20ac6fd7..56a2587ba10bf 100644 --- a/src/platform/packages/shared/kbn-visualization-utils/src/tooltip_wrapper.tsx +++ b/src/platform/packages/shared/kbn-visualization-utils/src/tooltip_wrapper.tsx @@ -26,7 +26,7 @@ export const TooltipWrapper: React.FunctionComponent = ({ return ( <> {condition ? ( - + <>{children} ) : ( diff --git a/src/platform/packages/shared/shared-ux/toolbar_selector/src/toolbar_selector.test.tsx b/src/platform/packages/shared/shared-ux/toolbar_selector/src/toolbar_selector.test.tsx index 45ed11e7cb945..b56c852d7109d 100644 --- a/src/platform/packages/shared/shared-ux/toolbar_selector/src/toolbar_selector.test.tsx +++ b/src/platform/packages/shared/shared-ux/toolbar_selector/src/toolbar_selector.test.tsx @@ -239,7 +239,7 @@ describe('ToolbarSelector', () => { await user.hover(button); await waitFor(() => { - expect(screen.getByText('Default Label')).toBeInTheDocument(); + expect(screen.getByRole('tooltip', { hidden: true })).toHaveTextContent('Default Label'); }); }); }); diff --git a/src/platform/packages/shared/shared-ux/toolbar_selector/src/toolbar_selector.tsx b/src/platform/packages/shared/shared-ux/toolbar_selector/src/toolbar_selector.tsx index ace07058436ea..9cefdf4152fbd 100644 --- a/src/platform/packages/shared/shared-ux/toolbar_selector/src/toolbar_selector.tsx +++ b/src/platform/packages/shared/shared-ux/toolbar_selector/src/toolbar_selector.tsx @@ -215,7 +215,6 @@ export const ToolbarSelector = ({ ? buttonTooltipContent : buttonLabel } - delay="long" display="block" > = ({ return ( <> {condition ? ( - + <>{children} ) : ( diff --git a/src/platform/plugins/private/vis_default_editor/public/components/__snapshots__/agg.test.tsx.snap b/src/platform/plugins/private/vis_default_editor/public/components/__snapshots__/agg.test.tsx.snap index 63f010d4b6d68..384fe93874bd5 100644 --- a/src/platform/plugins/private/vis_default_editor/public/components/__snapshots__/agg.test.tsx.snap +++ b/src/platform/plugins/private/vis_default_editor/public/components/__snapshots__/agg.test.tsx.snap @@ -17,9 +17,7 @@ exports[`DefaultEditorAgg component should init with the default set of props 1` - + {legendSizeSelect} diff --git a/src/platform/plugins/private/vis_default_editor/public/components/options/switch.tsx b/src/platform/plugins/private/vis_default_editor/public/components/options/switch.tsx index e3f8a1f4bd359..c941466948cd0 100644 --- a/src/platform/plugins/private/vis_default_editor/public/components/options/switch.tsx +++ b/src/platform/plugins/private/vis_default_editor/public/components/options/switch.tsx @@ -32,7 +32,7 @@ function SwitchOption({ }: SwitchOptionProps) { return ( - + {alignmentSelect} diff --git a/src/platform/plugins/private/vis_types/heatmap/public/editor/components/heatmap.tsx b/src/platform/plugins/private/vis_types/heatmap/public/editor/components/heatmap.tsx index 53adec57e7352..8ce9a3155c9c1 100644 --- a/src/platform/plugins/private/vis_types/heatmap/public/editor/components/heatmap.tsx +++ b/src/platform/plugins/private/vis_types/heatmap/public/editor/components/heatmap.tsx @@ -165,7 +165,6 @@ const HeatmapOptions = (props: HeatmapOptionsProps) => { }) : null } - delay="long" position="right" > Count @@ -71,9 +65,7 @@ exports[`ValueAxesPanel component should init with the default set of props 1`] extraAction={ Average @@ -179,9 +167,7 @@ exports[`ValueAxesPanel component should init with the default set of props 1`] extraAction={ - + - + = ( defaultMessage: 'Keyboard shortcut {keyboardShortcut}', } ); - const tooltipRef = useRef(null); + const tooltipRef = useRef(null); const [tooltipVisible, setTooltipVisible] = useState(true); const fullTooltipContent = (
diff --git a/src/platform/plugins/shared/controls/public/controls/data_controls/options_list_control/components/options_list_control.tsx b/src/platform/plugins/shared/controls/public/controls/data_controls/options_list_control/components/options_list_control.tsx index 1536e7f21e336..aae335cd1f5b1 100644 --- a/src/platform/plugins/shared/controls/public/controls/data_controls/options_list_control/components/options_list_control.tsx +++ b/src/platform/plugins/shared/controls/public/controls/data_controls/options_list_control/components/options_list_control.tsx @@ -183,7 +183,6 @@ export const OptionsListControl = ({ customStrings?.invalidSelectionsLabel ?? OptionsListStrings.control.getInvalidSelectionWarningLabel(invalidSelections.size) } - delay="long" > = ({ ), diff --git a/src/platform/plugins/shared/discover/public/application/main/components/layout/cascaded_documents/blocks/use_table_header_components.test.tsx b/src/platform/plugins/shared/discover/public/application/main/components/layout/cascaded_documents/blocks/use_table_header_components.test.tsx index c3e0b28cca060..2398a3d41acb2 100644 --- a/src/platform/plugins/shared/discover/public/application/main/components/layout/cascaded_documents/blocks/use_table_header_components.test.tsx +++ b/src/platform/plugins/shared/discover/public/application/main/components/layout/cascaded_documents/blocks/use_table_header_components.test.tsx @@ -12,7 +12,7 @@ import { renderHook, render, screen, waitFor } from '@testing-library/react'; import { I18nProvider } from '@kbn/i18n-react'; import { EuiThemeProvider } from '@elastic/eui'; import userEvent from '@testing-library/user-event'; -import { waitForEuiPopoverOpen, waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; +import { waitForEuiPopoverOpen } from '@elastic/eui/lib/test/rtl'; import { useGetGroupBySelectorRenderer } from './use_table_header_components'; describe('useTableHeaderComponents', () => { @@ -125,8 +125,6 @@ describe('useTableHeaderComponents', () => { await user.hover(groupSelectionButton); - await waitForEuiToolTipVisible(); - expect(screen.getByText('Grouped results (technical preview)')).toBeInTheDocument(); expect(screen.getByText('Results are grouped when running a Stats BY')).toBeInTheDocument(); }); diff --git a/src/platform/plugins/shared/discover/public/application/main/components/layout/save_discover_table_button.tsx b/src/platform/plugins/shared/discover/public/application/main/components/layout/save_discover_table_button.tsx index 787d21e95c901..747e2d899e6b6 100644 --- a/src/platform/plugins/shared/discover/public/application/main/components/layout/save_discover_table_button.tsx +++ b/src/platform/plugins/shared/discover/public/application/main/components/layout/save_discover_table_button.tsx @@ -63,7 +63,7 @@ export function SaveDiscoverTableButton() { return ( <> - + ) : ( - + {/* eslint-disable-next-line @elastic/eui/href-or-on-click */} + {notificationComponent} ); @@ -447,7 +447,6 @@ export const PresentationPanelHoverActions = ({ size="m" title={!hideTitle ? title || undefined : undefined} content={description} - delay="regular" position="top" data-test-subj="embeddablePanelDescriptionTooltip" type="info" diff --git a/src/platform/plugins/shared/embeddable/public/react_embeddable_system/panel_component/panel_header/presentation_panel_title.tsx b/src/platform/plugins/shared/embeddable/public/react_embeddable_system/panel_component/panel_header/presentation_panel_title.tsx index 4f5efe2f3408a..ddf0ca99d3498 100644 --- a/src/platform/plugins/shared/embeddable/public/react_embeddable_system/panel_component/panel_header/presentation_panel_title.tsx +++ b/src/platform/plugins/shared/embeddable/public/react_embeddable_system/panel_component/panel_header/presentation_panel_title.tsx @@ -106,7 +106,6 @@ export const PresentationPanelTitle = ({ + {notificationComponent} ); diff --git a/src/platform/plugins/shared/navigation/public/top_nav_menu/__snapshots__/top_nav_menu_item.test.tsx.snap b/src/platform/plugins/shared/navigation/public/top_nav_menu/__snapshots__/top_nav_menu_item.test.tsx.snap index 4c443b51f9d5c..a2b688410c663 100644 --- a/src/platform/plugins/shared/navigation/public/top_nav_menu/__snapshots__/top_nav_menu_item.test.tsx.snap +++ b/src/platform/plugins/shared/navigation/public/top_nav_menu/__snapshots__/top_nav_menu_item.test.tsx.snap @@ -3,9 +3,6 @@ exports[`TopNavMenu Should render an icon-only item 1`] = ` ; + return ; } else if (objectNamespaceType === 'agnostic') { return ( - + = React.memo(({ row, onToggl overflow: hidden; `} > - + = () => { useFilterBarContext(); const themeContext = useEuiTheme(); const styles = toggleStyles(themeContext); - - // TODO Workaround for https://github.com/elastic/eui/issues/9520 - const expandTooltipRef = useRef(null); const buttonRef = useRef(null); - const [buttonInFocusNotVisible, setButtonInFocusNotVisible] = useState(false); - const onTooltipMouseOut = useCallback(() => { - if (buttonInFocusNotVisible) { - expandTooltipRef.current?.hideToolTip(); - } - }, [buttonInFocusNotVisible]); - const onButtonFocus = useCallback(() => { - if (document.querySelector('button:focus-visible') !== buttonRef.current) { - setButtonInFocusNotVisible(true); - } - }, []); - const onButtonBlur = useCallback(() => setButtonInFocusNotVisible(false), []); - // TODO End workaround, delete above block when EUI fixes this issue return ( - + = () => { css={styles.filterButtonStyle} size="s" data-test-subj="filterBarToggleButton" - onFocus={/* TODO Workaround for https://github.com/elastic/eui/issues/9520 */ onButtonFocus} - onBlur={/* TODO Workaround for https://github.com/elastic/eui/issues/9520 */ onButtonBlur} > diff --git a/src/platform/plugins/shared/unified_search/public/filters_builder/filter_item/tooltip.tsx b/src/platform/plugins/shared/unified_search/public/filters_builder/filter_item/tooltip.tsx index c6645fb1aecd9..966d06125a7cb 100644 --- a/src/platform/plugins/shared/unified_search/public/filters_builder/filter_item/tooltip.tsx +++ b/src/platform/plugins/shared/unified_search/public/filters_builder/filter_item/tooltip.tsx @@ -19,7 +19,7 @@ export type TooltipProps = Partial> & { export const Tooltip: React.FC = ({ children, show, content, ...tooltipProps }) => ( <> {show ? ( - + <>{children} ) : ( diff --git a/src/platform/plugins/shared/unified_search/public/query_string_input/add_filter_popover.tsx b/src/platform/plugins/shared/unified_search/public/query_string_input/add_filter_popover.tsx index b97eecd9414a8..60445477b061c 100644 --- a/src/platform/plugins/shared/unified_search/public/query_string_input/add_filter_popover.tsx +++ b/src/platform/plugins/shared/unified_search/public/query_string_input/add_filter_popover.tsx @@ -58,7 +58,7 @@ const AddFilterPopoverComponent = React.memo(function AddFilterPopover({ const [showAddFilterPopover, setShowAddFilterPopover] = useState(false); const button = ( - + + diff --git a/src/platform/plugins/shared/workflows_management/public/widgets/workflow_yaml_editor/ui/editor_settings_popover.tsx b/src/platform/plugins/shared/workflows_management/public/widgets/workflow_yaml_editor/ui/editor_settings_popover.tsx index 5e7a070f7a453..f20c41a96b730 100644 --- a/src/platform/plugins/shared/workflows_management/public/widgets/workflow_yaml_editor/ui/editor_settings_popover.tsx +++ b/src/platform/plugins/shared/workflows_management/public/widgets/workflow_yaml_editor/ui/editor_settings_popover.tsx @@ -72,7 +72,7 @@ export function EditorSettingsPopover({ editorRef }: EditorSettingsPopoverProps) anchorPosition="upRight" panelPaddingSize="none" button={ - + + -1 ? samplingIndex : values.length - 1; return ( - + = ({ onSendMessage, promptValue, }) => { - const submitTooltipRef = useRef(null); - - const closeTooltip = useCallback(() => { - submitTooltipRef?.current?.hideToolTip(); - }, []); - return ( { } = useAssistantContext(); const buttonRef = useRef(null); - const tooltipRef = useRef(null); + const tooltipRef = useRef(null); const [tooltipVisible, setTooltipVisible] = useState(true); useEffect(() => { diff --git a/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/connectorland/connector_selector/index.test.tsx b/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/connectorland/connector_selector/index.test.tsx index a3f15dca5d95e..255d76c587769 100644 --- a/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/connectorland/connector_selector/index.test.tsx +++ b/x-pack/platform/packages/shared/kbn-elastic-assistant/impl/connectorland/connector_selector/index.test.tsx @@ -7,7 +7,7 @@ import React from 'react'; import { ConnectorSelector } from '.'; -import { act, fireEvent, render, screen } from '@testing-library/react'; +import { fireEvent, render, screen, waitFor } from '@testing-library/react'; import { mockAssistantAvailability, TestProviders } from '../../mock/test_providers/test_providers'; import { mockActionTypes, mockConnectors } from '../../mock/connectors'; import * as i18n from '../translations'; @@ -139,8 +139,7 @@ describe('Connector selector', () => { expect(addButton).toBeDisabled(); }); - it('shows tooltip with missing privileges message when hovering disabled add connector button', () => { - jest.useFakeTimers(); + it('shows tooltip with missing privileges message when hovering disabled add connector button', async () => { jest.mocked(useLoadConnectors).mockReturnValue( createMockUseLoadConnectorsResult({ data: [], @@ -168,14 +167,12 @@ describe('Connector selector', () => { expect(addButton).toBeDisabled(); fireEvent.mouseOver(addButton); - act(() => { - jest.runAllTimers(); - }); - expect(screen.getByRole('tooltip')).toHaveTextContent( - i18n.ADD_CONNECTOR_MISSING_PRIVILEGES_DESCRIPTION - ); - jest.useRealTimers(); + await waitFor(() => { + expect(screen.getByRole('tooltip', { hidden: true })).toHaveTextContent( + i18n.ADD_CONNECTOR_MISSING_PRIVILEGES_DESCRIPTION + ); + }); }); it('renders add new connector button if no selected connector is provided', () => { diff --git a/x-pack/platform/packages/shared/kbn-search-index-documents/components/result/result.tsx b/x-pack/platform/packages/shared/kbn-search-index-documents/components/result/result.tsx index 8b0b3a27e0658..c3ed2e8758d28 100644 --- a/x-pack/platform/packages/shared/kbn-search-index-documents/components/result/result.tsx +++ b/x-pack/platform/packages/shared/kbn-search-index-documents/components/result/result.tsx @@ -15,6 +15,7 @@ import { EuiSpacer, EuiSplitPanel, EuiToolTip, + type EuiToolTipRef, } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; @@ -67,7 +68,7 @@ export const Result: React.FC = ({ const showResultsFields = isExpanded ? fields.length > 0 : defaultVisibleFields > 0; - const tooltipRef = useRef(null); + const tooltipRef = useRef(null); return ( <> diff --git a/x-pack/platform/plugins/private/monitoring/public/alerts/lib/__snapshots__/get_alert_panels_by_category.test.tsx.snap b/x-pack/platform/plugins/private/monitoring/public/alerts/lib/__snapshots__/get_alert_panels_by_category.test.tsx.snap index b71248f15e90f..c068780a695d0 100644 --- a/x-pack/platform/plugins/private/monitoring/public/alerts/lib/__snapshots__/get_alert_panels_by_category.test.tsx.snap +++ b/x-pack/platform/plugins/private/monitoring/public/alerts/lib/__snapshots__/get_alert_panels_by_category.test.tsx.snap @@ -41,9 +41,6 @@ Array [ "name": { ); return ( - + { ); return ( - + {(removeCluster) => ( { { defaultMessage: 'Edit' } ); return ( - + { { defaultMessage: 'Delete' } ); return ( - + { // Can use default action if this proposal is implemented: https://github.com/elastic/eui/discussions/8735 render: (agent) => { return ( - + (null); - const tooltipRef = useRef(null); + const tooltipRef = useRef(null); const [isSidebarOpen, setIsSidebarOpen] = useState(false); const [tooltipVisible, setTooltipVisible] = useState(true); diff --git a/x-pack/platform/plugins/shared/alerting_v2/public/pages/alert_episodes_list_page/components/episode_assignee_cell.tsx b/x-pack/platform/plugins/shared/alerting_v2/public/pages/alert_episodes_list_page/components/episode_assignee_cell.tsx index e36cd97bcfb5f..d8142a0742bc1 100644 --- a/x-pack/platform/plugins/shared/alerting_v2/public/pages/alert_episodes_list_page/components/episode_assignee_cell.tsx +++ b/x-pack/platform/plugins/shared/alerting_v2/public/pages/alert_episodes_list_page/components/episode_assignee_cell.tsx @@ -67,7 +67,7 @@ export function EpisodeAssigneeCell({ assigneeUid, userProfile }: EpisodeAssigne const avatar = profile.data?.avatar; return ( - + = ; -// EuiToolTip has a 250ms delay for "long" - we need fake timers -const TOOLTIP_DELAY_MS = 300; - describe('IntegrationCountBadge', () => { const renderBadge = (cloudConnectorId: string, count: number) => { return render( @@ -36,7 +33,6 @@ describe('IntegrationCountBadge', () => { beforeEach(() => { jest.clearAllMocks(); - jest.useFakeTimers(); mockUseCloudConnectorUsage.mockReturnValue({ data: undefined, isLoading: false, @@ -44,10 +40,6 @@ describe('IntegrationCountBadge', () => { } as unknown as ReturnType); }); - afterEach(() => { - jest.useRealTimers(); - }); - describe('badge rendering', () => { it('renders badge with singular text for count of 1', () => { renderBadge('connector-1', 1); @@ -99,16 +91,9 @@ describe('IntegrationCountBadge', () => { const badge = container.querySelector('.euiBadge'); expect(badge).toBeInTheDocument(); - // Trigger hover on the tooltip anchor (EuiToolTip's wrapper) - const tooltipAnchor = container.querySelector('.euiToolTipAnchor'); - fireEvent.mouseOver(tooltipAnchor!); - - // Advance past the tooltip delay - act(() => { - jest.advanceTimersByTime(TOOLTIP_DELAY_MS); - }); + fireEvent.mouseEnter(container.firstChild as HTMLElement); + fireEvent.mouseOver(container.querySelector('.euiToolTipAnchor')!); - // Wait for tooltip to appear await waitFor(() => { expect(screen.getByText('Policy 1')).toBeInTheDocument(); }); @@ -125,14 +110,8 @@ describe('IntegrationCountBadge', () => { const { container } = renderBadge('connector-1', 2); - // Trigger hover on the tooltip anchor - const tooltipAnchor = container.querySelector('.euiToolTipAnchor'); - fireEvent.mouseOver(tooltipAnchor!); - - // Advance past the tooltip delay - act(() => { - jest.advanceTimersByTime(TOOLTIP_DELAY_MS); - }); + fireEvent.mouseEnter(container.firstChild as HTMLElement); + fireEvent.mouseOver(container.querySelector('.euiToolTipAnchor')!); await waitFor(() => { expect(screen.getByText('Loading...')).toBeInTheDocument(); @@ -148,14 +127,8 @@ describe('IntegrationCountBadge', () => { const { container } = renderBadge('connector-1', 2); - // Trigger hover on the tooltip anchor - const tooltipAnchor = container.querySelector('.euiToolTipAnchor'); - fireEvent.mouseOver(tooltipAnchor!); - - // Advance past the tooltip delay - act(() => { - jest.advanceTimersByTime(TOOLTIP_DELAY_MS); - }); + fireEvent.mouseEnter(container.firstChild as HTMLElement); + fireEvent.mouseOver(container.querySelector('.euiToolTipAnchor')!); await waitFor(() => { expect(screen.getByText('Failed to load integrations')).toBeInTheDocument(); @@ -191,14 +164,8 @@ describe('IntegrationCountBadge', () => { const { container } = renderBadge('connector-1', 2); - // Trigger hover on the tooltip anchor - const tooltipAnchor = container.querySelector('.euiToolTipAnchor'); - fireEvent.mouseOver(tooltipAnchor!); - - // Advance past the tooltip delay - act(() => { - jest.advanceTimersByTime(TOOLTIP_DELAY_MS); - }); + fireEvent.mouseEnter(container.firstChild as HTMLElement); + fireEvent.mouseOver(container.querySelector('.euiToolTipAnchor')!); await waitFor(() => { expect(screen.getByText('CSPM Policy')).toBeInTheDocument(); @@ -228,14 +195,8 @@ describe('IntegrationCountBadge', () => { const { container } = renderBadge('connector-1', 15); - // Trigger hover on the tooltip anchor - const tooltipAnchor = container.querySelector('.euiToolTipAnchor'); - fireEvent.mouseOver(tooltipAnchor!); - - // Advance past the tooltip delay - act(() => { - jest.advanceTimersByTime(TOOLTIP_DELAY_MS); - }); + fireEvent.mouseEnter(container.firstChild as HTMLElement); + fireEvent.mouseOver(container.querySelector('.euiToolTipAnchor')!); await waitFor(() => { expect(screen.getByText('+5 more')).toBeInTheDocument(); @@ -266,17 +227,10 @@ describe('IntegrationCountBadge', () => { const { container } = renderBadge('connector-123', 1); - // Trigger hover on the tooltip anchor - const tooltipAnchor = container.querySelector('.euiToolTipAnchor'); - fireEvent.mouseOver(tooltipAnchor!); - - // Advance past the tooltip delay - act(() => { - jest.advanceTimersByTime(TOOLTIP_DELAY_MS); - }); + fireEvent.mouseEnter(container.firstChild as HTMLElement); + fireEvent.mouseOver(container.querySelector('.euiToolTipAnchor')!); await waitFor(() => { - // Verify the hook is called with the correct parameters including staleTime: 0 expect(mockUseCloudConnectorUsage).toHaveBeenCalledWith('connector-123', 1, 10, { staleTime: 0, }); diff --git a/x-pack/platform/plugins/shared/fleet/public/components/cloud_connector/components/integration_count_badge.tsx b/x-pack/platform/plugins/shared/fleet/public/components/cloud_connector/components/integration_count_badge.tsx index 6520450abc75a..c4b36a41239e9 100644 --- a/x-pack/platform/plugins/shared/fleet/public/components/cloud_connector/components/integration_count_badge.tsx +++ b/x-pack/platform/plugins/shared/fleet/public/components/cloud_connector/components/integration_count_badge.tsx @@ -116,7 +116,6 @@ export const IntegrationCountBadge: React.FC = ({ return (
: null diff --git a/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/field_parameters/relations_parameter.tsx b/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/field_parameters/relations_parameter.tsx index 3431848cbe806..80d0201fa5454 100644 --- a/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/field_parameters/relations_parameter.tsx +++ b/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/field_parameters/relations_parameter.tsx @@ -203,7 +203,7 @@ export const RelationsParameter = () => { } ); return ( - + - + - + {i18n.translate('xpack.lens.shared.ticksPositionOptions', { diff --git a/x-pack/platform/plugins/shared/lens/public/visualizations/xy/xy_config_panel/shared/marker_decoration_settings.tsx b/x-pack/platform/plugins/shared/lens/public/visualizations/xy/xy_config_panel/shared/marker_decoration_settings.tsx index 6f28aed96c75e..9bf0b40cf95d8 100644 --- a/x-pack/platform/plugins/shared/lens/public/visualizations/xy/xy_config_panel/shared/marker_decoration_settings.tsx +++ b/x-pack/platform/plugins/shared/lens/public/visualizations/xy/xy_config_panel/shared/marker_decoration_settings.tsx @@ -110,7 +110,6 @@ export function MarkerDecorationPosition({ })} condition={!hasIcon(currentConfig?.icon) && !currentConfig?.textVisibility} position="top" - delay="regular" display="block" > @@ -103,9 +100,6 @@ exports[`Should render legend 1`] = ` > @@ -227,9 +221,6 @@ exports[`Should render legend with 2 markers when size difference does not provi > @@ -303,9 +294,6 @@ exports[`Should render legend with 3 markers when size difference does not provi > @@ -395,9 +383,6 @@ exports[`Should render legend with only max marker when size difference does not > @@ -455,9 +440,6 @@ exports[`Should render legend without label cutoff when min size is 1 1`] = ` > @@ -531,9 +513,6 @@ exports[`Should render max label with std clamp notification 1`] = ` > diff --git a/x-pack/platform/plugins/shared/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_color_property.test.tsx.snap b/x-pack/platform/plugins/shared/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_color_property.test.tsx.snap index e41989345b866..485bec13a1428 100644 --- a/x-pack/platform/plugins/shared/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_color_property.test.tsx.snap +++ b/x-pack/platform/plugins/shared/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_color_property.test.tsx.snap @@ -31,9 +31,6 @@ exports[`renderLegendDetailRow categorical Should render categorical legend with > @@ -99,9 +96,6 @@ exports[`renderLegendDetailRow ordinal Should render custom ordinal legend with > @@ -165,9 +159,6 @@ exports[`renderLegendDetailRow ordinal Should render interpolate bands 1`] = ` > @@ -297,9 +288,6 @@ exports[`renderLegendDetailRow ordinal Should render percentile bands 1`] = ` > @@ -407,9 +395,6 @@ exports[`renderLegendDetailRow ordinal Should render single band when interpolat > diff --git a/x-pack/platform/plugins/shared/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_icon_property.test.tsx.snap b/x-pack/platform/plugins/shared/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_icon_property.test.tsx.snap index b6be5edb69e34..d3bb285064a91 100644 --- a/x-pack/platform/plugins/shared/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_icon_property.test.tsx.snap +++ b/x-pack/platform/plugins/shared/maps/public/classes/styles/vector/properties/__snapshots__/dynamic_icon_property.test.tsx.snap @@ -11,9 +11,6 @@ exports[`renderLegendDetailRow Should render categorical legend with breaks 1`] > @@ -109,9 +106,6 @@ exports[`renderLegendDetailRow Should render categorical legend with custom icon > diff --git a/x-pack/platform/plugins/shared/maps/public/connected_components/right_side_controls/layer_control/__snapshots__/layer_control.test.tsx.snap b/x-pack/platform/plugins/shared/maps/public/connected_components/right_side_controls/layer_control/__snapshots__/layer_control.test.tsx.snap index 72421073977a2..571c547cabed9 100644 --- a/x-pack/platform/plugins/shared/maps/public/connected_components/right_side_controls/layer_control/__snapshots__/layer_control.test.tsx.snap +++ b/x-pack/platform/plugins/shared/maps/public/connected_components/right_side_controls/layer_control/__snapshots__/layer_control.test.tsx.snap @@ -35,10 +35,7 @@ exports[`LayerControl is rendered 1`] = ` > ({ @@ -88,7 +87,6 @@ describe('AnomalyValueDisplay', () => { expect(element).toBeInTheDocument(); fireEvent.mouseOver(element); - await waitForEuiToolTipVisible(); const tooltip = screen.getByTestId('mlAnomalyTimeValueTooltip'); expect(tooltip).toHaveTextContent('January 1st 14:30'); @@ -106,7 +104,6 @@ describe('AnomalyValueDisplay', () => { expect(offsetText).toBeInTheDocument(); fireEvent.mouseOver(timeText); - await waitForEuiToolTipVisible(); const tooltip = screen.getByTestId('mlAnomalyTimeValueTooltip'); expect(tooltip).toHaveTextContent('January 1st 14:30'); @@ -121,7 +118,6 @@ describe('AnomalyValueDisplay', () => { expect(element).toBeInTheDocument(); fireEvent.mouseOver(element); - await waitForEuiToolTipVisible(); const tooltip = screen.getByTestId('mlAnomalyTimeValueTooltip'); expect(tooltip).toHaveTextContent('January 1st 14:30'); diff --git a/x-pack/platform/plugins/shared/spaces/public/legacy_urls/components/legacy_url_conflict_internal.tsx b/x-pack/platform/plugins/shared/spaces/public/legacy_urls/components/legacy_url_conflict_internal.tsx index a5cef0443c7ac..36b7ac9e7e5bb 100644 --- a/x-pack/platform/plugins/shared/spaces/public/legacy_urls/components/legacy_url_conflict_internal.tsx +++ b/x-pack/platform/plugins/shared/spaces/public/legacy_urls/components/legacy_url_conflict_internal.tsx @@ -94,7 +94,6 @@ export const LegacyUrlConflictInternal = (props: InternalProps & LegacyUrlConfli { fireEvent.mouseOver(await within(durationColumnHeader).findByText('Info')); await waitFor(() => - expect(screen.getByRole('tooltip')).toHaveTextContent( + expect(screen.getByRole('tooltip', { hidden: true })).toHaveTextContent( 'The length of time it took for the rule to run (mm:ss).' ) ); diff --git a/x-pack/solutions/observability/plugins/apm/public/components/app/settings/agent_explorer/agent_list/index.tsx b/x-pack/solutions/observability/plugins/apm/public/components/app/settings/agent_explorer/agent_list/index.tsx index fc7f5d59e9f2e..e44f6181b5946 100644 --- a/x-pack/solutions/observability/plugins/apm/public/components/app/settings/agent_explorer/agent_list/index.tsx +++ b/x-pack/solutions/observability/plugins/apm/public/components/app/settings/agent_explorer/agent_list/index.tsx @@ -54,7 +54,6 @@ export function getAgentsColumns({ content={i18n.translate('xpack.apm.agentExplorerTable.viewAgentInstances', { defaultMessage: 'Toggle agent instances view', })} - delay="long" > - + {asBigNumber(childrenCount)} diff --git a/x-pack/solutions/observability/plugins/apm/public/components/shared/truncate_with_tooltip/index.tsx b/x-pack/solutions/observability/plugins/apm/public/components/shared/truncate_with_tooltip/index.tsx index 7c0321b9467fd..04b2927b46597 100644 --- a/x-pack/solutions/observability/plugins/apm/public/components/shared/truncate_with_tooltip/index.tsx +++ b/x-pack/solutions/observability/plugins/apm/public/components/shared/truncate_with_tooltip/index.tsx @@ -35,12 +35,7 @@ export function TruncateWithTooltip(props: Props) { return ( - + {content || text} diff --git a/x-pack/solutions/observability/plugins/infra/public/components/asset_details/components/expandable_content.tsx b/x-pack/solutions/observability/plugins/infra/public/components/asset_details/components/expandable_content.tsx index a9959f3edcc90..ab1bd3f087d5b 100644 --- a/x-pack/solutions/observability/plugins/infra/public/components/asset_details/components/expandable_content.tsx +++ b/x-pack/solutions/observability/plugins/infra/public/components/asset_details/components/expandable_content.tsx @@ -79,7 +79,7 @@ export const ExpandableContent = (props: ExpandableContentProps) => { )} - +

{first}

diff --git a/x-pack/solutions/observability/plugins/infra/public/components/lens/lens_chart.tsx b/x-pack/solutions/observability/plugins/infra/public/components/lens/lens_chart.tsx index 009d66d5fa18e..abae9f209dd46 100644 --- a/x-pack/solutions/observability/plugins/infra/public/components/lens/lens_chart.tsx +++ b/x-pack/solutions/observability/plugins/infra/public/components/lens/lens_chart.tsx @@ -152,7 +152,6 @@ export const LensChart = React.memo( lens ) : ( - {button} - + {button} ); }; diff --git a/x-pack/solutions/observability/plugins/infra/public/components/logging/log_analysis_setup/missing_setup_privileges_tooltip.tsx b/x-pack/solutions/observability/plugins/infra/public/components/logging/log_analysis_setup/missing_setup_privileges_tooltip.tsx index c6e381053040f..0ffe43a4b816f 100644 --- a/x-pack/solutions/observability/plugins/infra/public/components/logging/log_analysis_setup/missing_setup_privileges_tooltip.tsx +++ b/x-pack/solutions/observability/plugins/infra/public/components/logging/log_analysis_setup/missing_setup_privileges_tooltip.tsx @@ -5,17 +5,16 @@ * 2.0. */ -import type { PropsOf } from '@elastic/eui'; -import { EuiToolTip } from '@elastic/eui'; +import { EuiToolTip, type EuiToolTipProps } from '@elastic/eui'; import React from 'react'; import { missingMlPrivilegesTitle, missingMlSetupPrivilegesDescription, } from './missing_privileges_messages'; -export const MissingSetupPrivilegesToolTip: React.FC< - Omit, 'content' | 'title'> -> = (props) => ( +export const MissingSetupPrivilegesToolTip: React.FC> = ( + props +) => ( + ) : ( - + { { const providerName = cloudProvider ?? 'Unknown'; return ( } > diff --git a/x-pack/solutions/observability/plugins/infra/public/pages/metrics/inventory_view/components/waffle/waffle_time_controls.tsx b/x-pack/solutions/observability/plugins/infra/public/pages/metrics/inventory_view/components/waffle/waffle_time_controls.tsx index a6bb2ce374f9e..7e79bbd680701 100644 --- a/x-pack/solutions/observability/plugins/infra/public/pages/metrics/inventory_view/components/waffle/waffle_time_controls.tsx +++ b/x-pack/solutions/observability/plugins/infra/public/pages/metrics/inventory_view/components/waffle/waffle_time_controls.tsx @@ -90,7 +90,6 @@ export const WaffleTimeControls = withEuiTheme(({ interval }: PropsWithTheme) => > (null); - const tooltipRef = useRef(null); + const tooltipRef = useRef(null); const [tooltipVisible, setTooltipVisible] = useState(true); useEffect(() => { const keyboardListener = (event: KeyboardEvent) => { diff --git a/x-pack/solutions/observability/plugins/uptime/public/legacy_uptime/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx b/x-pack/solutions/observability/plugins/uptime/public/legacy_uptime/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx index 7fe39a6b99fc4..2f9ea120d2fef 100644 --- a/x-pack/solutions/observability/plugins/uptime/public/legacy_uptime/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx +++ b/x-pack/solutions/observability/plugins/uptime/public/legacy_uptime/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx @@ -122,7 +122,6 @@ export const MiddleTruncatedText = ({ } data-test-subj="middleTruncatedTextToolTip" - delay="long" position="top" > <> diff --git a/x-pack/solutions/search/plugins/enterprise_search/public/applications/applications/components/search_applications/search_applications_create_button.test.tsx b/x-pack/solutions/search/plugins/enterprise_search/public/applications/applications/components/search_applications/search_applications_create_button.test.tsx index 548314dcda43b..1d997215435f1 100644 --- a/x-pack/solutions/search/plugins/enterprise_search/public/applications/applications/components/search_applications/search_applications_create_button.test.tsx +++ b/x-pack/solutions/search/plugins/enterprise_search/public/applications/applications/components/search_applications/search_applications_create_button.test.tsx @@ -10,8 +10,6 @@ import React, { type ReactNode } from 'react'; import { render, screen } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; - import { __IntlProvider as IntlProvider } from '@kbn/i18n-react'; import { CreateSearchApplicationButton } from './search_applications_list'; @@ -32,8 +30,6 @@ describe('CreateSearchApplicationButton', () => { await screen.findByTestId('enterprise-search-search-applications-creation-button') ); - await waitForEuiToolTipVisible(); - expect( await screen.findByTestId('create-search-application-button-popover-content') ).toBeInTheDocument(); diff --git a/x-pack/solutions/search/plugins/search_assistant/public/components/nav_control/index.tsx b/x-pack/solutions/search/plugins/search_assistant/public/components/nav_control/index.tsx index 823f6fa7cab01..181a7dd2a7a06 100644 --- a/x-pack/solutions/search/plugins/search_assistant/public/components/nav_control/index.tsx +++ b/x-pack/solutions/search/plugins/search_assistant/public/components/nav_control/index.tsx @@ -4,9 +4,9 @@ * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ -import React, { useCallback, useEffect, useRef, useState } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import { useAbortableAsync } from '@kbn/observability-ai-assistant-plugin/public'; -import { EuiErrorBoundary, EuiShowFor, EuiToolTip } from '@elastic/eui'; +import { EuiErrorBoundary, EuiShowFor, EuiToolTip, type EuiToolTipRef } from '@elastic/eui'; import { v4 } from 'uuid'; import useObservable from 'react-use/lib/useObservable'; import { i18n } from '@kbn/i18n'; @@ -95,11 +95,7 @@ export function NavControl() { title: undefined, }; const buttonRef = useRef(null); - const tooltipRef = useRef(null); - - const handleTooltipMouseOut = useCallback(() => { - tooltipRef.current?.hideToolTip(); - }, []); + const tooltipRef = useRef(null); const handleClick = () => { tooltipRef.current?.hideToolTip(); @@ -115,7 +111,7 @@ export function NavControl() { return ( <> - + - + { }); describe('when hovering over search input', () => { - it('shows a tooltip with the ilm check description', async () => { + it('shows a tooltip with the ilm check description', () => { render( @@ -81,11 +81,9 @@ describe('IlmPhaseFilter', () => { ); - await userEvent.hover(screen.getByTestId('comboBoxSearchInput')); + fireEvent.mouseOver(screen.getByTestId('comboBoxSearchInput')); - await waitFor(() => - expect(screen.getByRole('tooltip')).toHaveTextContent(INDEX_LIFECYCLE_MANAGEMENT_PHASES) - ); + expect(screen.getByRole('tooltip')).toHaveTextContent(INDEX_LIFECYCLE_MANAGEMENT_PHASES); }); }); @@ -120,11 +118,8 @@ describe('IlmPhaseFilter', () => { const searchInput = screen.getByTestId('comboBoxSearchInput'); await userEvent.click(searchInput); - await userEvent.hover(screen.getByText(option.toLowerCase()), { pointerEventsCheck: 0 }); - await waitFor(() => - expect(screen.getByRole('tooltip')).toHaveTextContent(tooltipDescription) - ); + expect(screen.getByText(tooltipDescription)).toBeInTheDocument(); }); }); }); diff --git a/x-pack/solutions/security/packages/kbn-securitysolution-exception-list-components/src/value_with_space_warning/value_with_space_warning.test.tsx b/x-pack/solutions/security/packages/kbn-securitysolution-exception-list-components/src/value_with_space_warning/value_with_space_warning.test.tsx index 49258d1bada96..747cc53f9255f 100644 --- a/x-pack/solutions/security/packages/kbn-securitysolution-exception-list-components/src/value_with_space_warning/value_with_space_warning.test.tsx +++ b/x-pack/solutions/security/packages/kbn-securitysolution-exception-list-components/src/value_with_space_warning/value_with_space_warning.test.tsx @@ -38,10 +38,10 @@ describe('ValueWithSpaceWarning', () => { const container = render(); expect(container.getByTestId('valueWithSpaceWarningTooltip')).toBeInTheDocument(); }); - it('should show the tooltip when the icon is clicked', async () => { + it('should show the tooltip when the icon is hovered', async () => { const container = render(); - fireEvent.focus(container.getByTestId('valueWithSpaceWarningTooltip')); + fireEvent.mouseOver(container.getByTestId('valueWithSpaceWarningTooltip')); expect(await container.findByText('Warning Text')).toBeInTheDocument(); }); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/asset_inventory/components/risk_badge.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/asset_inventory/components/risk_badge.test.tsx index 4175dfc71dd21..5d55992ef29b6 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/asset_inventory/components/risk_badge.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/asset_inventory/components/risk_badge.test.tsx @@ -6,7 +6,6 @@ */ import React from 'react'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; import { screen, render, cleanup, fireEvent } from '@testing-library/react'; import { RiskSeverity } from '../../../common/search_strategy'; import { RiskBadge } from './risk_badge'; @@ -23,7 +22,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('0'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Unknown); @@ -34,7 +32,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('19'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Unknown); @@ -45,7 +42,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('20'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Low); @@ -56,7 +52,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('39'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Low); @@ -67,7 +62,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('40'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Moderate); @@ -78,7 +72,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('69'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Moderate); @@ -89,7 +82,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('70'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.High); @@ -100,7 +92,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('89'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.High); @@ -111,7 +102,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('90'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Critical); @@ -122,7 +112,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('100'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Critical); @@ -133,7 +122,6 @@ describe('AssetInventory', () => { expect(badge).toHaveTextContent('400'); fireEvent.mouseOver(badge.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent(RiskSeverity.Critical); diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/hooks/use_schedule_view.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/hooks/use_schedule_view.test.tsx index 35810235b49f4..8ecbce4221049 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/hooks/use_schedule_view.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/hooks/use_schedule_view.test.tsx @@ -16,7 +16,6 @@ import { TestProviders } from '../../../../common/mock'; import { mockFindAttackDiscoverySchedules } from '../../mock/mock_find_attack_discovery_schedules'; import { triggersActionsUiMock } from '@kbn/triggers-actions-ui-plugin/public/mocks'; import { ATTACK_DISCOVERY_FEATURE_ID } from '../../../../../common/constants'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; jest.mock('react-router', () => ({ matchPath: jest.fn(), @@ -172,7 +171,6 @@ describe('useScheduleView', () => { const createButton = screen.getByTestId('createSchedule'); fireEvent.mouseOver(createButton.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent('Missing privileges'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/common/status_badge/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/common/status_badge/index.test.tsx index d87e89df7653f..3d7c59ac8e040 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/common/status_badge/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/common/status_badge/index.test.tsx @@ -11,7 +11,6 @@ import { fireEvent, render, screen } from '@testing-library/react'; import { StatusBadge } from '.'; import { TestProviders } from '../../../../../../common/mock'; import { mockAttackDiscoverySchedule } from '../../../../mock/mock_attack_discovery_schedule'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; const renderScheduleStatus = ( status: 'unknown' | 'ok' | 'active' | 'error' | 'warning' = 'ok', @@ -70,7 +69,6 @@ describe('StatusBadge', () => { const status = screen.getByTestId('scheduleExecutionStatus'); fireEvent.mouseOver(status.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent('Failed'); @@ -81,7 +79,6 @@ describe('StatusBadge', () => { const status = screen.getByTestId('scheduleExecutionStatus'); fireEvent.mouseOver(status.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent('Failed badly!'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/create_button/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/create_button/index.test.tsx index e47b1abecc95e..3ff44578bbb85 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/create_button/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/create_button/index.test.tsx @@ -10,7 +10,6 @@ import { act, fireEvent, render, screen, waitFor } from '@testing-library/react' import { CreateButton } from '.'; import { TestProviders } from '../../../../../common/mock'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; import { useKibana } from '../../../../../common/lib/kibana'; import { ATTACK_DISCOVERY_FEATURE_ID } from '../../../../../../common/constants'; @@ -113,7 +112,6 @@ describe('CreateButton', () => { const createButton = screen.getByTestId('createSchedule'); fireEvent.mouseOver(createButton.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent('Missing privileges'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/details_flyout/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/details_flyout/index.test.tsx index 2a958a90f52e1..0125c9893845f 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/details_flyout/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/details_flyout/index.test.tsx @@ -19,7 +19,6 @@ import { useUpdateAttackDiscoverySchedule } from '../logic/use_update_schedule'; import { useGetAttackDiscoverySchedule } from '../logic/use_get_schedule'; import { mockAttackDiscoverySchedule } from '../../../mock/mock_attack_discovery_schedule'; import { ATTACK_DISCOVERY_FEATURE_ID } from '../../../../../../common/constants'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; jest.mock('@kbn/inference-connectors'); jest.mock('../logic/use_update_schedule'); @@ -313,7 +312,6 @@ describe('DetailsFlyout', () => { const editButton = screen.getByTestId('edit'); fireEvent.mouseOver(editButton.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent('Missing privileges'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/missing_privileges/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/missing_privileges/index.test.tsx index bfd41158c6dd8..36c61042e5782 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/missing_privileges/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/missing_privileges/index.test.tsx @@ -11,7 +11,6 @@ import { EuiFlexItem } from '@elastic/eui'; import { WithMissingPrivileges } from '.'; import { TestProviders } from '../../../../../common/mock'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; import { useKibana } from '../../../../../common/lib/kibana'; import { ATTACK_DISCOVERY_FEATURE_ID } from '../../../../../../common/constants'; @@ -106,7 +105,6 @@ describe('WithMissingPrivileges', () => { const chileComponent = screen.getByTestId('testChild1'); fireEvent.mouseOver(chileComponent.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent('Missing privileges'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/schedules_table/columns/actions.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/schedules_table/columns/actions.test.tsx index 07603aa4abfdb..7abff2deb0608 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/schedules_table/columns/actions.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/schedules_table/columns/actions.test.tsx @@ -15,7 +15,6 @@ import { TestProviders } from '../../../../../../common/mock'; import { mockAttackDiscoverySchedule } from '../../../../mock/mock_attack_discovery_schedule'; import { useKibana } from '../../../../../../common/lib/kibana'; import { ATTACK_DISCOVERY_FEATURE_ID } from '../../../../../../../common/constants'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; jest.mock('../../../../../../common/lib/kibana'); @@ -95,7 +94,6 @@ describe('Actions Column', () => { const deleteButton = screen.getByTestId('deleteButton'); fireEvent.mouseOver(deleteButton.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent('Missing privileges'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/schedules_table/columns/enable.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/schedules_table/columns/enable.test.tsx index 9212783dfa947..4c47ba2f60a6f 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/schedules_table/columns/enable.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/attack_discovery/pages/settings_flyout/schedule/schedules_table/columns/enable.test.tsx @@ -15,7 +15,6 @@ import { TestProviders } from '../../../../../../common/mock'; import { mockAttackDiscoverySchedule } from '../../../../mock/mock_attack_discovery_schedule'; import { useKibana } from '../../../../../../common/lib/kibana'; import { ATTACK_DISCOVERY_FEATURE_ID } from '../../../../../../../common/constants'; -import { waitForEuiToolTipVisible } from '@elastic/eui/lib/test/rtl'; jest.mock('../../../../../../common/lib/kibana'); @@ -119,7 +118,6 @@ describe('Enable Column', () => { const scheduleSwitch = screen.getByTestId('scheduleSwitch'); fireEvent.mouseOver(scheduleSwitch.parentElement as Node); - await waitForEuiToolTipVisible(); const tooltip = screen.getByRole('tooltip'); expect(tooltip).toHaveTextContent('Missing privileges'); diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.test.tsx b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.test.tsx index 765ffce045e40..579d8f2b5fc5b 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.test.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/draggables/index.test.tsx @@ -7,7 +7,6 @@ import { shallow } from 'enzyme'; import React from 'react'; -import { EuiToolTip } from '@elastic/eui'; import { TestProviders } from '../../mock'; import { getEmptyString } from '../empty_value'; import { useMountAppended } from '../../utils/use_mount_appended'; @@ -166,21 +165,5 @@ describe('draggables', () => { expect(wrapper.find('[data-test-subj="some-field-tooltip"]').first().exists()).toBe(false); }); - - test('it uses the specified tooltipPosition', () => { - const wrapper = mount( - - - - ); - - expect(wrapper.find(EuiToolTip).first().props().position).toEqual('top'); - }); }); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/common/components/text_field_value/__snapshots__/index.test.tsx.snap b/x-pack/solutions/security/plugins/security_solution/public/common/components/text_field_value/__snapshots__/index.test.tsx.snap index 351285a381393..0db76d24e3462 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/common/components/text_field_value/__snapshots__/index.test.tsx.snap +++ b/x-pack/solutions/security/plugins/security_solution/public/common/components/text_field_value/__snapshots__/index.test.tsx.snap @@ -20,10 +20,6 @@ exports[`text_field_value TextFieldValue should render long text correctly, when } - delay="regular" - disableScreenReaderOutput={false} - display="inlineBlock" - position="top" > } - delay="regular" - disableScreenReaderOutput={false} - display="inlineBlock" - position="top" > } - delay="regular" - disableScreenReaderOutput={false} - display="inlineBlock" - position="top" > } - delay="regular" - disableScreenReaderOutput={false} - display="inlineBlock" - position="top" > { ); expect(container.container).toMatchSnapshot(); }); - it('should show the tooltip when the icon is clicked', async () => { + it('should show the tooltip when the icon is hovered', async () => { const container = render( ({ eui: { euiSizeXS: '4px' } })}> diff --git a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/table_field_name_cell.tsx b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/table_field_name_cell.tsx index d5821a89bd5c4..fbc88e4b9df60 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/table_field_name_cell.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/flyout/document_details/right/components/table_field_name_cell.tsx @@ -74,7 +74,6 @@ export const TableFieldNameCell = memo(({ dataType, field }: TableFieldNameCellP ? `${ecsField?.description} ${getExampleText(ecsField?.example)}` : field } - delay="long" anchorClassName="eui-textBreakAll" > { fireEvent.mouseOver(getByText('Installed')); await waitFor(() => { - expect(getByText('Installed')).toBeInTheDocument(); + expect(screen.getByRole('tooltip', { hidden: true })).toHaveTextContent('Installed'); }); }); @@ -100,7 +100,7 @@ describe('StatusBadge', () => { fireEvent.mouseOver(getByText('Translated')); await waitFor(() => { - expect(getByText('Translated')).toBeInTheDocument(); + expect(screen.getByRole('tooltip', { hidden: true })).toHaveTextContent('Translated'); }); }); @@ -114,7 +114,9 @@ describe('StatusBadge', () => { fireEvent.mouseOver(getByText('Partially translated')); await waitFor(() => { - expect(getByText('Partially translated')).toBeInTheDocument(); + expect(screen.getByRole('tooltip', { hidden: true })).toHaveTextContent( + 'Partially translated' + ); }); }); @@ -128,7 +130,7 @@ describe('StatusBadge', () => { fireEvent.mouseOver(getByText('Not translated')); await waitFor(() => { - expect(getByText('Not translated')).toBeInTheDocument(); + expect(screen.getByRole('tooltip', { hidden: true })).toHaveTextContent('Not translated'); }); }); }); diff --git a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/unified_components/data_table/toolbar_additional_controls.tsx b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/unified_components/data_table/toolbar_additional_controls.tsx index 63f6120785328..ffe5530f583f7 100644 --- a/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/unified_components/data_table/toolbar_additional_controls.tsx +++ b/x-pack/solutions/security/plugins/security_solution/public/timelines/components/timeline/unified_components/data_table/toolbar_additional_controls.tsx @@ -5,7 +5,13 @@ * 2.0. */ -import { EuiButtonIcon, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui'; +import { + EuiButtonIcon, + EuiFlexGroup, + EuiFlexItem, + EuiToolTip, + type EuiToolTipRef, +} from '@elastic/eui'; import React, { useCallback, useMemo, useRef } from 'react'; import { isActiveTimeline } from '../../../../../helpers'; @@ -40,7 +46,7 @@ export const ToolbarAdditionalControlsComponent: React.FC = ({ timelineId const { timelineFullScreen, setTimelineFullScreen } = useTimelineFullScreen(); const { globalFullScreen, setGlobalFullScreen } = useGlobalFullScreen(); - const toolTipRef = useRef(null); + const toolTipRef = useRef(null); const hideToolTip = () => toolTipRef.current?.hideToolTip(); @@ -98,7 +104,6 @@ export const ToolbarAdditionalControlsComponent: React.FC = ({ timelineId } iconType={fullScreen ? 'fullScreenExit' : 'fullScreen'} onClick={toggleFullScreen} - onMouseOut={hideToolTip} /> diff --git a/x-pack/solutions/security/plugins/session_view/public/components/session_view_display_options/index.tsx b/x-pack/solutions/security/plugins/session_view/public/components/session_view_display_options/index.tsx index 4e0299b2cb7b6..eed48c5c486c5 100644 --- a/x-pack/solutions/security/plugins/session_view/public/components/session_view_display_options/index.tsx +++ b/x-pack/solutions/security/plugins/session_view/public/components/session_view_display_options/index.tsx @@ -9,6 +9,7 @@ import React, { useState, useMemo, useEffect, useRef } from 'react'; import { i18n } from '@kbn/i18n'; import { EuiToolTip, + type EuiToolTipRef, EuiPopover, EuiSelectable, EuiPopoverTitle, @@ -55,16 +56,16 @@ export const SessionViewDisplayOptions = ({ }) => { const [isOptionDropdownOpen, setOptionDropdownOpen] = useState(false); const styles = useStyles(); - const tooltipRef = useRef(null); + const tooltipRef = useRef(null); useEffect(() => { if (tooltipRef.current) { setTimeout(() => { if (tooltipRef.current) { - (tooltipRef.current as EuiToolTip).onFocus(); + tooltipRef.current.showToolTip(); setTimeout(() => { if (tooltipRef.current) { - (tooltipRef.current as EuiToolTip).onBlur(); + tooltipRef.current.hideToolTip(); } }, TOOLTIP_HIDE_DELAY); } diff --git a/x-pack/solutions/security/test/security_solution_cypress/cypress/e2e/detection_response/rule_management/rule_actions/snoozing/rule_snoozing.cy.ts b/x-pack/solutions/security/test/security_solution_cypress/cypress/e2e/detection_response/rule_management/rule_actions/snoozing/rule_snoozing.cy.ts index c6ac31c590b37..6376f1a285d2d 100644 --- a/x-pack/solutions/security/test/security_solution_cypress/cypress/e2e/detection_response/rule_management/rule_actions/snoozing/rule_snoozing.cy.ts +++ b/x-pack/solutions/security/test/security_solution_cypress/cypress/e2e/detection_response/rule_management/rule_actions/snoozing/rule_snoozing.cy.ts @@ -229,6 +229,8 @@ describe('rule snoozing', { tags: ['@ess', '@serverless', '@skipInServerlessMKI' visitRuleDetailsPage(rule.id); }); + cy.get(DISABLED_SNOOZE_BADGE).find('[role="progressbar"]').should('not.exist'); + cy.get(DISABLED_SNOOZE_BADGE).scrollIntoView(); cy.get(DISABLED_SNOOZE_BADGE).trigger('mouseover'); cy.get(TOOLTIP).contains('Unable to fetch snooze settings'); diff --git a/x-pack/solutions/security/test/security_solution_cypress/cypress/screens/rule_snoozing.ts b/x-pack/solutions/security/test/security_solution_cypress/cypress/screens/rule_snoozing.ts index 675807d81df37..2a7058d30e904 100644 --- a/x-pack/solutions/security/test/security_solution_cypress/cypress/screens/rule_snoozing.ts +++ b/x-pack/solutions/security/test/security_solution_cypress/cypress/screens/rule_snoozing.ts @@ -9,7 +9,8 @@ export const UNSNOOZED_BADGE = '[data-test-subj="rulesListNotifyBadge-unsnoozed" export const SNOOZED_BADGE = '[data-test-subj="rulesListNotifyBadge-snoozed"]'; -export const DISABLED_SNOOZE_BADGE = '[data-test-subj="rulesListNotifyBadge"]'; +export const DISABLED_SNOOZE_BADGE = + '[data-test-subj="rulesListNotifyBadge"] button[disabled]:not(:has([role="progressbar"]))'; export const SNOOZE_POPOVER_INTERVAL_VALUE_INPUT = '[data-test-subj="ruleSnoozeIntervalValue"]'; diff --git a/yarn.lock b/yarn.lock index 42192698ef2de..e67b3975e13d9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2370,10 +2370,10 @@ semver "7.7.4" topojson-client "^3.1.0" -"@elastic/eslint-plugin-eui@2.11.1": - version "2.11.1" - resolved "https://registry.yarnpkg.com/@elastic/eslint-plugin-eui/-/eslint-plugin-eui-2.11.1.tgz#435248596e044fa1d39a54d820115fefedfe25ef" - integrity sha512-zUJCq/0RUUGLcsFpZ8iHReboE8POZZ3XBnEd8DtxWnkf0Eb87VvcZWoQNwQHctPdQkzEmN4VRwLk4kuPX2Es+A== +"@elastic/eslint-plugin-eui@2.12.0": + version "2.12.0" + resolved "https://registry.yarnpkg.com/@elastic/eslint-plugin-eui/-/eslint-plugin-eui-2.12.0.tgz#9333e558c6a5786f4aaf984eeda737d35edd17a0" + integrity sha512-nDOmel4ywBWrc6q/j0nqsXna/yD8yK+QyzS3UapxN9C13dhDZaTychqP7B9om95yYvlHd9k0kzKv6IHTUKfhqg== "@elastic/esql@3.0.0": version "3.0.0" @@ -2401,10 +2401,10 @@ chroma-js "^2.4.2" lodash "^4.17.21" -"@elastic/eui@114.3.0": - version "114.3.0" - resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-114.3.0.tgz#15ed4744e7531036bc0243ee5c012671838338d3" - integrity sha512-dWrs5ULxUajc5wouiIIyb/NeaLDpFiyYrsbp4yscGmj8zj942y5KmFlaIWHQmEalmNjCSBf5h7wKx9px+MnMWg== +"@elastic/eui@115.0.0": + version "115.0.0" + resolved "https://registry.yarnpkg.com/@elastic/eui/-/eui-115.0.0.tgz#a946565fc1fa336c1b02834584a879e02bdc2efe" + integrity sha512-jbkoTnfF9qYTzLoDsudREIlhLXTpg1vB7uPoytpoZlUkxkxE4773BiUgtcyDzNInZ00KUFlY/NzgI8Wy6IW5eA== dependencies: "@elastic/eui-theme-common" "9.0.0" "@elastic/prismjs-esql" "^1.1.2"