Skip to content

Commit 4baad32

Browse files
ui: Test ids for sandwich view components (#6133)
* Test ids for sandwich view components * [pre-commit.ci lite] apply automatic fixes --------- Co-authored-by: pre-commit-ci-lite[bot] <117423508+pre-commit-ci-lite[bot]@users.noreply.github.com>
1 parent e12d995 commit 4baad32

File tree

6 files changed

+35
-5
lines changed

6 files changed

+35
-5
lines changed

ui/packages/shared/profile/src/ProfileFlameGraph/FlameGraphArrow/ContextMenu.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ import {Tooltip} from 'react-tooltip';
2020
import {useParcaContext, useURLState} from '@parca/components';
2121
import {USER_PREFERENCES, useUserPreference} from '@parca/hooks';
2222
import {ProfileType} from '@parca/parser';
23+
import {TEST_IDS} from '@parca/test-utils';
2324
import {getLastItem} from '@parca/utilities';
2425

2526
import {useGraphTooltip} from '../../GraphTooltipArrow/useGraphTooltip';
@@ -187,6 +188,7 @@ const ContextMenu = ({
187188
{enableSandwichView === true && (
188189
<Item
189190
id="show-in-sandwich"
191+
data-testid={TEST_IDS.CONTEXT_MENU_SHOW_IN_SANDWICH}
190192
onClick={() => {
191193
if (functionName === '' || functionName == null) {
192194
return;

ui/packages/shared/profile/src/ProfileFlameGraph/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -205,7 +205,7 @@ const ProfileFlameGraph = function ProfileFlameGraphNonMemo({
205205

206206
if (isLoading && !isInvalidFlameChartQuery) {
207207
return (
208-
<div className="h-auto overflow-clip">
208+
<div className="h-auto overflow-clip" data-testid={TEST_IDS.FLAMEGRAPH_SKELETON}>
209209
{isRenderedAsFlamegraph ? (
210210
<SandwichFlameGraphSkeleton isHalfScreen={isHalfScreen} isDarkMode={isDarkMode} />
211211
) : (

ui/packages/shared/profile/src/Sandwich/components/CalleesSection.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,8 @@
1313

1414
import React from 'react';
1515

16+
import {TEST_IDS, testId} from '@parca/test-utils';
17+
1618
import ProfileFlameGraph from '../../ProfileFlameGraph';
1719
import {type CurrentPathFrame} from '../../ProfileFlameGraph/FlameGraphArrow/utils';
1820
import {type ProfileSource} from '../../ProfileSource';
@@ -35,7 +37,11 @@ export function CalleesSection({
3537
setCurPathArrow,
3638
}: CalleesSectionProps): JSX.Element {
3739
return (
38-
<div className="flex relative items-start flex-row" ref={calleesRef}>
40+
<div
41+
className="flex relative items-start flex-row"
42+
ref={calleesRef}
43+
{...testId(TEST_IDS.SANDWICH_CALLEES_SECTION)}
44+
>
3945
<div className="[writing-mode:vertical-lr] -rotate-180 px-1 uppercase text-[10px] text-left">
4046
{'<-'} Callees
4147
</div>

ui/packages/shared/profile/src/Sandwich/components/CallersSection.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@ import {Vector, tableFromIPC} from 'apache-arrow';
1717
import {Tooltip} from 'react-tooltip';
1818

1919
import {Button} from '@parca/components';
20+
import {TEST_IDS, testId} from '@parca/test-utils';
2021

2122
import ProfileFlameGraph from '../../ProfileFlameGraph';
2223
import {type CurrentPathFrame} from '../../ProfileFlameGraph/FlameGraphArrow/utils';
@@ -90,7 +91,11 @@ export function CallersSection({
9091
<Tooltip id="show-more-frames" />
9192
</Button>
9293
)}
93-
<div className="flex relative flex-row overflow-hidden" ref={callersRef}>
94+
<div
95+
className="flex relative flex-row overflow-hidden"
96+
ref={callersRef}
97+
{...testId(TEST_IDS.SANDWICH_CALLERS_SECTION)}
98+
>
9499
<div className="[writing-mode:vertical-lr] -rotate-180 px-1 uppercase text-[10px] text-left flex-shrink-0">
95100
Callers {'->'}
96101
</div>

ui/packages/shared/profile/src/Sandwich/index.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ import React, {useRef, useState} from 'react';
1616
import {AnimatePresence, motion} from 'framer-motion';
1717

1818
import {useURLState} from '@parca/components';
19+
import {TEST_IDS, testId} from '@parca/test-utils';
1920

2021
import {ProfileSource} from '../ProfileSource';
2122
import {useDashboard} from '../ProfileView/context/DashboardContext';
@@ -46,7 +47,7 @@ const Sandwich = React.memo(function Sandwich({
4647
const {curPathArrow, setCurPathArrow} = useVisualizationState();
4748

4849
return (
49-
<section className="flex flex-row h-full w-full">
50+
<section className="flex flex-row h-full w-full" {...testId(TEST_IDS.SANDWICH_CONTAINER)}>
5051
<AnimatePresence>
5152
<motion.div
5253
className="h-full w-full"
@@ -78,7 +79,10 @@ const Sandwich = React.memo(function Sandwich({
7879
/>
7980
</div>
8081
) : (
81-
<div className="items-center justify-center flex h-full w-full">
82+
<div
83+
className="items-center justify-center flex h-full w-full"
84+
{...testId(TEST_IDS.SANDWICH_NO_FUNCTION_SELECTED)}
85+
>
8286
<p className="text-sm">
8387
{dashboardItems.includes('table') ? (
8488
'Please select a function to view its callers and callees.'

ui/packages/shared/test-utils/src/test-ids.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -134,6 +134,19 @@ export const TEST_IDS = {
134134
// Diff Legend
135135
DIFF_LEGEND: 'diff-legend',
136136

137+
// Sandwich View
138+
SANDWICH_CONTAINER: 'sandwich-container',
139+
SANDWICH_CALLERS_SECTION: 'sandwich-callers-section',
140+
SANDWICH_CALLEES_SECTION: 'sandwich-callees-section',
141+
SANDWICH_NO_FUNCTION_SELECTED: 'sandwich-no-function-selected',
142+
143+
// Loading Skeletons
144+
FLAMEGRAPH_SKELETON: 'flamegraph-skeleton',
145+
146+
// Flamegraph Context Menu
147+
FLAMEGRAPH_CONTEXT_MENU: 'flamegraph-context-menu',
148+
CONTEXT_MENU_SHOW_IN_SANDWICH: 'context-menu-show-in-sandwich',
149+
137150
// Common Interactive Elements
138151
SELECT_DROPDOWN: 'select-dropdown',
139152
SELECT_OPTION: 'select-option',

0 commit comments

Comments
 (0)