@spinnaker/google 2026.3.1 → 2026.4.0

package/src/serverGroup/details/resize/GceResizeServerGroupModal.spec.tsx

@@ -1,7 +1,7 @@
-import { shallow } from 'enzyme';
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 import React from 'react';
 
-import { PlatformHealthOverride, ReactModal, TaskReason, UserVerification, ValidationMessage } from '@spinnaker/core';
+import { AccountService, ReactModal } from '@spinnaker/core';
 
 import {
   buildGceAutoscalerResizeRequest,
@@ -10,7 +10,23 @@ import {
   validateGceResizeValues,
 } from './GceResizeServerGroupModal';
 
+vi.mock('@spinnaker/core', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('@spinnaker/core')>();
+  const ReactModule = await import('react');
+  return {
+    ...actual,
+    TaskMonitorWrapper: ({ monitor }: any) =>
+      ReactModule.createElement(
+        'button',
+        { onClick: () => monitor.closeModal(), type: 'button' },
+        'Close monitored task',
+      ),
+  };
+});
+
 describe('GceResizeServerGroupModal', () => {
+  beforeEach(() => vi.spyOn(AccountService, 'challengeDestructiveActions').mockResolvedValue(true));
+
   it('rejects autoscaler minimum capacity greater than maximum capacity', () => {
     const serverGroup = {
       autoscalingPolicy: { minNumReplicas: 1, maxNumReplicas: 10 },
@@ -125,11 +141,11 @@ describe('GceResizeServerGroupModal', () => {
   });
 
   it('renders fixed-capacity mode for a server group without an autoscaler', () => {
-    const wrapper = shallow(
+    render(
       <GceResizeServerGroupModal
-        application={{ name: 'fnord', serverGroups: { refresh: jasmine.createSpy('refresh') } } as any}
-        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') } as any}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        application={{ name: 'fnord', serverGroups: { refresh: vi.fn() } } as any}
+        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: vi.fn() } as any}
+        dismissModal={vi.fn()}
         serverGroup={
           {
             account: 'prod',
@@ -138,20 +154,20 @@ describe('GceResizeServerGroupModal', () => {
             region: 'us-central1',
           } as any
         }
-        serverGroupWriter={{ resizeServerGroup: jasmine.createSpy('resizeServerGroup') } as any}
+        serverGroupWriter={{ resizeServerGroup: vi.fn() } as any}
       />,
     );
 
-    expect(wrapper.find('input[name="newSize"]').exists()).toBe(true);
-    expect(wrapper.find('p').text()).toBe('Sets desired instance count for this server group.');
+    expect(screen.getByRole('spinbutton', { name: 'Resize to' })).toBeInTheDocument();
+    expect(screen.getByText('Sets desired instance count for this server group.')).toBeInTheDocument();
   });
 
   it('renders min/max mode for a server group with an autoscaler', () => {
-    const wrapper = shallow(
+    render(
       <GceResizeServerGroupModal
-        application={{ name: 'fnord', serverGroups: { refresh: jasmine.createSpy('refresh') } } as any}
-        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') } as any}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        application={{ name: 'fnord', serverGroups: { refresh: vi.fn() } } as any}
+        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: vi.fn() } as any}
+        dismissModal={vi.fn()}
         serverGroup={
           {
             account: 'prod',
@@ -160,27 +176,27 @@ describe('GceResizeServerGroupModal', () => {
             region: 'us-central1',
           } as any
         }
-        serverGroupWriter={{ resizeServerGroup: jasmine.createSpy('resizeServerGroup') } as any}
+        serverGroupWriter={{ resizeServerGroup: vi.fn() } as any}
       />,
     );
 
-    expect(wrapper.find('input[name="newMinNumReplicas"]').exists()).toBe(true);
-    expect(wrapper.find('input[name="newMaxNumReplicas"]').exists()).toBe(true);
-    expect(wrapper.find('input[name="newSize"]').exists()).toBe(false);
+    expect(screen.getByRole('spinbutton', { name: 'Minimum replicas' })).toBeInTheDocument();
+    expect(screen.getByRole('spinbutton', { name: 'Maximum replicas' })).toBeInTheDocument();
+    expect(screen.queryByRole('spinbutton', { name: 'Resize to' })).not.toBeInTheDocument();
   });
 
   it('renders reason, account verification, and the Google platform-health override', () => {
-    const wrapper = shallow(
+    render(
       <GceResizeServerGroupModal
         application={
           {
             attributes: { platformHealthOnly: true, platformHealthOnlyShowOverride: true },
             name: 'fnord',
-            serverGroups: { refresh: jasmine.createSpy('refresh') },
+            serverGroups: { refresh: vi.fn() },
           } as any
         }
-        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') } as any}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: vi.fn() } as any}
+        dismissModal={vi.fn()}
         serverGroup={
           {
             account: 'prod',
@@ -189,20 +205,20 @@ describe('GceResizeServerGroupModal', () => {
             region: 'us-central1',
           } as any
         }
-        serverGroupWriter={{ resizeServerGroup: jasmine.createSpy('resizeServerGroup') } as any}
+        serverGroupWriter={{ resizeServerGroup: vi.fn() } as any}
       />,
     );
 
-    expect(wrapper.find(TaskReason).exists()).toBe(true);
-    expect(wrapper.find(UserVerification).prop('account')).toBe('prod');
-    expect(wrapper.find(PlatformHealthOverride).prop('interestingHealthProviderNames')).toEqual(['Google']);
+    expect(screen.getByRole('textbox', { name: 'Reason' })).toBeInTheDocument();
+    expect(screen.getByText(/Type the name of the account/)).toHaveTextContent('prod');
+    expect(screen.getByRole('checkbox', { name: 'Consider only Google health' })).toBeChecked();
   });
 
-  it('submits fixed capacity through the server group writer after verification', () => {
+  it('submits fixed capacity through the server group writer after verification', async () => {
     const application = {
       attributes: { platformHealthOnly: true, platformHealthOnlyShowOverride: true },
       name: 'fnord',
-      serverGroups: { refresh: jasmine.createSpy('refresh') },
+      serverGroups: { refresh: vi.fn() },
     } as any;
     const serverGroup = {
       account: 'prod',
@@ -210,24 +226,23 @@ describe('GceResizeServerGroupModal', () => {
       name: 'fnord-main-v004',
       region: 'us-central1',
     } as any;
-    const resizeServerGroup = jasmine.createSpy('resizeServerGroup').and.returnValue(Promise.resolve({}));
-    const wrapper = shallow(
+    const resizeServerGroup = vi.fn().mockReturnValue(new Promise(() => undefined));
+    render(
       <GceResizeServerGroupModal
         application={application}
-        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') } as any}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: vi.fn() } as any}
+        dismissModal={vi.fn()}
         serverGroup={serverGroup}
         serverGroupWriter={{ resizeServerGroup }}
       />,
     );
 
-    expect(wrapper.find('button.btn-primary').prop('disabled')).toBe(true);
-    wrapper.find('input[name="newSize"]').simulate('change', { target: { value: '6' } });
-    wrapper.find(TaskReason).prop('onChange')('capacity adjustment');
-    wrapper.find(UserVerification).prop('onValidChange')(true);
-    const monitor = (wrapper.state() as any).taskMonitor;
-    spyOn(monitor, 'submit').and.callFake((submitMethod: () => PromiseLike<any>) => submitMethod());
-    wrapper.find('button.btn-primary').simulate('click');
+    expect(screen.getByRole('button', { name: 'Submit' })).toBeDisabled();
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Resize to' }), { target: { value: '6' } });
+    fireEvent.change(screen.getByRole('textbox', { name: 'Reason' }), { target: { value: 'capacity adjustment' } });
+    fireEvent.change(screen.getByRole('textbox', { name: 'Confirm account prod' }), { target: { value: 'prod' } });
+    await waitFor(() => expect(screen.getByRole('button', { name: 'Submit' })).toBeEnabled());
+    fireEvent.click(screen.getByRole('button', { name: 'Submit' }));
 
     expect(resizeServerGroup).toHaveBeenCalledWith(serverGroup, application, {
       capacity: { desired: 6, max: 6, min: 6 },
@@ -239,11 +254,11 @@ describe('GceResizeServerGroupModal', () => {
     });
   });
 
-  it('submits autoscaler bounds through the injected policy writer after verification', () => {
+  it('submits autoscaler bounds through the injected policy writer after verification', async () => {
     const application = {
       attributes: { platformHealthOnly: true, platformHealthOnlyShowOverride: true },
       name: 'fnord',
-      serverGroups: { refresh: jasmine.createSpy('refresh') },
+      serverGroups: { refresh: vi.fn() },
     } as any;
     const serverGroup = {
       account: 'prod',
@@ -251,25 +266,26 @@ describe('GceResizeServerGroupModal', () => {
       name: 'fnord-main-v004',
       region: 'us-central1',
     } as any;
-    const upsertAutoscalingPolicy = jasmine.createSpy('upsertAutoscalingPolicy').and.returnValue(Promise.resolve({}));
-    const resizeServerGroup = jasmine.createSpy('resizeServerGroup');
-    const wrapper = shallow(
+    const upsertAutoscalingPolicy = vi.fn().mockReturnValue(new Promise(() => undefined));
+    const resizeServerGroup = vi.fn();
+    render(
       <GceResizeServerGroupModal
         application={application}
         autoscalingPolicyWriter={{ upsertAutoscalingPolicy }}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        dismissModal={vi.fn()}
         serverGroup={serverGroup}
         serverGroupWriter={{ resizeServerGroup } as any}
       />,
     );
 
-    wrapper.find('input[name="newMinNumReplicas"]').simulate('change', { target: { value: '3' } });
-    wrapper.find('input[name="newMaxNumReplicas"]').simulate('change', { target: { value: '12' } });
-    wrapper.find(TaskReason).prop('onChange')('raise autoscaling ceiling');
-    wrapper.find(UserVerification).prop('onValidChange')(true);
-    const monitor = (wrapper.state() as any).taskMonitor;
-    spyOn(monitor, 'submit').and.callFake((submitMethod: () => PromiseLike<any>) => submitMethod());
-    wrapper.find('button.btn-primary').simulate('click');
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Minimum replicas' }), { target: { value: '3' } });
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Maximum replicas' }), { target: { value: '12' } });
+    fireEvent.change(screen.getByRole('textbox', { name: 'Reason' }), {
+      target: { value: 'raise autoscaling ceiling' },
+    });
+    fireEvent.change(screen.getByRole('textbox', { name: 'Confirm account prod' }), { target: { value: 'prod' } });
+    await waitFor(() => expect(screen.getByRole('button', { name: 'Submit' })).toBeEnabled());
+    fireEvent.click(screen.getByRole('button', { name: 'Submit' }));
 
     expect(resizeServerGroup).not.toHaveBeenCalled();
     expect(upsertAutoscalingPolicy).toHaveBeenCalledWith(
@@ -284,11 +300,11 @@ describe('GceResizeServerGroupModal', () => {
   });
 
   it('surfaces invalid autoscaler min/max validation', () => {
-    const wrapper = shallow(
+    render(
       <GceResizeServerGroupModal
-        application={{ name: 'fnord', serverGroups: { refresh: jasmine.createSpy('refresh') } } as any}
-        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') } as any}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        application={{ name: 'fnord', serverGroups: { refresh: vi.fn() } } as any}
+        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: vi.fn() } as any}
+        dismissModal={vi.fn()}
         serverGroup={
           {
             account: 'prod',
@@ -297,24 +313,24 @@ describe('GceResizeServerGroupModal', () => {
             region: 'us-central1',
           } as any
         }
-        serverGroupWriter={{ resizeServerGroup: jasmine.createSpy('resizeServerGroup') } as any}
+        serverGroupWriter={{ resizeServerGroup: vi.fn() } as any}
       />,
     );
 
-    wrapper.find('input[name="newMinNumReplicas"]').simulate('change', { target: { value: '8' } });
-    wrapper.find('input[name="newMaxNumReplicas"]').simulate('change', { target: { value: '4' } });
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Minimum replicas' }), { target: { value: '8' } });
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Maximum replicas' }), { target: { value: '4' } });
 
-    expect(wrapper.find(ValidationMessage).prop('message')).toBe('Min cannot be larger than Max');
+    expect(screen.getByText('Min cannot be larger than Max')).toBeInTheDocument();
   });
 
   it('opens as a standalone React modal', () => {
     const props = {
       application: { name: 'fnord' },
-      autoscalingPolicyWriter: { upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') },
+      autoscalingPolicyWriter: { upsertAutoscalingPolicy: vi.fn() },
       serverGroup: { account: 'prod', name: 'fnord-main-v004', region: 'us-central1' },
-      serverGroupWriter: { resizeServerGroup: jasmine.createSpy('resizeServerGroup') },
+      serverGroupWriter: { resizeServerGroup: vi.fn() },
     } as any;
-    const show = spyOn(ReactModal, 'show').and.returnValue(Promise.resolve({}) as any);
+    const show = vi.spyOn(ReactModal, 'show').mockReturnValue(Promise.resolve({}) as any);
 
     GceResizeServerGroupModal.show(props);
 
@@ -322,11 +338,11 @@ describe('GceResizeServerGroupModal', () => {
   });
 
   it('keeps submit disabled when fixed capacity is cleared', () => {
-    const wrapper = shallow(
+    render(
       <GceResizeServerGroupModal
-        application={{ name: 'fnord', serverGroups: { refresh: jasmine.createSpy('refresh') } } as any}
-        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') } as any}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        application={{ name: 'fnord', serverGroups: { refresh: vi.fn() } } as any}
+        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: vi.fn() } as any}
+        dismissModal={vi.fn()}
         serverGroup={
           {
             account: 'prod',
@@ -335,23 +351,23 @@ describe('GceResizeServerGroupModal', () => {
             region: 'us-central1',
           } as any
         }
-        serverGroupWriter={{ resizeServerGroup: jasmine.createSpy('resizeServerGroup') } as any}
+        serverGroupWriter={{ resizeServerGroup: vi.fn() } as any}
       />,
     );
 
-    wrapper.find('input[name="newSize"]').simulate('change', { target: { value: '6' } });
-    wrapper.find('input[name="newSize"]').simulate('change', { target: { value: '' } });
-    wrapper.find(UserVerification).prop('onValidChange')(true);
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Resize to' }), { target: { value: '6' } });
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Resize to' }), { target: { value: '' } });
+    fireEvent.change(screen.getByRole('textbox', { name: 'Confirm account prod' }), { target: { value: 'prod' } });
 
-    expect(wrapper.find('button.btn-primary').prop('disabled')).toBe(true);
+    expect(screen.getByRole('button', { name: 'Submit' })).toBeDisabled();
   });
 
   it('requires autoscaler bounds after an input is cleared', () => {
-    const wrapper = shallow(
+    render(
       <GceResizeServerGroupModal
-        application={{ name: 'fnord', serverGroups: { refresh: jasmine.createSpy('refresh') } } as any}
-        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') } as any}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        application={{ name: 'fnord', serverGroups: { refresh: vi.fn() } } as any}
+        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: vi.fn() } as any}
+        dismissModal={vi.fn()}
         serverGroup={
           {
             account: 'prod',
@@ -360,30 +376,30 @@ describe('GceResizeServerGroupModal', () => {
             region: 'us-central1',
           } as any
         }
-        serverGroupWriter={{ resizeServerGroup: jasmine.createSpy('resizeServerGroup') } as any}
+        serverGroupWriter={{ resizeServerGroup: vi.fn() } as any}
       />,
     );
 
-    wrapper.find('input[name="newMinNumReplicas"]').simulate('change', { target: { value: '3' } });
-    wrapper.find('input[name="newMaxNumReplicas"]').simulate('change', { target: { value: '12' } });
-    wrapper.find('input[name="newMinNumReplicas"]').simulate('change', { target: { value: '' } });
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Minimum replicas' }), { target: { value: '3' } });
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Maximum replicas' }), { target: { value: '12' } });
+    fireEvent.change(screen.getByRole('spinbutton', { name: 'Minimum replicas' }), { target: { value: '' } });
 
-    expect(wrapper.find(ValidationMessage).prop('message')).toBe('Min is required');
+    expect(screen.getByText('Min is required')).toBeInTheDocument();
   });
 
   it('dismisses the modal from the task monitor', () => {
-    const dismissModal = jasmine.createSpy('dismissModal');
-    const wrapper = shallow(
+    const dismissModal = vi.fn();
+    render(
       <GceResizeServerGroupModal
-        application={{ name: 'fnord', serverGroups: { refresh: jasmine.createSpy('refresh') } } as any}
-        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: jasmine.createSpy('upsertAutoscalingPolicy') } as any}
+        application={{ name: 'fnord', serverGroups: { refresh: vi.fn() } } as any}
+        autoscalingPolicyWriter={{ upsertAutoscalingPolicy: vi.fn() } as any}
         dismissModal={dismissModal}
         serverGroup={{ account: 'prod', name: 'fnord-main-v004', region: 'us-central1' } as any}
-        serverGroupWriter={{ resizeServerGroup: jasmine.createSpy('resizeServerGroup') } as any}
+        serverGroupWriter={{ resizeServerGroup: vi.fn() } as any}
       />,
     );
 
-    (wrapper.state() as any).taskMonitor.closeModal();
+    fireEvent.click(screen.getByRole('button', { name: 'Close monitored task' }));
 
     expect(dismissModal).toHaveBeenCalled();
   });

package/src/serverGroup/details/resize/GceResizeServerGroupModal.tsx

@@ -227,6 +227,7 @@ export class GceResizeServerGroupModal extends React.Component<
                   <label className="col-md-3 sm-label-right">Current</label>
                   <div className="col-md-2">
                     <input
+                      aria-label="Current minimum replicas"
                       className="form-control input-sm"
                       disabled={true}
                       type="number"
@@ -235,6 +236,7 @@ export class GceResizeServerGroupModal extends React.Component<
                   </div>
                   <div className="col-md-2">
                     <input
+                      aria-label="Current maximum replicas"
                       className="form-control input-sm"
                       disabled={true}
                       type="number"
@@ -246,6 +248,7 @@ export class GceResizeServerGroupModal extends React.Component<
                   <label className="col-md-3 sm-label-right">Resize to</label>
                   <div className="col-md-2">
                     <input
+                      aria-label="Minimum replicas"
                       className="form-control input-sm"
                       min={0}
                       name="newMinNumReplicas"
@@ -263,6 +266,7 @@ export class GceResizeServerGroupModal extends React.Component<
                   </div>
                   <div className="col-md-2">
                     <input
+                      aria-label="Maximum replicas"
                       className="form-control input-sm"
                       min={0}
                       name="newMaxNumReplicas"

package/src/serverGroup/details/rollback/GceRollbackServerGroupModal.spec.tsx

@@ -1,7 +1,7 @@
-import { shallow } from 'enzyme';
+import { fireEvent, render, screen, waitFor } from '@testing-library/react';
 import React from 'react';
 
-import { PlatformHealthOverride, TaskReason, UserVerification } from '@spinnaker/core';
+import { AccountService } from '@spinnaker/core';
 
 import {
   buildGceRollbackJob,
@@ -9,6 +9,20 @@ import {
   getGceRollbackCandidates,
 } from './GceRollbackServerGroupModal';
 
+vi.mock('@spinnaker/core', async (importOriginal) => {
+  const actual = await importOriginal<typeof import('@spinnaker/core')>();
+  const ReactModule = await import('react');
+  return {
+    ...actual,
+    TaskMonitorWrapper: ({ monitor }: any) =>
+      ReactModule.createElement(
+        'button',
+        { onClick: () => monitor.closeModal(), type: 'button' },
+        'Close monitored task',
+      ),
+  };
+});
+
 describe('GceRollbackServerGroupModal', () => {
   const application = { name: 'fnord' } as any;
   const serverGroup = {
@@ -19,6 +33,8 @@ describe('GceRollbackServerGroupModal', () => {
     region: 'us-central1',
   } as any;
 
+  beforeEach(() => vi.spyOn(AccountService, 'challengeDestructiveActions').mockResolvedValue(true));
+
   it('keeps only disabled candidates in the same application, cluster, account, and region', () => {
     const eligible = {
       account: 'prod',
@@ -78,7 +94,7 @@ describe('GceRollbackServerGroupModal', () => {
   });
 
   it('renders reason, account verification, and the Google platform-health override', () => {
-    const wrapper = shallow(
+    render(
       <GceRollbackServerGroupModal
         application={
           {
@@ -86,28 +102,23 @@ describe('GceRollbackServerGroupModal', () => {
             name: 'fnord',
           } as any
         }
-        dismissModal={jasmine.createSpy('dismissModal')}
+        dismissModal={vi.fn()}
         serverGroup={serverGroup}
         serverGroups={[]}
-        serverGroupWriter={{ rollbackServerGroup: jasmine.createSpy('rollbackServerGroup') } as any}
+        serverGroupWriter={{ rollbackServerGroup: vi.fn() } as any}
       />,
     );
 
-    expect(wrapper.find(TaskReason).exists()).toBe(true);
-    expect(wrapper.find(UserVerification).prop('account')).toBe('prod');
-    expect(wrapper.find(PlatformHealthOverride).props()).toEqual(
-      jasmine.objectContaining({
-        interestingHealthProviderNames: ['Google'],
-        platformHealthType: 'Google',
-      }),
-    );
+    expect(screen.getByRole('textbox', { name: 'Reason' })).toBeInTheDocument();
+    expect(screen.getByText(/Type the name of the account/)).toHaveTextContent('prod');
+    expect(screen.getByRole('checkbox', { name: 'Consider only Google health' })).toBeChecked();
   });
 
-  it('submits the exact rollback writer job only after account verification', () => {
+  it('submits the exact rollback writer job only after account verification', async () => {
     const applicationWithHealthOverride = {
       attributes: { platformHealthOnly: true, platformHealthOnlyShowOverride: true },
       name: 'fnord',
-      serverGroups: { refresh: jasmine.createSpy('refresh') },
+      serverGroups: { refresh: vi.fn() },
     } as any;
     const candidate = {
       account: 'prod',
@@ -117,25 +128,23 @@ describe('GceRollbackServerGroupModal', () => {
       name: 'fnord-main-v003',
       region: 'us-central1',
     } as any;
-    const rollbackServerGroup = jasmine.createSpy('rollbackServerGroup').and.returnValue(Promise.resolve({}));
-    const wrapper = shallow(
+    const rollbackServerGroup = vi.fn().mockReturnValue(new Promise(() => undefined));
+    render(
       <GceRollbackServerGroupModal
         application={applicationWithHealthOverride}
-        dismissModal={jasmine.createSpy('dismissModal')}
+        dismissModal={vi.fn()}
         serverGroup={serverGroup}
         serverGroups={[candidate]}
         serverGroupWriter={{ rollbackServerGroup }}
       />,
     );
-    const monitor = (wrapper.state() as any).taskMonitor;
-    spyOn(monitor, 'submit').and.callFake((submitMethod: () => PromiseLike<any>) => submitMethod());
-
-    wrapper.find('select').simulate('change', { target: { value: candidate.name } });
-    wrapper.find(TaskReason).prop('onChange')('bad release');
-    expect(wrapper.find('button.btn-primary').prop('disabled')).toBe(true);
+    fireEvent.change(screen.getByRole('combobox', { name: 'Restore to' }), { target: { value: candidate.name } });
+    fireEvent.change(screen.getByRole('textbox', { name: 'Reason' }), { target: { value: 'bad release' } });
+    expect(screen.getByRole('button', { name: 'Submit' })).toBeDisabled();
 
-    wrapper.find(UserVerification).prop('onValidChange')(true);
-    wrapper.find('button.btn-primary').simulate('click');
+    fireEvent.change(screen.getByRole('textbox', { name: 'Confirm account prod' }), { target: { value: 'prod' } });
+    await waitFor(() => expect(screen.getByRole('button', { name: 'Submit' })).toBeEnabled());
+    fireEvent.click(screen.getByRole('button', { name: 'Submit' }));
 
     expect(rollbackServerGroup).toHaveBeenCalledWith(serverGroup, applicationWithHealthOverride, {
       interestingHealthProviderNames: ['Google'],
@@ -150,18 +159,18 @@ describe('GceRollbackServerGroupModal', () => {
   });
 
   it('dismisses the modal from the task monitor', () => {
-    const dismissModal = jasmine.createSpy('dismissModal');
-    const wrapper = shallow(
+    const dismissModal = vi.fn();
+    render(
       <GceRollbackServerGroupModal
-        application={{ name: 'fnord', serverGroups: { refresh: jasmine.createSpy('refresh') } } as any}
+        application={{ name: 'fnord', serverGroups: { refresh: vi.fn() } } as any}
         dismissModal={dismissModal}
         serverGroup={serverGroup}
         serverGroups={[]}
-        serverGroupWriter={{ rollbackServerGroup: jasmine.createSpy('rollbackServerGroup') } as any}
+        serverGroupWriter={{ rollbackServerGroup: vi.fn() } as any}
       />,
     );
 
-    (wrapper.state() as any).taskMonitor.closeModal();
+    fireEvent.click(screen.getByRole('button', { name: 'Close monitored task' }));
 
     expect(dismissModal).toHaveBeenCalled();
   });

package/src/serverGroup/serverGroup.transformer.js

@@ -19,6 +19,7 @@ export class GceServerGroupTransformer {
               serverGroup.loadBalancers,
               serverGroup.account,
               application.getDataSource('loadBalancers').data,
+              serverGroup.region,
             );
           }
           return serverGroup;

package/src/serverGroup/serverGroup.transformer.spec.js

@@ -47,6 +47,54 @@ describe('gceServerGroupTransformer', () => {
       expect(normalizedServerGroup.loadBalancers.includes('network-load-balancer')).toEqual(true);
       expect(normalizedServerGroup.loadBalancers.includes('internal-load-balancer')).toEqual(true);
     });
+
+    it('scopes EXTERNAL_MANAGED listener normalization by server group region', async function () {
+      app = {
+        getDataSource: () => ({
+          ready: () => Promise.resolve(),
+          data: [
+            {
+              account: 'my-google-account',
+              listeners: [{ name: 'external-listener' }],
+              loadBalancerType: 'EXTERNAL_MANAGED',
+              name: 'app-main (my-google-account/us-central1/EXTERNAL_MANAGED)',
+              provider: 'gce',
+              region: 'us-central1',
+              urlMapName: 'app-main',
+            },
+            {
+              account: 'my-google-account',
+              listeners: [{ name: 'external-listener' }],
+              loadBalancerType: 'EXTERNAL_MANAGED',
+              name: 'app-main (my-google-account/europe-west1/EXTERNAL_MANAGED)',
+              provider: 'gce',
+              region: 'europe-west1',
+              urlMapName: 'app-main',
+            },
+          ],
+        }),
+      };
+
+      const centralServerGroup = await transformer.normalizeServerGroup(
+        {
+          account: 'my-google-account',
+          region: 'us-central1',
+          loadBalancers: ['external-listener'],
+        },
+        app,
+      );
+      const europeServerGroup = await transformer.normalizeServerGroup(
+        {
+          account: 'my-google-account',
+          region: 'europe-west1',
+          loadBalancers: ['external-listener'],
+        },
+        app,
+      );
+
+      expect(centralServerGroup.loadBalancers).toEqual(['app-main (my-google-account/us-central1/EXTERNAL_MANAGED)']);
+      expect(europeServerGroup.loadBalancers).toEqual(['app-main (my-google-account/europe-west1/EXTERNAL_MANAGED)']);
+    });
   });
 
   describe('convert server group command to deploy configuration', () => {

package/src/validation/ApplicationNameValidator.spec.ts

@@ -32,7 +32,7 @@ describe('Google application name validator', () => {
   });
 
   it('is registered directly when the Google module is imported', async () => {
-    spyOn(AccountService, 'listProviders').and.returnValue(Promise.resolve(['gce']));
+    vi.spyOn(AccountService, 'listProviders').mockReturnValue(Promise.resolve(['gce']));
 
     const result = await ApplicationNameValidator.validate('invalid-name', ['gce']);