From a4dad801a2326b86786434c2cbb0a23d1c50ff6d Mon Sep 17 00:00:00 2001 From: Scott Cooper Date: Wed, 19 Nov 2025 17:41:09 -0800 Subject: [PATCH] test(releases): Move release comparison off deprecated route props --- .../views/releases/detail/overview/index.tsx | 2 - .../releaseComparisonChart/index.spec.tsx | 76 +++++++------------ .../overview/releaseComparisonChart/index.tsx | 10 +-- 3 files changed, 33 insertions(+), 55 deletions(-) diff --git a/static/app/views/releases/detail/overview/index.tsx b/static/app/views/releases/detail/overview/index.tsx index aa4ad0e0fd3425..6c1d041dfa6bfd 100644 --- a/static/app/views/releases/detail/overview/index.tsx +++ b/static/app/views/releases/detail/overview/index.tsx @@ -368,12 +368,10 @@ function ReleaseOverview() { releaseSessions={thisRelease} allSessions={allReleases} platform={project.platform} - location={location} loading={loading} reloading={reloading} errored={errored} project={project} - organization={organization} api={api} hasHealthData={hasHealthData} /> diff --git a/static/app/views/releases/detail/overview/releaseComparisonChart/index.spec.tsx b/static/app/views/releases/detail/overview/releaseComparisonChart/index.spec.tsx index b276f6249a19b1..4849003e17caec 100644 --- a/static/app/views/releases/detail/overview/releaseComparisonChart/index.spec.tsx +++ b/static/app/views/releases/detail/overview/releaseComparisonChart/index.spec.tsx @@ -1,19 +1,29 @@ +import {OrganizationFixture} from 'sentry-fixture/organization'; +import {ProjectFixture} from 'sentry-fixture/project'; import {ReleaseFixture} from 'sentry-fixture/release'; import { SessionUserCountByStatus2Fixture, SessionUserCountByStatusFixture, } from 'sentry-fixture/sessions'; -import {initializeOrg} from 'sentry-test/initializeOrg'; -import {act, render, screen, userEvent} from 'sentry-test/reactTestingLibrary'; +import {render, screen, userEvent} from 'sentry-test/reactTestingLibrary'; +import type {RouterConfig} from 'sentry-test/reactTestingLibrary'; import type {ReleaseProject} from 'sentry/types/release'; import ReleaseComparisonChart from 'sentry/views/releases/detail/overview/releaseComparisonChart'; describe('Releases > Detail > Overview > ReleaseComparison', () => { - const {router, organization, project: rawProject} = initializeOrg(); - const api = new MockApiClient(); + const organization = OrganizationFixture(); + const rawProject = ProjectFixture(); const release = ReleaseFixture(); + const initialRouterConfig: RouterConfig = { + location: { + pathname: `/organizations/${organization.slug}/releases/${release.version}/`, + query: {}, + }, + routes: ['/organizations/:orgId/releases/:release/'], + }; + const api = new MockApiClient(); const releaseSessions = SessionUserCountByStatusFixture(); const allSessions = SessionUserCountByStatus2Fixture(); @@ -32,18 +42,16 @@ describe('Releases > Detail > Overview > ReleaseComparison', () => { releaseSessions={releaseSessions} allSessions={allSessions} platform="javascript" - location={{...router.location, query: {}}} loading={false} reloading={false} errored={false} project={project} - organization={organization} api={api} hasHealthData />, { - router, - deprecatedRouterMocks: true, + organization, + initialRouterConfig, } ); @@ -63,48 +71,29 @@ describe('Releases > Detail > Overview > ReleaseComparison', () => { }); it('can change chart by clicking on a row', async () => { - const {rerender} = render( + const {router} = render( , { - router, - deprecatedRouterMocks: true, + organization, + initialRouterConfig, } ); await userEvent.click(screen.getByLabelText(/crash free user rate/i)); - expect(router.push).toHaveBeenCalledWith( - expect.objectContaining({query: {chart: 'crashFreeUsers'}}) - ); - - rerender( - + expect(router.location.query).toEqual( + expect.objectContaining({chart: 'crashFreeUsers'}) ); expect(screen.getByLabelText('Chart Title')).toHaveTextContent( @@ -120,18 +109,16 @@ describe('Releases > Detail > Overview > ReleaseComparison', () => { releaseSessions={releaseSessions} allSessions={allSessions} platform="javascript" - location={{...router.location, query: {}}} loading={false} reloading={false} errored={false} project={project} - organization={organization} api={api} hasHealthData />, { - router, - deprecatedRouterMocks: true, + organization, + initialRouterConfig, } ); @@ -171,6 +158,9 @@ describe('Releases > Detail > Overview > ReleaseComparison', () => { url: `/organizations/${organization.slug}/issues-count/`, body: 0, }); + const noHealthDataOrganization = OrganizationFixture({ + features: [...organization.features, 'discover-basic'], + }); render( Detail > Overview > ReleaseComparison', () => { releaseSessions={null} allSessions={null} platform="javascript" - location={{...router.location, query: {}}} loading={false} reloading={false} errored={false} project={project} - organization={{ - ...organization, - features: [...organization.features, 'discover-basic'], - }} api={api} hasHealthData={false} />, { - router, - deprecatedRouterMocks: true, + organization: noHealthDataOrganization, + initialRouterConfig, } ); - expect(screen.getAllByRole('radio')).toHaveLength(1); + expect(await screen.findAllByRole('radio')).toHaveLength(1); expect(screen.queryByLabelText(/toggle chart/i)).not.toBeInTheDocument(); expect(screen.queryByLabelText(/toggle additional/i)).not.toBeInTheDocument(); - - // Wait for api requests to propegate - await act(tick); }); }); diff --git a/static/app/views/releases/detail/overview/releaseComparisonChart/index.tsx b/static/app/views/releases/detail/overview/releaseComparisonChart/index.tsx index a51960208184de..0ce895d8425a8d 100644 --- a/static/app/views/releases/detail/overview/releaseComparisonChart/index.tsx +++ b/static/app/views/releases/detail/overview/releaseComparisonChart/index.tsx @@ -1,7 +1,6 @@ import React, {Fragment, useCallback, useEffect, useMemo, useState} from 'react'; import styled from '@emotion/styled'; import * as Sentry from '@sentry/react'; -import type {Location} from 'history'; import type {Client} from 'sentry/api'; import ErrorPanel from 'sentry/components/charts/errorPanel'; @@ -20,7 +19,6 @@ import {space} from 'sentry/styles/space'; import { SessionFieldWithOperation, SessionStatus, - type Organization, type SessionApiResponse, } from 'sentry/types/organization'; import type {PlatformKey} from 'sentry/types/project'; @@ -38,7 +36,9 @@ import {decodeList, decodeScalar} from 'sentry/utils/queryString'; import {getCount, getCrashFreeRate, getSessionStatusRate} from 'sentry/utils/sessions'; import type {Color} from 'sentry/utils/theme'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; +import {useLocation} from 'sentry/utils/useLocation'; import {useNavigate} from 'sentry/utils/useNavigate'; +import useOrganization from 'sentry/utils/useOrganization'; import { displaySessionStatusPercent, getReleaseBounds, @@ -69,8 +69,6 @@ type Props = { errored: boolean; hasHealthData: boolean; loading: boolean; - location: Location; - organization: Organization; platform: PlatformKey; project: ReleaseProject; release: ReleaseWithHealth; @@ -98,14 +96,14 @@ export default function ReleaseComparisonChart({ releaseSessions, allSessions, platform, - location, loading, reloading, errored, api, - organization, hasHealthData, }: Props) { + const organization = useOrganization(); + const location = useLocation(); const navigate = useNavigate(); const [issuesTotals, setIssuesTotals] = useState(null); const [eventsTotals, setEventsTotals] = useState(null);