diff --git a/src/workflows/SnapshotActionMenu.test.tsx b/src/workflows/SnapshotActionMenu.test.tsx index e84ab3c73f..b58280fa7a 100644 --- a/src/workflows/SnapshotActionMenu.test.tsx +++ b/src/workflows/SnapshotActionMenu.test.tsx @@ -7,7 +7,7 @@ import SnapshotActionMenu from 'src/workflows/SnapshotActionMenu'; const mockOnDelete = jest.fn(); const mockOnEditPermissions = jest.fn(); -describe('snapshot action menu delete', () => { +describe('snapshot action menu', () => { it('honors the disabled prop', async () => { // Act await act(async () => { @@ -37,18 +37,30 @@ describe('snapshot action menu delete', () => { render(); }); + // Assert const snapshotActionMenu = screen.getByRole('button', { name: 'Snapshot action menu' }); + expect(snapshotActionMenu).not.toHaveAttribute('disabled'); + expect(snapshotActionMenu).toHaveAttribute('aria-disabled', 'false'); + + // Act await user.click(snapshotActionMenu); + const editPermissionsButton = screen.getByRole('button', { name: 'Edit permissions' }); + + await user.pointer({ target: editPermissionsButton }); + + // Assert + expect(editPermissionsButton).toBeInTheDocument(); + expect(editPermissionsButton).toHaveAttribute('aria-disabled', 'false'); + expect(screen.queryByRole('tooltip')).not.toBeInTheDocument(); + + // Act const deleteSnapshotButton = screen.getByRole('button', { name: 'Delete snapshot' }); await user.pointer({ target: deleteSnapshotButton }); // Assert - expect(snapshotActionMenu).not.toHaveAttribute('disabled'); - expect(snapshotActionMenu).toHaveAttribute('aria-disabled', 'false'); - expect(deleteSnapshotButton).toBeInTheDocument(); expect(deleteSnapshotButton).toHaveAttribute('aria-disabled', 'false'); expect(screen.queryByRole('tooltip')).not.toBeInTheDocument(); @@ -65,8 +77,25 @@ describe('snapshot action menu delete', () => { ); }); - await user.click(screen.getByRole('button', { name: 'Snapshot action menu' })); + // Assert + const snapshotActionMenu = screen.getByRole('button', { name: 'Snapshot action menu' }); + + expect(snapshotActionMenu).not.toHaveAttribute('disabled'); + expect(snapshotActionMenu).toHaveAttribute('aria-disabled', 'false'); + + // Act + await user.click(snapshotActionMenu); + + const editPermissionsButton = screen.getByRole('button', { name: 'Edit permissions' }); + + await user.pointer({ target: editPermissionsButton }); + + // Assert + expect(editPermissionsButton).toBeInTheDocument(); + expect(editPermissionsButton).toHaveAttribute('aria-disabled', 'true'); + expect(screen.getByRole('tooltip')).toBeInTheDocument(); + // Act const deleteSnapshotButton = screen.getByRole('button', { name: 'Delete snapshot' }); await user.pointer({ target: deleteSnapshotButton }); @@ -76,8 +105,10 @@ describe('snapshot action menu delete', () => { expect(deleteSnapshotButton).toHaveAttribute('aria-disabled', 'true'); expect(screen.getByRole('tooltip')).toBeInTheDocument(); }); +}); - it('closes and calls the onDelete callback when you press the delete snapshot menu button', async () => { +describe('snapshot action menu edit permissions button', () => { + it('closes and calls the onEditPermissions callback when you press it', async () => { // Arrange const user: UserEvent = userEvent.setup(); @@ -87,16 +118,16 @@ describe('snapshot action menu delete', () => { }); await user.click(screen.getByRole('button', { name: 'Snapshot action menu' })); - await user.click(screen.getByRole('button', { name: 'Delete snapshot' })); + await user.click(screen.getByRole('button', { name: 'Edit permissions' })); - // Assert - expect(screen.queryByRole('button', { name: 'Delete snapshot' })).not.toBeInTheDocument(); - expect(mockOnDelete).toHaveBeenCalled(); + expect(screen.queryByRole('button', { name: 'Edit permissions' })).not.toBeInTheDocument(); + expect(mockOnEditPermissions).toHaveBeenCalled(); + expect(mockOnDelete).not.toHaveBeenCalled(); }); }); -describe('snapshot action menu edit permissions', () => { - it('closes and calls the onEditPermissions callback when you press the edit permissions menu button', async () => { +describe('snapshot action menu delete snapshot button', () => { + it('closes and calls the onDelete callback when you press it', async () => { // Arrange const user: UserEvent = userEvent.setup(); @@ -106,9 +137,11 @@ describe('snapshot action menu edit permissions', () => { }); await user.click(screen.getByRole('button', { name: 'Snapshot action menu' })); - await user.click(screen.getByRole('button', { name: 'Edit permissions' })); + await user.click(screen.getByRole('button', { name: 'Delete snapshot' })); - expect(screen.queryByRole('button', { name: 'Edit permissions' })).not.toBeInTheDocument(); - expect(mockOnEditPermissions).toHaveBeenCalled(); + // Assert + expect(screen.queryByRole('button', { name: 'Delete snapshot' })).not.toBeInTheDocument(); + expect(mockOnDelete).toHaveBeenCalled(); + expect(mockOnEditPermissions).not.toHaveBeenCalled(); }); });