Fix setup wizard click button loading state (#33358)
* Fix setup wizard usage button loading state * Add e2e tests for usage button loading state
This commit is contained in:
parent
e80312eef0
commit
a3d42be6b0
|
@ -0,0 +1,4 @@
|
|||
Significance: patch
|
||||
Type: add
|
||||
|
||||
Add tests to check usage button loading state
|
|
@ -129,6 +129,12 @@ const completeOnboardingWizard = async () => {
|
|||
expect( continueButtons ).toHaveLength( 1 );
|
||||
|
||||
await continueButtons[ 0 ].click();
|
||||
await expect( page ).toMatchElement(
|
||||
'.woocommerce-usage-modal__actions button.is-secondary.is-busy'
|
||||
);
|
||||
await expect( page ).not.toMatchElement(
|
||||
'.woocommerce-usage-modal__actions button.is-primary:disabled'
|
||||
);
|
||||
}
|
||||
await page.waitForNavigation( { waitUntil: 'networkidle0' } );
|
||||
|
||||
|
|
|
@ -17,6 +17,7 @@ class UsageModal extends Component {
|
|||
this.state = {
|
||||
isLoadingScripts: false,
|
||||
isRequestStarted: false,
|
||||
selectedAction: null,
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -131,7 +132,7 @@ class UsageModal extends Component {
|
|||
acceptActionText = __( 'Yes, count me in!', 'woocommerce' ),
|
||||
} = this.props;
|
||||
|
||||
const { isRequestStarted } = this.state;
|
||||
const { isRequestStarted, selectedAction } = this.state;
|
||||
const isBusy = isRequestStarted && isRequesting;
|
||||
|
||||
return (
|
||||
|
@ -148,19 +149,23 @@ class UsageModal extends Component {
|
|||
<div className="woocommerce-usage-modal__actions">
|
||||
<Button
|
||||
isSecondary
|
||||
isBusy={ isBusy }
|
||||
onClick={ () =>
|
||||
this.updateTracking( { allowTracking: false } )
|
||||
}
|
||||
isBusy={ isBusy && selectedAction === 'dismiss' }
|
||||
disabled={ isBusy && selectedAction === 'accept' }
|
||||
onClick={ () => {
|
||||
this.setState( { selectedAction: 'dismiss' } );
|
||||
this.updateTracking( { allowTracking: false } );
|
||||
} }
|
||||
>
|
||||
{ dismissActionText }
|
||||
</Button>
|
||||
<Button
|
||||
isPrimary
|
||||
isBusy={ isBusy }
|
||||
onClick={ () =>
|
||||
this.updateTracking( { allowTracking: true } )
|
||||
}
|
||||
isBusy={ isBusy && selectedAction === 'accept' }
|
||||
disabled={ isBusy && selectedAction === 'dismiss' }
|
||||
onClick={ () => {
|
||||
this.setState( { selectedAction: 'accept' } );
|
||||
this.updateTracking( { allowTracking: true } );
|
||||
} }
|
||||
>
|
||||
{ acceptActionText }
|
||||
</Button>
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
Significance: patch
|
||||
Type: fix
|
||||
|
||||
fix setup wizard usage button loading state
|
Loading…
Reference in New Issue