Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Hide Tax UI during onboarding & keep in edit campaign #2542

Merged
Show file tree
Hide file tree
Changes from 14 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,8 @@ const checkErrors = (
values,
shippingTimes,
finalCountryCodes,
storeCountryCode
storeCountryCode,
hideTaxRates = false
) => {
const errors = {};

Expand Down Expand Up @@ -110,6 +111,7 @@ const checkErrors = (
* Check tax rate (required for U.S. only).
*/
if (
! hideTaxRates &&
( storeCountryCode === 'US' || finalCountryCodes.includes( 'US' ) ) &&
! validTaxRateSet.has( values.tax_rate )
) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,13 +22,16 @@
*
* @param {Object} props React props.
* @param {string} [props.submitLabel="Complete setup"] Submit button label.
* @param {boolean} [props.hideTaxRates=false] Whether to hide tax rate section.
eason9487 marked this conversation as resolved.
Show resolved Hide resolved
*/
const FormContent = ( {
submitLabel = __( 'Complete setup', 'google-listings-and-ads' ),
hideTaxRates,

Check warning on line 29 in js/src/components/free-listings/setup-free-listings/form-content.js

View check run for this annotation

Codecov / codecov/patch

js/src/components/free-listings/setup-free-listings/form-content.js#L29

Added line #L29 was not covered by tests
} ) => {
const { values, isValidForm, handleSubmit, adapter } =
useAdaptiveFormContext();
const shouldDisplayTaxRate = useDisplayTaxRate( adapter.audienceCountries );
const displayTaxRate = useDisplayTaxRate( adapter.audienceCountries );
const shouldDisplayTaxRate = ! hideTaxRates && displayTaxRate;

Check warning on line 34 in js/src/components/free-listings/setup-free-listings/form-content.js

View check run for this annotation

Codecov / codecov/patch

js/src/components/free-listings/setup-free-listings/form-content.js#L33-L34

Added lines #L33 - L34 were not covered by tests
const shouldDisplayShippingTime = values.shipping_time === 'flat';

const handleSubmitClick = ( event ) => {
Expand Down
10 changes: 8 additions & 2 deletions js/src/components/free-listings/setup-free-listings/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,7 @@
* @param {() => void} [props.onContinue] Callback called once continue button is clicked. Could be async. While it's being resolved the form would turn into a saving state.
* @param {string} [props.submitLabel] Submit button label, to be forwarded to `FormContent`.
* @param {JSX.Element} props.headerTitle Title in the header block of this setup.
* @param {boolean} [props.hideTaxRates=false] Whether to hide tax rate section, to be forwarded to `FormContent`.
*/
const SetupFreeListings = ( {
targetAudience,
Expand All @@ -91,6 +92,7 @@
onContinue = noop,
submitLabel,
headerTitle,
hideTaxRates = false,

Check warning on line 95 in js/src/components/free-listings/setup-free-listings/index.js

View check run for this annotation

Codecov / codecov/patch

js/src/components/free-listings/setup-free-listings/index.js#L95

Added line #L95 was not covered by tests
} ) => {
const formRef = useRef();
const { code: storeCountryCode } = useStoreCountry();
Expand All @@ -107,7 +109,8 @@
values,
shippingTimesData,
countries,
storeCountryCode
storeCountryCode,
hideTaxRates
);
};

Expand Down Expand Up @@ -231,7 +234,10 @@
validate={ handleValidate }
onSubmit={ onContinue }
>
<FormContent submitLabel={ submitLabel } />
<FormContent
submitLabel={ submitLabel }
hideTaxRates={ hideTaxRates }
/>
</AdaptiveForm>
</div>
);
Expand Down
1 change: 1 addition & 0 deletions js/src/setup-mc/setup-stepper/saved-setup-stepper.js
Original file line number Diff line number Diff line change
Expand Up @@ -170,6 +170,7 @@ const SavedSetupStepper = ( { savedStep } ) => {
targetAudience={ initTargetAudience }
settings={ initSettings }
shippingRates={ initShippingRates }
hideTaxRates={ true }
shippingTimes={ initShippingTimes }
resolveFinalCountries={ getFinalCountries }
onTargetAudienceChange={ handleFormChange.bind(
Expand Down
43 changes: 1 addition & 42 deletions tests/e2e/specs/setup-mc/step-2-product-listings.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import ProductListingsPage from '../../utils/pages/setup-mc/step-2-product-listi
import {
getCountryInputSearchBoxContainer,
getCountryInputSearchBox,
removeCountryFromSearchBox,
selectCountryFromSearchBox,
} from '../../utils/page';

Expand Down Expand Up @@ -70,6 +69,7 @@ test.describe( 'Configure product listings', () => {
payment_methods_visible: false,
refund_tos_visible: false,
contact_info_visible: false,
tax_rate: 'destination',
},
200,
[ 'GET' ]
Expand Down Expand Up @@ -160,31 +160,6 @@ test.describe( 'Configure product listings', () => {
await productListingsPage.checkSelectedCountriesOnlyRadioButton();
} );

test( 'should still see "Tax rate (required for U.S. only)" even if deselect US when the default country is US', async () => {
const taxRateSection = productListingsPage.getTaxRateSection();
await expect( taxRateSection ).toBeVisible();
await removeCountryFromSearchBox( page, 'United States (US)' );
await expect( taxRateSection ).toBeVisible();
} );

test( 'should hide "Tax rate (required for U.S. only)" if deselect US when the default country is not US', async () => {
// Mock WC default country as TW, because Tax rate will always be shown if the default country is US.
await productListingsPage.fulfillWCDefaultCountry( {
woocommerce_default_country: 'TW',
} );
await page.reload();

// Check the radio button of "Selected countries only" first in order to ensure the country search box is visible.
await productListingsPage.checkSelectedCountriesOnlyRadioButton();

const taxRateSection = productListingsPage.getTaxRateSection();
await expect( taxRateSection ).toBeVisible();

await removeCountryFromSearchBox( page, 'United States (US)' );

await expect( taxRateSection ).not.toBeVisible();
} );

test.describe( 'Shipping rate is simple', () => {
test.beforeAll( async () => {
await page.reload();
Expand Down Expand Up @@ -357,12 +332,6 @@ test.describe( 'Configure product listings', () => {
'Successfully added time for country: "US".'
);
} );

test( 'should show error message if clicking "Continue" button when tax rate is not chosen', async () => {
await productListingsPage.clickContinueButton();
const taxRateError = productListingsPage.getTaxRateError();
await expect( taxRateError ).toBeVisible();
} );
} );

test.describe( 'Links', () => {
Expand Down Expand Up @@ -397,15 +366,6 @@ test.describe( 'Configure product listings', () => {
'https://support.google.com/merchants/answer/7050921'
);
} );

test( 'should contain the correct URL for "Read more for Tax Rate" link', async () => {
const link = productListingsPage.getReadMoreTaxRateLink();
await expect( link ).toBeVisible();
await expect( link ).toHaveAttribute(
'href',
'https://support.google.com/merchants/answer/160162'
);
} );
} );

test.describe( 'Click "Continue" button', () => {
Expand All @@ -414,7 +374,6 @@ test.describe( 'Configure product listings', () => {
productListingsPage.mockContactInformation();
productListingsPage.checkRecommendedShippingRateRadioButton();
await productListingsPage.fillEstimatedShippingTimes( '14' );
await productListingsPage.checkNonDestinationBasedTaxRateRadioButton();
} );

test( 'should see the heading of next step and send two requests after clicking "Continue"', async () => {
Expand Down
57 changes: 0 additions & 57 deletions tests/e2e/utils/pages/setup-mc/step-2-product-listings.js
Original file line number Diff line number Diff line change
Expand Up @@ -135,18 +135,6 @@ export default class ProductListingsPage extends MockRequests {
} );
}

/**
* Get non-destination-based tax rate radio row.
*
* @return {import('@playwright/test').Locator} Get non-destination-based tax rate radio row.
*/
getNonDestinationBasedTaxRateRadioRow() {
return this.page.getByRole( 'radio', {
name: 'My store does not use destination-based tax rates.',
exact: true,
} );
}

/**
* Get shipping rates section.
*
Expand All @@ -169,17 +157,6 @@ export default class ProductListingsPage extends MockRequests {
.filter( { hasText: 'Shipping times' } );
}

/**
* Get tax rate section.
*
* @return {import('@playwright/test').Locator} Get tax rate section.
*/
getTaxRateSection() {
return this.page
.locator( 'section' )
.filter( { hasText: 'Tax rate (required for U.S. only)' } );
}

/**
* Get audience card.
*
Expand Down Expand Up @@ -246,17 +223,6 @@ export default class ProductListingsPage extends MockRequests {
);
}

/**
* Get tax rate error.
*
* @return {import('@playwright/test').Locator} Get tax rate error.
*/
getTaxRateError() {
return this.getTaxRateSection().getByText(
'Please specify tax rate option.'
);
}

/**
* Get "Free shipping for all orders" tag.
*
Expand Down Expand Up @@ -338,18 +304,6 @@ export default class ProductListingsPage extends MockRequests {
} );
}

/**
* Get "Read more" for Tax rate link.
*
* @return {import('@playwright/test').Locator} Get "Read more" for Tax rate link.
*/
getReadMoreTaxRateLink() {
return this.getTaxRateSection().getByRole( 'link', {
name: 'Read more',
exact: true,
} );
}

/**
* Register the requests when the continue button is clicked.
*
Expand Down Expand Up @@ -483,17 +437,6 @@ export default class ProductListingsPage extends MockRequests {
await this.page.waitForLoadState( LOAD_STATE.DOM_CONTENT_LOADED );
}

/**
* Check non-destination-based tax rate radio button.
*
* @return {Promise<void>}
*/
async checkNonDestinationBasedTaxRateRadioButton() {
const radio = this.getNonDestinationBasedTaxRateRadioRow();
await radio.check();
await this.page.waitForLoadState( LOAD_STATE.DOM_CONTENT_LOADED );
}

/**
* Fill estimated shipping rates.
*
Expand Down