diff --git a/src/components/AsideHeader/__stories__/AsideHeader.stories.tsx b/src/components/AsideHeader/__stories__/AsideHeader.stories.tsx index e05fa23..1ec40ed 100644 --- a/src/components/AsideHeader/__stories__/AsideHeader.stories.tsx +++ b/src/components/AsideHeader/__stories__/AsideHeader.stories.tsx @@ -113,6 +113,7 @@ const AdvancedUsageTemplate: StoryFn = (args) => { 'aria-label': 'Service', }} onChangeCompact={setCompact} + qa={'pl-aside'} {...args} /> @@ -166,6 +167,7 @@ const FallbackTemplate: StoryFn = ({ diff --git a/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx b/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx index 79907d0..27a125b 100644 --- a/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx +++ b/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx @@ -97,6 +97,7 @@ export const AsideHeaderShowcase: React.FC = ({ = ({ item: { id: 'search', title: 'Search', + qa: 'subheader-item-search', icon: Magnifier, current: visiblePanel === Panel.Search, onItemClick: () => @@ -169,6 +171,8 @@ export const AsideHeaderShowcase: React.FC = ({ id: 'infra', icon: Gear, current: popupVisible, + qa: 'footer-item-gear', + iconQa: 'footer-item-icon-gear', title: (
Minor issue diff --git a/src/components/AsideHeader/__stories__/moc.tsx b/src/components/AsideHeader/__stories__/moc.tsx index a6ffff4..1fecf96 100644 --- a/src/components/AsideHeader/__stories__/moc.tsx +++ b/src/components/AsideHeader/__stories__/moc.tsx @@ -20,6 +20,8 @@ export const menuItemsShowcase: MenuItem[] = [ id: 'overview', title: 'Overview', icon: Gear, + qa: 'menu-item-gear', + iconQa: 'menu-item-icon-gear', }, { id: 'operations', diff --git a/src/components/AsideHeader/components/FirstPanel.tsx b/src/components/AsideHeader/components/FirstPanel.tsx index f2ec4cb..d221aac 100644 --- a/src/components/AsideHeader/components/FirstPanel.tsx +++ b/src/components/AsideHeader/components/FirstPanel.tsx @@ -25,6 +25,7 @@ export const FirstPanel = React.forwardRef((_props, ref) => { customBackgroundClassName, className, hideCollapseButton, + qa, } = useAsideHeaderInnerContext(); const visibleMenuItems = useVisibleMenuItems(); @@ -36,7 +37,7 @@ export const FirstPanel = React.forwardRef((_props, ref) => { return ( -
+
diff --git a/src/components/AsideHeader/components/PageLayout/AsideFallback.tsx b/src/components/AsideHeader/components/PageLayout/AsideFallback.tsx index 0c7f542..9a06c9d 100644 --- a/src/components/AsideHeader/components/PageLayout/AsideFallback.tsx +++ b/src/components/AsideHeader/components/PageLayout/AsideFallback.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import {Icon} from '@gravity-ui/uikit'; +import {Icon, QAProps} from '@gravity-ui/uikit'; import {ASIDE_HEADER_COMPACT_WIDTH, HEADER_DIVIDER_HEIGHT, ITEM_HEIGHT} from '../../../constants'; import {useAsideHeaderContext} from '../../AsideHeaderContext'; @@ -8,12 +8,12 @@ import {b} from '../../utils'; import headerDividerCollapsedIcon from '../../../../../assets/icons/divider-collapsed.svg'; -export interface Props { +export interface Props extends QAProps { headerDecoration?: boolean; subheaderItemsCount?: number; } -export const AsideFallback: React.FC = ({headerDecoration, subheaderItemsCount = 0}) => { +export const AsideFallback: React.FC = ({headerDecoration, subheaderItemsCount = 0, qa}) => { const {compact} = useAsideHeaderContext(); const widthVar = compact ? '--gn-aside-header-min-width' : '--gn-aside-header-size'; @@ -21,7 +21,7 @@ export const AsideFallback: React.FC = ({headerDecoration, subheaderItems const subheaderHeight = (1 + subheaderItemsCount) * ITEM_HEIGHT; return ( -
+
diff --git a/src/components/AsideHeader/types.tsx b/src/components/AsideHeader/types.tsx index ccd9d43..1f23b68 100644 --- a/src/components/AsideHeader/types.tsx +++ b/src/components/AsideHeader/types.tsx @@ -1,3 +1,5 @@ +import {QAProps} from '@gravity-ui/uikit'; + import {RenderContentType} from '../Content'; import {DrawerItemProps} from '../Drawer/Drawer'; import { @@ -16,7 +18,7 @@ export interface LayoutProps { topAlert?: AsideHeaderTopAlertProps; } -export interface AsideHeaderGeneralProps { +export interface AsideHeaderGeneralProps extends QAProps { logo: LogoProps; multipleTooltip?: boolean; className?: string; diff --git a/src/components/CompositeBar/Item/Item.tsx b/src/components/CompositeBar/Item/Item.tsx index d2236c7..f66e389 100644 --- a/src/components/CompositeBar/Item/Item.tsx +++ b/src/components/CompositeBar/Item/Item.tsx @@ -163,6 +163,7 @@ export const Item: React.FC = (props) => {
) => { if (collapsedItem) { /** diff --git a/src/components/types.ts b/src/components/types.ts index 8bdd625..6a333eb 100644 --- a/src/components/types.ts +++ b/src/components/types.ts @@ -1,6 +1,6 @@ import React, {HTMLAttributeAnchorTarget} from 'react'; -import {AlertProps, IconProps} from '@gravity-ui/uikit'; +import {AlertProps, IconProps, QAProps} from '@gravity-ui/uikit'; import {ItemProps} from 'src/components/CompositeBar/Item/Item'; @@ -13,7 +13,7 @@ export interface MakeItemParams { title: React.ReactNode; } -export interface MenuItem { +export interface MenuItem extends QAProps { id: string; title: React.ReactNode; tooltipText?: React.ReactNode;