From e068aea9bb4375196730811ea05d078af1438026 Mon Sep 17 00:00:00 2001 From: JonasBa Date: Thu, 10 Apr 2025 16:39:05 -0400 Subject: [PATCH] Reapply "admin: drop deprecated usage od DropdownActions (#89197)" This reverts commit 6aa7721df4497867abba3290bb85c51b0d5ee069. --- static/gsAdmin/components/dropdownActions.tsx | 119 +++++------- .../components/policies/policyRevisions.tsx | 25 ++- static/gsAdmin/views/customerDetails.spec.tsx | 183 ++++++++---------- static/gsAdmin/views/docIntegrations.spec.tsx | 34 ++-- static/gsAdmin/views/invoiceDetails.spec.tsx | 40 +--- static/gsAdmin/views/policyDetails.spec.tsx | 9 +- .../gsAdmin/views/relocationDetails.spec.tsx | 4 +- static/gsAdmin/views/userDetails.spec.tsx | 2 +- 8 files changed, 167 insertions(+), 249 deletions(-) diff --git a/static/gsAdmin/components/dropdownActions.tsx b/static/gsAdmin/components/dropdownActions.tsx index 17b1f621f44dfd..ab785d9960fde5 100644 --- a/static/gsAdmin/components/dropdownActions.tsx +++ b/static/gsAdmin/components/dropdownActions.tsx @@ -1,38 +1,11 @@ -import {css} from '@emotion/react'; import styled from '@emotion/styled'; -import DropdownAutoComplete from 'sentry/components/dropdownAutoComplete'; -import DropdownButton from 'sentry/components/dropdownButton'; -import {Tooltip} from 'sentry/components/tooltip'; +import {CompactSelect, type SelectOption} from 'sentry/components/core/compactSelect'; import {IconNot} from 'sentry/icons'; import {space} from 'sentry/styles/space'; import {openAdminConfirmModal} from 'admin/components/adminConfirmationModal'; -const ActionName = styled('div')` - display: flex; - align-items: center; - gap: ${space(0.5)}; -`; - -const ActionLabel = styled('div')<{isDisabled: boolean}>` - width: 350px; - ${p => - p.isDisabled && - css` - color: ${p.theme.subText}; - svg { - color: ${p.theme.red200}; - } - `} -`; - -const HelpText = styled('div')` - font-size: ${p => p.theme.fontSizeSmall}; - color: ${p => p.theme.subText}; - line-height: 1.2; -`; - type Props = { actions: Array<{ key: string; @@ -48,20 +21,44 @@ type Props = { label?: string; }; -function DropdownActions({actions, label}: Props) { - return ( - { - const action = actions.find(a => a.key === value); +/** + * Map actions to a format that can be used by the CompactSelect component. This exists + * because this used a component with a different signature, and I + */ +function mapActionsToCompactSelect( + actions: Props['actions'] +): Array> { + return actions + .map(action => { + if (action.visible === false) { + return null; + } - if (action === undefined) { - return; - } + return { + value: action.key, + label: ( +
+ {action.name} + +
+ ), + details: action.help, + disabled: action.disabled, + tooltip: action.disabled ? action.disabledReason : undefined, + help: action.help, + }; + }) + .filter(Boolean) as Array>; +} - if (action.disabled) { +function DropdownActions({actions, label}: Props) { + return ( + { + const action = actions.find(a => a.key === option.value); + if (!action || action.disabled) { return; } @@ -83,41 +80,15 @@ function DropdownActions({actions, label}: Props) { onConfirm: action.onAction, }); }} - items={actions - .filter(action => action.visible !== false) - .map(action => { - const actionLabel = ( - - - {action.name} - {action.disabled && ( - - - - )} - - {action.help && {action.help}} - - ); - - return { - value: action.key, - searchKey: action.name, - label: actionLabel, - }; - })} - > - {({isOpen}) => ( - - {label} - - )} - + triggerLabel={label} + /> ); } export default DropdownActions; + +const StyledIconNot = styled(IconNot)` + color: ${p => p.theme.red200}; + margin-left: ${space(0.5)}; + transform: translateY(2px); +`; diff --git a/static/gsAdmin/components/policies/policyRevisions.tsx b/static/gsAdmin/components/policies/policyRevisions.tsx index bdc9fd8b2c1f01..d537d7e77bf759 100644 --- a/static/gsAdmin/components/policies/policyRevisions.tsx +++ b/static/gsAdmin/components/policies/policyRevisions.tsx @@ -2,10 +2,10 @@ import styled from '@emotion/styled'; import moment from 'moment-timezone'; import {Tag} from 'sentry/components/core/badge/tag'; +import {Button} from 'sentry/components/core/button'; import ExternalLink from 'sentry/components/links/externalLink'; import {space} from 'sentry/styles/space'; -import DropdownActions from 'admin/components/dropdownActions'; import ResultGrid from 'admin/components/resultGrid'; import type {Policy, PolicyRevision} from 'getsentry/types'; @@ -37,18 +37,17 @@ const getRow = ({row, policy, onUpdate}: RowProps) => {
, - onUpdate({current: true}, row.version), - }, - ]} - /> + , ]; }; diff --git a/static/gsAdmin/views/customerDetails.spec.tsx b/static/gsAdmin/views/customerDetails.spec.tsx index 497400a6a407fe..671f00dfa2666c 100644 --- a/static/gsAdmin/views/customerDetails.spec.tsx +++ b/static/gsAdmin/views/customerDetails.spec.tsx @@ -1137,7 +1137,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByRole('option', {name: /Start Trial/})).toBeInTheDocument(); @@ -1177,7 +1177,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); await userEvent.click(screen.getByText('Convert to Sponsored')); @@ -1224,16 +1224,16 @@ describe('Customer Details', function () { await screen.findByRole('heading', {name: 'Customers'}); await userEvent.click( - screen.getAllByRole('button', {name: 'Customers Actions'})[1]! + screen.getAllByRole('button', {name: 'Customers Actions'})[0]! ); - expect(screen.getByTestId('action-changeSoftCap')).toHaveAttribute( + expect(screen.getByTestId('changeSoftCap')).toHaveAttribute( 'aria-disabled', 'true' ); await userEvent.hover( - within(screen.getByTestId('action-changeSoftCap')).getByTestId('icon-not') + within(screen.getByTestId('changeSoftCap')).getByText('Add Legacy Soft Cap') ); expect( @@ -1262,7 +1262,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByText('Add Legacy Soft Cap')).toBeInTheDocument(); @@ -1322,7 +1322,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); await userEvent.click(screen.getByText('Add Legacy Soft Cap')); @@ -1371,7 +1371,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); await userEvent.click(screen.getByText('Remove Legacy Soft Cap')); @@ -1427,7 +1427,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByText('Disable Overage Notification')).toBeInTheDocument(); @@ -1458,7 +1458,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByText('Enable Overage Notification')).toBeInTheDocument(); @@ -1495,7 +1495,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); await userEvent.click(screen.getByText('Disable Overage Notification')); @@ -1547,7 +1547,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -1593,7 +1593,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByText('Clear Pending Changes')).toBeInTheDocument(); @@ -1619,7 +1619,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.queryByText('Clear Pending Changes')).not.toBeInTheDocument(); @@ -1649,7 +1649,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByRole('option', {name: /Allow Trial/})).toBeInTheDocument(); @@ -1675,7 +1675,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.queryByRole('option', {name: /Allow Trial/})).not.toBeInTheDocument(); @@ -1701,7 +1701,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.queryByRole('option', {name: /Allow Trial/})).not.toBeInTheDocument(); @@ -1733,7 +1733,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -1779,7 +1779,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByText('Allow Grace Period')).toBeInTheDocument(); @@ -1805,16 +1805,13 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - expect(screen.getByTestId('action-allowGrace')).toHaveAttribute( - 'aria-disabled', - 'true' - ); + expect(screen.getByTestId('allowGrace')).toHaveAttribute('aria-disabled', 'true'); await userEvent.hover( - within(screen.getByTestId('action-allowGrace')).getByTestId('icon-not') + within(screen.getByTestId('allowGrace')).getByText('Allow Grace Period') ); expect( @@ -1848,7 +1845,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -1900,16 +1897,16 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - expect(screen.getByTestId('action-terminateContract')).toHaveAttribute( + expect(screen.getByTestId('terminateContract')).toHaveAttribute( 'aria-disabled', 'true' ); await userEvent.hover( - within(screen.getByTestId('action-terminateContract')).getByTestId('icon-not') + within(screen.getByTestId('terminateContract')).getByText('Terminate Contract') ); expect( @@ -1947,13 +1944,10 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - expect(screen.getByTestId('action-terminateContract')).toHaveAttribute( - 'aria-disabled', - 'false' - ); + expect(screen.getByTestId('terminateContract')).toBeEnabled(); }); it("terminates an organization's contract", async function () { @@ -1992,7 +1986,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); await userEvent.click(screen.getByText('Terminate Contract')); @@ -2041,7 +2035,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -2106,7 +2100,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -2187,7 +2181,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -2267,7 +2261,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -2344,7 +2338,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -2387,7 +2381,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -2464,7 +2458,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -2516,7 +2510,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByText('Cancel Subscription')).toBeInTheDocument(); @@ -2546,7 +2540,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); await userEvent.click(screen.getByText('Cancel Subscription')); @@ -2625,12 +2619,9 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! - ); - expect(screen.getByTestId('action-changePlan')).toHaveAttribute( - 'aria-disabled', - 'false' + })[0]! ); + expect(screen.getByTestId('changePlan')).toBeEnabled(); }); it('is enabled for deactivated partner account', async function () { @@ -2680,12 +2671,9 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! - ); - expect(screen.getByTestId('action-changePlan')).toHaveAttribute( - 'aria-disabled', - 'false' + })[0]! ); + expect(screen.getByTestId('changePlan')).toBeEnabled(); }); it('is disabled for active, non-XX partner account', async function () { @@ -2723,13 +2711,10 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - expect(screen.getByTestId('action-changePlan')).toHaveAttribute( - 'aria-disabled', - 'true' - ); + expect(screen.getByTestId('changePlan')).toHaveAttribute('aria-disabled', 'true'); }); }); @@ -2762,7 +2747,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -2804,10 +2789,10 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - expect(screen.getByTestId('action-endTrialEarly')).toHaveAttribute( + expect(screen.getByTestId('endTrialEarly')).toHaveAttribute( 'aria-disabled', 'true' ); @@ -2857,7 +2842,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByText('Disable On Demand Billing')).toBeInTheDocument(); @@ -2896,7 +2881,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByText('Enable On Demand Billing')).toBeInTheDocument(); @@ -2935,7 +2920,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.queryByText('Enable On Demand Billing')).not.toBeInTheDocument(); @@ -2979,7 +2964,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -3039,7 +3024,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -3089,7 +3074,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); await userEvent.click(screen.getByText('Convert to Sponsored')); @@ -3159,7 +3144,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); await userEvent.click(screen.getByText('Convert to Sponsored')); @@ -3212,10 +3197,10 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - expect(screen.getByTestId('action-convertToSponsored')).toHaveAttribute( + expect(screen.getByTestId('convertToSponsored')).toHaveAttribute( 'aria-disabled', 'true' ); @@ -3246,10 +3231,10 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - await userEvent.click(screen.getByTestId(`action-gift-${dataCategory}`)); + await userEvent.click(screen.getByTestId(`gift-${dataCategory}`)); expect( await screen.findByText( @@ -3284,7 +3269,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); const freeEventsKey = FREE_EVENTS_KEYS[DataCategory.ERRORS]; @@ -3294,7 +3279,7 @@ describe('Customer Details', function () { body: {...organization, [freeEventsKey]: 26000}, }); - await userEvent.click(screen.getByTestId(`action-gift-${DataCategory.ERRORS}`)); + await userEvent.click(screen.getByTestId(`gift-${DataCategory.ERRORS}`)); expect(screen.getByText('Total: 0')).toBeInTheDocument(); @@ -3344,7 +3329,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); const freeEventsKey = FREE_EVENTS_KEYS[DataCategory.TRANSACTIONS]; @@ -3354,9 +3339,7 @@ describe('Customer Details', function () { body: {...organization, [freeEventsKey]: 26000}, }); - await userEvent.click( - screen.getByTestId(`action-gift-${DataCategory.TRANSACTIONS}`) - ); + await userEvent.click(screen.getByTestId(`gift-${DataCategory.TRANSACTIONS}`)); expect(screen.getByText('Total: 0')).toBeInTheDocument(); @@ -3408,7 +3391,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); const freeEventsKey = FREE_EVENTS_KEYS[DataCategory.REPLAYS]; @@ -3418,7 +3401,7 @@ describe('Customer Details', function () { body: {...organization, [freeEventsKey]: 50}, }); - await userEvent.click(screen.getByTestId(`action-gift-${DataCategory.REPLAYS}`)); + await userEvent.click(screen.getByTestId(`gift-${DataCategory.REPLAYS}`)); expect(screen.getByText('Total: 0')).toBeInTheDocument(); @@ -3469,7 +3452,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); const freeEventsKey = FREE_EVENTS_KEYS[DataCategory.SPANS]; @@ -3479,7 +3462,7 @@ describe('Customer Details', function () { body: {...organization, [freeEventsKey]: 50}, }); - await userEvent.click(screen.getByTestId(`action-gift-${DataCategory.SPANS}`)); + await userEvent.click(screen.getByTestId(`gift-${DataCategory.SPANS}`)); expect(screen.getByText('Total: 0')).toBeInTheDocument(); @@ -3528,10 +3511,10 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - const item = screen.getByTestId(`action-gift-${DataCategory.SPANS_INDEXED}`); + const item = screen.getByTestId(`gift-${DataCategory.SPANS_INDEXED}`); expect(item).toBeInTheDocument(); expect(item).toHaveAttribute('aria-disabled', 'true'); }); @@ -3558,10 +3541,10 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); - const item = screen.getByTestId(`action-gift-${DataCategory.SPANS_INDEXED}`); + const item = screen.getByTestId(`gift-${DataCategory.SPANS_INDEXED}`); expect(item).toBeInTheDocument(); expect(item).toHaveAttribute('aria-disabled', 'true'); }); @@ -3589,7 +3572,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); const freeEventsKey = FREE_EVENTS_KEYS[DataCategory.MONITOR_SEATS]; @@ -3599,9 +3582,7 @@ describe('Customer Details', function () { body: {...organization, [freeEventsKey]: 50}, }); - await userEvent.click( - screen.getByTestId(`action-gift-${DataCategory.MONITOR_SEATS}`) - ); + await userEvent.click(screen.getByTestId(`gift-${DataCategory.MONITOR_SEATS}`)); expect(screen.getByText('Total: 0')).toBeInTheDocument(); @@ -3658,7 +3639,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect( @@ -3688,7 +3669,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.getByRole('button', {name: 'Oct 24, 2018'})).toBeInTheDocument(); @@ -3724,7 +3705,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); expect(screen.queryByText('Suspend Account')).not.toBeInTheDocument(); @@ -3756,7 +3737,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -3804,7 +3785,7 @@ describe('Customer Details', function () { await userEvent.click( screen.getAllByRole('button', { name: 'Customers Actions', - })[1]! + })[0]! ); renderGlobalModal(); @@ -3863,7 +3844,7 @@ describe('Customer Details', function () { await screen.findByRole('heading', {name: 'Customers'}); await userEvent.click( - screen.getAllByRole('button', {name: /customers actions/i})[1]! + screen.getAllByRole('button', {name: 'Customers Actions'})[0]! ); expect(screen.getByText('Gift to reserved budget')).toBeInTheDocument(); @@ -3891,7 +3872,7 @@ describe('Customer Details', function () { await screen.findByRole('heading', {name: 'Customers'}); await userEvent.click( - screen.getAllByRole('button', {name: /customers actions/i})[1]! + screen.getAllByRole('button', {name: 'Customers Actions'})[0]! ); expect(screen.queryByText('Gift to reserved budget')).not.toBeInTheDocument(); @@ -3927,7 +3908,7 @@ describe('Customer Details', function () { // Open actions dropdown and click gift budget action await userEvent.click( - screen.getAllByRole('button', {name: /customers actions/i})[1]! + screen.getAllByRole('button', {name: 'Customers Actions'})[0]! ); await userEvent.click(screen.getByText('Gift to reserved budget')); @@ -3992,7 +3973,7 @@ describe('Customer Details', function () { // Open the actions dropdown await userEvent.click( - screen.getAllByRole('button', {name: /customers actions/i})[1]! + screen.getAllByRole('button', {name: 'Customers Actions'})[0]! ); // The delete option should be present @@ -4022,7 +4003,7 @@ describe('Customer Details', function () { // Open the actions dropdown await userEvent.click( - screen.getAllByRole('button', {name: /customers actions/i})[1]! + screen.getAllByRole('button', {name: 'Customers Actions'})[0]! ); // The delete option should not be present diff --git a/static/gsAdmin/views/docIntegrations.spec.tsx b/static/gsAdmin/views/docIntegrations.spec.tsx index dc057b7a15c462..b598e9c00e5695 100644 --- a/static/gsAdmin/views/docIntegrations.spec.tsx +++ b/static/gsAdmin/views/docIntegrations.spec.tsx @@ -92,14 +92,11 @@ describe('Doc Integration Details', function () { await screen.findByRole('heading', {name: 'Doc Integrations'}) ).toBeInTheDocument(); - const button = screen.getByTestId('detail-actions'); - expect(button).toHaveAttribute('aria-expanded', 'false'); - await userEvent.click(button); - expect(button).toHaveAttribute('aria-expanded', 'true'); + await userEvent.click(await screen.findByText('Doc Integrations Actions')); - const deleteButton = screen.getByRole('option', { - name: 'Delete Doc Integration 🚨 Delete this Doc Integration FOREVER (irreversible) 🚨', - }); + const deleteButton = await screen.findByText( + /Delete this Doc Integration FOREVER \(irreversible\)/ + ); expect(deleteButton).toBeEnabled(); await userEvent.click(deleteButton); @@ -150,16 +147,13 @@ describe('Doc Integration Details', function () { await screen.findByRole('heading', {name: 'Doc Integrations'}) ).toBeInTheDocument(); - const button = screen.getByTestId('detail-actions'); - expect(button).toHaveAttribute('aria-expanded', 'false'); + const button = await screen.findByText('Doc Integrations Actions'); await userEvent.click(button); - expect(button).toHaveAttribute('aria-expanded', 'true'); - const deleteButton = screen.getByRole('option', { - name: 'Delete Doc Integration 🚨 Delete this Doc Integration FOREVER (irreversible) 🚨', - }); + const deleteButton = await screen.findByText( + /Delete this Doc Integration FOREVER \(irreversible\)/ + ); - expect(deleteButton).toBeEnabled(); await userEvent.click(deleteButton); renderGlobalModal(); @@ -208,16 +202,12 @@ describe('Doc Integration Details', function () { await screen.findByRole('heading', {name: 'Doc Integrations'}) ).toBeInTheDocument(); - const button = screen.getByTestId('detail-actions'); - expect(button).toHaveAttribute('aria-expanded', 'false'); - await userEvent.click(button); - expect(button).toHaveAttribute('aria-expanded', 'true'); + await userEvent.click(await screen.findByText('Doc Integrations Actions')); - const unpublishButton = screen.getByRole('option', { - name: 'Unpublish App Revert This Doc Integration to Draft Mode', - }); + const unpublishButton = await screen.findByText( + 'Revert This Doc Integration to Draft Mode' + ); - expect(unpublishButton).toBeEnabled(); await userEvent.click(unpublishButton); expect(indicators.addSuccessMessage).toHaveBeenCalledWith( diff --git a/static/gsAdmin/views/invoiceDetails.spec.tsx b/static/gsAdmin/views/invoiceDetails.spec.tsx index bd9dea98bcd4ac..6f55b8ebf27501 100644 --- a/static/gsAdmin/views/invoiceDetails.spec.tsx +++ b/static/gsAdmin/views/invoiceDetails.spec.tsx @@ -70,14 +70,10 @@ describe('InvoiceDetails', function () { render(, {router}); - expect( - await screen.findAllByRole('button', {name: 'Invoices Actions'}) - ).toHaveLength(2); - await userEvent.click( - screen.getAllByRole('button', {name: 'Invoices Actions'})[0]! + await screen.findByRole('button', {name: 'Invoices Actions'}) ); - await userEvent.click(screen.getByTestId('action-closeInvoice')); + await userEvent.click(screen.getByText('Close Invoice')); renderGlobalModal(); await userEvent.click(screen.getByTestId('confirm-button')); @@ -105,15 +101,11 @@ describe('InvoiceDetails', function () { render(, {router}); - expect( - await screen.findAllByRole('button', {name: 'Invoices Actions'}) - ).toHaveLength(2); - await userEvent.click( - screen.getAllByRole('button', {name: 'Invoices Actions'})[0]! + await screen.findByRole('button', {name: 'Invoices Actions'}) ); - expect(screen.getByTestId('action-closeInvoice')).toHaveAttribute( + expect(await screen.findByTestId('closeInvoice')).toHaveAttribute( 'aria-disabled', 'true' ); @@ -141,15 +133,11 @@ describe('InvoiceDetails', function () { render(, {router}); - expect( - await screen.findAllByRole('button', {name: 'Invoices Actions'}) - ).toHaveLength(2); - await userEvent.click( - screen.getAllByRole('button', {name: 'Invoices Actions'})[0]! + await screen.findByRole('button', {name: 'Invoices Actions'}) ); - expect(screen.getByTestId('action-closeInvoice')).toHaveAttribute( + expect(await screen.findByTestId('closeInvoice')).toHaveAttribute( 'aria-disabled', 'true' ); @@ -185,14 +173,10 @@ describe('InvoiceDetails', function () { render(, {router}); - expect( - await screen.findAllByRole('button', {name: 'Invoices Actions'}) - ).toHaveLength(2); - await userEvent.click( - screen.getAllByRole('button', {name: 'Invoices Actions'})[0]! + await screen.findByRole('button', {name: 'Invoices Actions'}) ); - await userEvent.click(screen.getByTestId('action-retryPayment')); + await userEvent.click(screen.getByText('Retry Payment')); renderGlobalModal(); await userEvent.click(screen.getByTestId('confirm-button')); @@ -220,15 +204,11 @@ describe('InvoiceDetails', function () { render(, {router}); - expect( - await screen.findAllByRole('button', {name: 'Invoices Actions'}) - ).toHaveLength(2); - await userEvent.click( - screen.getAllByRole('button', {name: 'Invoices Actions'})[0]! + await screen.findByRole('button', {name: 'Invoices Actions'}) ); - expect(screen.getByTestId('action-retryPayment')).toHaveAttribute( + expect(await screen.findByTestId('retryPayment')).toHaveAttribute( 'aria-disabled', 'true' ); diff --git a/static/gsAdmin/views/policyDetails.spec.tsx b/static/gsAdmin/views/policyDetails.spec.tsx index e2b365f9c5dc34..d48bcc4dec700f 100644 --- a/static/gsAdmin/views/policyDetails.spec.tsx +++ b/static/gsAdmin/views/policyDetails.spec.tsx @@ -1,7 +1,7 @@ import {PoliciesFixture} from 'getsentry-test/fixtures/policies'; import {PolicyRevisionsFixture} from 'getsentry-test/fixtures/policyRevisions'; import {initializeOrg} from 'sentry-test/initializeOrg'; -import {render, screen, userEvent, within} from 'sentry-test/reactTestingLibrary'; +import {render, screen, userEvent} from 'sentry-test/reactTestingLibrary'; import PolicyDetails from 'admin/views/policyDetails'; @@ -33,12 +33,9 @@ describe('PolicyDetails', function () { render(, {router}); - expect(await screen.findAllByTestId('revision-actions')).toHaveLength(2); - + const buttons = await screen.findAllByText('Make current'); // Update current version - const revisionsSection = screen.getAllByTestId('revision-actions')[0]!; - await userEvent.click(within(revisionsSection).getAllByTestId('detail-actions')[0]!); - await userEvent.click(screen.getByTestId('action-make-current')); + await userEvent.click(buttons[0]!); expect(updateMock).toHaveBeenCalledWith( `/policies/${policy.slug}/revisions/${revisions[0]!.version}/`, diff --git a/static/gsAdmin/views/relocationDetails.spec.tsx b/static/gsAdmin/views/relocationDetails.spec.tsx index c7815608aac2a2..dd00a1ee500337 100644 --- a/static/gsAdmin/views/relocationDetails.spec.tsx +++ b/static/gsAdmin/views/relocationDetails.spec.tsx @@ -85,7 +85,7 @@ describe('Relocation Details', function () { ]); }); - it('renders', function () { + it('renders', async function () { const {router, routerProps} = initializeOrg(); const uuid = in_progress_relocation_uuid; const model = get_in_progress_relocation_model(); @@ -107,7 +107,7 @@ describe('Relocation Details', function () { } ); - expect(screen.getByRole('heading', {name: 'Relocation'})).toBeInTheDocument(); + expect(await screen.findByRole('heading', {name: 'Relocation'})).toBeInTheDocument(); expect(screen.getAllByText(uuid)).toHaveLength(1); expect(screen.getAllByText('SELF_HOSTED')).toHaveLength(1); diff --git a/static/gsAdmin/views/userDetails.spec.tsx b/static/gsAdmin/views/userDetails.spec.tsx index 6c20e4f60eeaae..c5e16e4ff0ef88 100644 --- a/static/gsAdmin/views/userDetails.spec.tsx +++ b/static/gsAdmin/views/userDetails.spec.tsx @@ -64,7 +64,7 @@ describe('User Details', function () { await userEvent.click( (await screen.findAllByRole('button', {name: 'Users Actions'}))[0]! ); - expect(screen.getByTestId('action-mergeAccounts')).toBeInTheDocument(); + expect(screen.getByText('Merge Accounts')).toBeInTheDocument(); expect(screen.queryByTestId('action-reactivate')).not.toBeInTheDocument(); });