From 9669380e959dca252d99fe000a54363ae2dcd891 Mon Sep 17 00:00:00 2001 From: Evgenii Alaev Date: Thu, 19 Mar 2026 13:57:30 +0100 Subject: [PATCH 1/3] test(gravity-charts): refactor visual tests --- scripts/playwright-docker.sh | 3 +++ ...l-tests-default-state-1-chromium-linux.png | Bin 11657 -> 10051 bytes test-utils/utils.tsx | 5 ++++- vitest.config.ts | 2 +- 4 files changed, 8 insertions(+), 2 deletions(-) diff --git a/scripts/playwright-docker.sh b/scripts/playwright-docker.sh index 9c80c24c..5b24e8b7 100755 --- a/scripts/playwright-docker.sh +++ b/scripts/playwright-docker.sh @@ -1,4 +1,7 @@ #!/usr/bin/env bash +# Usage: +# npm run test:docker:update - run all visual tests with --update +# npm run test:docker:update -- - run only matching files (e.g. Base.visual, SplitTooltip) set -euo pipefail diff --git a/src/plugins/indicator/__screenshots__/Indicator.visual.test.tsx-screenshots/Indicator-visual-tests-default-state-1-chromium-linux.png b/src/plugins/indicator/__screenshots__/Indicator.visual.test.tsx-screenshots/Indicator-visual-tests-default-state-1-chromium-linux.png index a00395607769cda751c6abbc2dbc2585c9491cc4..39336608276b98b720c04bac9ed69e9f1db30b35 100644 GIT binary patch literal 10051 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 literal 11657 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 H=IMU{!)tx| diff --git a/test-utils/utils.tsx b/test-utils/utils.tsx index 67eb463d..c82c39d7 100644 --- a/test-utils/utils.tsx +++ b/test-utils/utils.tsx @@ -4,6 +4,8 @@ import {MobileProvider, ThemeProvider} from '@gravity-ui/uikit'; import {render, renderHook} from 'vitest-browser-react'; import type {ComponentRenderOptions} from 'vitest-browser-react'; +const DEFAULT_PROVIDERS: ProvidersProps = {theme: 'light'}; + interface ProvidersProps { theme?: string; mobile?: boolean; @@ -43,7 +45,8 @@ function customRender( providers?: {theme?: string; mobile?: boolean}; } = {}, ) { - const wrapper = createWrapper(providers, options.wrapper); + const mergedProviders = {...DEFAULT_PROVIDERS, ...providers}; + const wrapper = createWrapper(mergedProviders, options.wrapper); return render(ui, {...options, wrapper}); } diff --git a/vitest.config.ts b/vitest.config.ts index 22f89026..28ca981a 100644 --- a/vitest.config.ts +++ b/vitest.config.ts @@ -21,7 +21,7 @@ export default defineConfig({ instances: [ { browser: 'chromium', - viewport: {width: 1280, height: 720}, + viewport: {height: 280, width: 400}, }, ], locators: {testIdAttribute: 'data-qa'}, From d13b462e8afd77973f798dc4265402133df24aab Mon Sep 17 00:00:00 2001 From: Evgenii Alaev Date: Thu, 19 Mar 2026 13:58:45 +0100 Subject: [PATCH 2/3] test: add visual test infrastructure for gravity-charts --- ...chart-with-valid-data-1-chromium-linux.png | Bin 0 -> 10622 bytes .../__tests__/Base.visual.test.tsx | 41 ++++++++++++++++++ .../__tests__/ChartTestStory.tsx | 27 ++++++++++++ .../__tests__/GravityCharts.visual.test.tsx | 38 ---------------- .../__tests__/TestStory.visual.tsx | 36 --------------- 5 files changed, 68 insertions(+), 74 deletions(-) create mode 100644 src/plugins/gravity-charts/__screenshots__/Base.visual.test.tsx-screenshots/GravityCharts-base-tests-should-render-chart-with-valid-data-1-chromium-linux.png create mode 100644 src/plugins/gravity-charts/__tests__/Base.visual.test.tsx create mode 100644 src/plugins/gravity-charts/__tests__/ChartTestStory.tsx delete mode 100644 src/plugins/gravity-charts/__tests__/GravityCharts.visual.test.tsx delete mode 100644 src/plugins/gravity-charts/__tests__/TestStory.visual.tsx diff --git a/src/plugins/gravity-charts/__screenshots__/Base.visual.test.tsx-screenshots/GravityCharts-base-tests-should-render-chart-with-valid-data-1-chromium-linux.png b/src/plugins/gravity-charts/__screenshots__/Base.visual.test.tsx-screenshots/GravityCharts-base-tests-should-render-chart-with-valid-data-1-chromium-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..de2c6685ff6837e68e4a31e3f345483d27e7427d GIT binary patch literal 10622 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 P1BMqa>E@rex%dA7Q?z}t literal 0 HcmV?d00001 diff --git a/src/plugins/gravity-charts/__tests__/Base.visual.test.tsx b/src/plugins/gravity-charts/__tests__/Base.visual.test.tsx new file mode 100644 index 00000000..f91637c8 --- /dev/null +++ b/src/plugins/gravity-charts/__tests__/Base.visual.test.tsx @@ -0,0 +1,41 @@ +import React from 'react'; + +import type {ChartData} from '@gravity-ui/charts'; + +import {render} from '../../../../test-utils/utils.js'; +import {settings} from '../../../libs/index.js'; +import {GravityChartsPlugin} from '../index.js'; + +import {CHART_TEST_STORY_DATA_QA, ChartTestStory} from './ChartTestStory.js'; + +describe('GravityCharts base tests', () => { + beforeAll(() => { + settings.set({plugins: [GravityChartsPlugin]}); + }); + + test('should render chart with valid data', async () => { + const data: ChartData = { + series: { + data: [ + { + type: 'line', + name: 'Line 1', + data: [ + {x: 0, y: 100}, + {x: 2, y: 80}, + {x: 3, y: 120}, + ], + }, + ], + }, + }; + const screen = await render(); + await expect(screen.getByTestId(CHART_TEST_STORY_DATA_QA)).toMatchScreenshot(); + }); + + test('should display "No data" when series is empty', async () => { + const data: ChartData = {series: {data: []}}; + const screen = await render(); + await expect.element(screen.getByText('No data')).toBeVisible(); + }); +}); diff --git a/src/plugins/gravity-charts/__tests__/ChartTestStory.tsx b/src/plugins/gravity-charts/__tests__/ChartTestStory.tsx new file mode 100644 index 00000000..f673c3b0 --- /dev/null +++ b/src/plugins/gravity-charts/__tests__/ChartTestStory.tsx @@ -0,0 +1,27 @@ +import React from 'react'; + +import type {ChartData} from '@gravity-ui/charts'; + +import {ChartKit} from '../../../components/ChartKit.js'; + +export const CHART_TEST_STORY_DATA_QA = 'chart-test-story-data-qa'; + +type Props = { + data: ChartData; + styles?: React.CSSProperties; + tooltip?: {splitted?: boolean}; +}; + +export const ChartTestStory = ({data, styles, tooltip}: Props) => { + const containerStyle: React.CSSProperties = { + height: '100vh', + width: '100vw', + ...styles, + }; + + return ( +
+ +
+ ); +}; diff --git a/src/plugins/gravity-charts/__tests__/GravityCharts.visual.test.tsx b/src/plugins/gravity-charts/__tests__/GravityCharts.visual.test.tsx deleted file mode 100644 index 71dda8f9..00000000 --- a/src/plugins/gravity-charts/__tests__/GravityCharts.visual.test.tsx +++ /dev/null @@ -1,38 +0,0 @@ -import React from 'react'; - -import type {ChartData} from '@gravity-ui/charts'; - -import {render} from '../../../../test-utils/utils.js'; - -import {TestStory} from './TestStory.visual.js'; - -const VALID_CHART_DATA = { - series: { - data: [ - { - type: 'line', - data: [{x: 0, y: 100}], - }, - ], - }, - xAxis: { - type: 'category', - categories: ['A'], - }, -} as ChartData; - -test('Validation should work when updating chart data (empty series)', async () => { - const screen = await render(); - - const emptyData = { - series: { - data: [], - }, - xAxis: { - type: 'category', - }, - }; - - await screen.getByRole('textbox').fill(JSON.stringify(emptyData)); - await expect.element(screen.getByText('No data')).toBeVisible(); -}); diff --git a/src/plugins/gravity-charts/__tests__/TestStory.visual.tsx b/src/plugins/gravity-charts/__tests__/TestStory.visual.tsx deleted file mode 100644 index 5c62d9a2..00000000 --- a/src/plugins/gravity-charts/__tests__/TestStory.visual.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import React, {ChangeEventHandler} from 'react'; - -import {ChartKit} from '../../../components/ChartKit'; -import {settings} from '../../../libs'; -import {GravityChartsPlugin} from '../index'; - -export const TestStory = (props: any) => { - const [chartData, setChartData] = React.useState(props.data); - const [loading, setLoading] = React.useState(true); - - React.useEffect(() => { - settings.set({plugins: [GravityChartsPlugin]}); - setLoading(false); - }, []); - - const updateData: ChangeEventHandler = (event) => { - const value = event.target.value; - setChartData(JSON.parse(value)); - }; - - if (loading) { - return loading; - } - - return ( -
- - -
- ); -}; From 890b1252d875489a150342e6ba28942e438fad53 Mon Sep 17 00:00:00 2001 From: Evgenii Alaev Date: Thu, 19 Mar 2026 13:59:49 +0100 Subject: [PATCH 3/3] feat(gravity-charts): improve split tooltip UX --- src/components/SplitPane/StyledSplitPane.scss | 26 ++++++- ...-in-album-orientation-1-chromium-linux.png | Bin 0 -> 69034 bytes ...-portrait-orientation-1-chromium-linux.png | Bin 0 -> 25558 bytes .../__tests__/SplitTooltip.visual.test.tsx | 50 +++++++++++++ .../__stories__/SplitTooltip.stories.tsx | 70 ++++++++++++------ .../renderer/withSplitPane/withSplitPane.tsx | 9 ++- 6 files changed, 127 insertions(+), 28 deletions(-) create mode 100644 src/plugins/gravity-charts/__screenshots__/SplitTooltip.visual.test.tsx-screenshots/Split-tooltip-visual-tests-should-render-tooltip-in-album-orientation-1-chromium-linux.png create mode 100644 src/plugins/gravity-charts/__screenshots__/SplitTooltip.visual.test.tsx-screenshots/Split-tooltip-visual-tests-should-render-tooltip-in-portrait-orientation-1-chromium-linux.png create mode 100644 src/plugins/gravity-charts/__tests__/SplitTooltip.visual.test.tsx diff --git a/src/components/SplitPane/StyledSplitPane.scss b/src/components/SplitPane/StyledSplitPane.scss index 1e927872..c3c0bfc8 100644 --- a/src/components/SplitPane/StyledSplitPane.scss +++ b/src/components/SplitPane/StyledSplitPane.scss @@ -3,7 +3,16 @@ .styled-split-pane { &__pane-resizer { - background: var(--g-color-base-generic); + background: linear-gradient( + to right, + var(--g-color-base-generic), + var(--g-color-base-generic) + ), + linear-gradient( + to right, + var(--g-color-base-background), + var(--g-color-base-background) + ); z-index: 1; box-sizing: border-box; position: relative; @@ -44,12 +53,23 @@ height: 100%; width: 1px; min-width: 1px; - background: var(--data-table-border-color); } } .Pane { height: 100%; - background: var(--ck-split-pane-background); + } + + .Pane2 { + background: linear-gradient( + to right, + var(--g-color-infographics-tooltip-bg), + var(--g-color-infographics-tooltip-bg) + ), + linear-gradient( + to right, + var(--g-color-base-background), + var(--g-color-base-background) + ); } } diff --git a/src/plugins/gravity-charts/__screenshots__/SplitTooltip.visual.test.tsx-screenshots/Split-tooltip-visual-tests-should-render-tooltip-in-album-orientation-1-chromium-linux.png b/src/plugins/gravity-charts/__screenshots__/SplitTooltip.visual.test.tsx-screenshots/Split-tooltip-visual-tests-should-render-tooltip-in-album-orientation-1-chromium-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..aceb41787e43333114ab7f081d8140424e296790 GIT binary patch literal 69034 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 KAKm?@7yciVv=e^- literal 0 HcmV?d00001 diff --git a/src/plugins/gravity-charts/__screenshots__/SplitTooltip.visual.test.tsx-screenshots/Split-tooltip-visual-tests-should-render-tooltip-in-portrait-orientation-1-chromium-linux.png b/src/plugins/gravity-charts/__screenshots__/SplitTooltip.visual.test.tsx-screenshots/Split-tooltip-visual-tests-should-render-tooltip-in-portrait-orientation-1-chromium-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..64c318a6a0585694ad2b7c6a22c562f1a6d93c77 GIT binary patch literal 25558 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 BgA)J% literal 0 HcmV?d00001 diff --git a/src/plugins/gravity-charts/__tests__/SplitTooltip.visual.test.tsx b/src/plugins/gravity-charts/__tests__/SplitTooltip.visual.test.tsx new file mode 100644 index 00000000..c1ed2ea9 --- /dev/null +++ b/src/plugins/gravity-charts/__tests__/SplitTooltip.visual.test.tsx @@ -0,0 +1,50 @@ +import React from 'react'; + +import type {ChartData} from '@gravity-ui/charts'; +import {page} from 'vitest/browser'; + +import {render} from '../../../../test-utils/utils.js'; +import {settings} from '../../../libs/index.js'; +import {GravityChartsPlugin} from '../index.js'; + +import {CHART_TEST_STORY_DATA_QA, ChartTestStory} from './ChartTestStory.js'; + +const SPLIT_TOOLTIP_DATA: ChartData = { + series: { + data: [ + { + type: 'bar-x', + name: 'Series 1', + data: [ + {x: 0, y: 40}, + {x: 1, y: 55}, + ], + }, + ], + }, + xAxis: {type: 'category', categories: ['A', 'B']}, +}; + +describe('Split tooltip visual tests', () => { + beforeAll(() => { + settings.set({plugins: [GravityChartsPlugin]}); + }); + + test('should render tooltip in album orientation', async () => { + await page.viewport(600, 280); + const screen = await render( + , + {providers: {theme: 'dark'}}, + ); + await expect(screen.getByTestId(CHART_TEST_STORY_DATA_QA)).toMatchScreenshot(); + }); + + test('should render tooltip in portrait orientation', async () => { + await page.viewport(280, 400); + const screen = await render( + , + {providers: {theme: 'dark'}}, + ); + await expect(screen.getByTestId(CHART_TEST_STORY_DATA_QA)).toMatchScreenshot(); + }); +}); diff --git a/src/plugins/gravity-charts/renderer/__stories__/SplitTooltip.stories.tsx b/src/plugins/gravity-charts/renderer/__stories__/SplitTooltip.stories.tsx index 7d08ec7f..41243cae 100644 --- a/src/plugins/gravity-charts/renderer/__stories__/SplitTooltip.stories.tsx +++ b/src/plugins/gravity-charts/renderer/__stories__/SplitTooltip.stories.tsx @@ -6,39 +6,63 @@ import {ChartKit} from '../../../../components/ChartKit'; import {StoryWrapper} from './StoryWrapper'; -function getPieSegmentData(name: string, color: string, index: number) { +const MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']; + +function generateBarXData() { + const categories = MONTHS; + const revenue = categories.map((_, i) => ({ + x: i, + y: 40 + Math.sin(i * 0.5) * 25 + (i % 5) * 2, + })); + const expenses = categories.map((_, i) => ({ + x: i, + y: 25 + Math.cos(i * 0.3) * 15 + (i % 3) * 3, + })); + const profit = categories.map((_, i) => ({ + x: i, + y: (revenue[i].y as number) - (expenses[i].y as number), + })); + return { - name, - value: index * 10, - label: name, - color: color, + categories, + series: [ + {name: 'Revenue', color: '#4DA2F1', data: revenue}, + {name: 'Expenses', color: '#FF3D64', data: expenses}, + {name: 'Profit', color: '#8AD554', data: profit}, + ], }; } -export const SplitTooltipBasic: StoryObj = { - name: 'Basic', +const barXData = generateBarXData(); + +export const SplitTooltipBarX: StoryObj = { + name: 'Bar-X with crosshair', render: () => { return ( - + ({ + type: 'bar-x' as const, + name: s.name, + color: s.color, + stacking: 'normal', + data: s.data, + })), + }, + legend: {enabled: false}, + xAxis: { + type: 'category', + categories: barXData.categories, + crosshair: {enabled: true}, + }, + tooltip: { + valueFormat: { + precision: 2, + type: 'number', + }, }, }} tooltip={{splitted: true}} diff --git a/src/plugins/gravity-charts/renderer/withSplitPane/withSplitPane.tsx b/src/plugins/gravity-charts/renderer/withSplitPane/withSplitPane.tsx index 2a611806..2af86d50 100644 --- a/src/plugins/gravity-charts/renderer/withSplitPane/withSplitPane.tsx +++ b/src/plugins/gravity-charts/renderer/withSplitPane/withSplitPane.tsx @@ -63,7 +63,9 @@ const SplitPaneContent = ( const containerHeight = height; if (containerHeight - RESIZER_HEIGHT === size) { setSize(containerHeight - RESIZER_HEIGHT - tooltipHeight); - chartRef.current?.reflow(); + queueMicrotask(() => { + chartRef.current?.reflow({immediate: true}); + }); } } @@ -104,6 +106,9 @@ const SplitPaneContent = ( }; return { + defaultState: { + hoveredPosition: {x: 0, y: 0}, + }, ...data, chart: { ...data.chart, @@ -116,7 +121,7 @@ const SplitPaneContent = ( ...data.tooltip, enabled: false, }, - }; + } satisfies ChartData; }, [data]); const handleOrientationChange = React.useCallback(() => {