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.

Sign up for GitHub

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

Jump to bottom

Move Cart, Checkout and Order Confirmation template customization tests to the parameterized tests file #43992

Merged
merged 3 commits into from
Jan 24, 2024
Merged

Move Cart, Checkout and Order Confirmation template customization tests to the parameterized tests file #43992

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
72170b4
Move Cart, Checkout and Order Confirmation template customization tes…
Aljullu Jan 23, 2024
7bb917e
Add changefile(s) from automation for the following project(s): wooco…
invalid-email-address Jan 23, 2024
3eafde5
Clean up order-confirmation.block_theme.spec.ts file
Aljullu Jan 24, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
21 changes: 0 additions & 21 deletions plugins/woocommerce-blocks/tests/e2e/tests/templates/cart-template.block_theme.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import { test, expect } from '@woocommerce/e2e-playwright-utils';
const permalink = '/cart';
const templatePath = 'woocommerce/woocommerce//page-cart';
const templateType = 'wp_template';
const userText = 'Hello World in the template';

test.describe( 'Test the cart template', async () => {
test( 'Template can be opened in the site editor', async ( {
Expand Down Expand Up @@ -99,24 +98,4 @@ test.describe( 'Test editing the cart template', async () => {
.first()
).toBeVisible();
} );

test( 'Template can be modified', async ( {
admin,
editorUtils,
page,
} ) => {
await admin.visitSiteEditor( {
postId: templatePath,
postType: templateType,
} );
await editorUtils.enterEditMode();
await editorUtils.closeWelcomeGuideModal();
await editorUtils.editor.insertBlock( {
name: 'core/paragraph',
attributes: { content: userText },
} );
await editorUtils.saveTemplate();
await page.goto( permalink, { waitUntil: 'domcontentloaded' } );
await expect( page.getByText( userText ).first() ).toBeVisible();
} );
} );
26 changes: 0 additions & 26 deletions plugins/woocommerce-blocks/tests/e2e/tests/templates/checkout-template.block_theme.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import { test, expect } from '@woocommerce/e2e-playwright-utils';
const permalink = '/checkout';
const templatePath = 'woocommerce/woocommerce//page-checkout';
const templateType = 'wp_template';
const userText = 'Hello World in the template';

test.describe( 'Test the checkout template', async () => {
test( 'Template can be opened in the site editor', async ( {
Expand Down Expand Up @@ -97,29 +96,4 @@ test.describe( 'Test editing the checkout template', async () => {
editor.canvas.locator( 'button:has-text("Place order")' ).first()
).toBeVisible();
} );

test( 'Template can be modified', async ( {
admin,
editorUtils,
frontendUtils,
} ) => {
await admin.visitSiteEditor( {
postId: templatePath,
postType: templateType,
} );
await editorUtils.enterEditMode();
await editorUtils.closeWelcomeGuideModal();
await editorUtils.editor.insertBlock( {
name: 'core/paragraph',
attributes: { content: userText },
} );
await editorUtils.saveTemplate();
await frontendUtils.goToShop();
await frontendUtils.emptyCart();
await frontendUtils.addToCart();
await frontendUtils.goToCheckout();
await expect(
frontendUtils.page.getByText( userText ).first()
).toBeVisible();
} );
} );
33 changes: 0 additions & 33 deletions plugins/woocommerce-blocks/tests/e2e/tests/templates/order-confirmation.block_theme.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,37 +85,4 @@ test.describe( 'Test the order confirmation template', async () => {
} )
).toBeVisible();
} );

test( 'Template can be modified', async ( {
Aljullu marked this conversation as resolved.
Show resolved Hide resolved
page,
admin,
editorUtils,
frontendUtils,
pageObject,
} ) => {
await admin.visitSiteEditor( {
postId: templatePath,
postType: templateType,
} );
await editorUtils.enterEditMode();
await editorUtils.editor.insertBlock( {
name: 'core/paragraph',
attributes: { content: userText },
} );
await editorUtils.saveTemplate();
await frontendUtils.emptyCart();
await frontendUtils.goToShop();
await frontendUtils.addToCart( SIMPLE_PHYSICAL_PRODUCT_NAME );
await frontendUtils.goToCheckout();
await expect(
await pageObject.selectAndVerifyShippingOption(
FREE_SHIPPING_NAME,
FREE_SHIPPING_PRICE
)
).toBe( true );
await pageObject.fillInCheckoutWithTestData();
await pageObject.placeOrder();

await expect( page.getByText( userText ).first() ).toBeVisible();
} );
} );
84 changes: 71 additions & 13 deletions ...commerce-blocks/tests/e2e/tests/templates/template-user-customization.block_theme.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,22 +2,46 @@
* External dependencies
*/
import { test, expect } from '@woocommerce/e2e-playwright-utils';
import type { Page, Response } from '@playwright/test';
import type { FrontendUtils } from '@woocommerce/e2e-utils';

const templateUserCustomizationTests = [
/**
* Internal dependencies
*/
import { SIMPLE_VIRTUAL_PRODUCT_NAME } from '../checkout/constants';
import { CheckoutPage } from '../checkout/checkout.page';

type TemplateCustomizationTest = {
visitPage: ( props: {
frontendUtils: FrontendUtils;
page: Page;
} ) => Promise< void | Response | null >;
templateName: string;
templatePath: string;
templateType: string;
defaultTemplate?: {
templateName: string;
templatePath: string;
};
};

const templateUserCustomizationTests: TemplateCustomizationTest[] = [
{
permalink: '/shop',
visitPage: async ( { frontendUtils } ) =>
await frontendUtils.goToShop(),
templateName: 'Product Catalog',
templatePath: 'woocommerce/woocommerce//archive-product',
templateType: 'wp_template',
},
{
permalink: '/?s=shirt&post_type=product',
visitPage: async ( { page } ) =>
await page.goto( '/?s=shirt&post_type=product' ),
templateName: 'Product Search Results',
templatePath: 'woocommerce/woocommerce//product-search-results',
templateType: 'wp_template',
},
{
permalink: '/color/blue',
visitPage: async ( { page } ) => await page.goto( '/color/blue' ),
templateName: 'Products by Attribute',
templatePath: 'woocommerce/woocommerce//taxonomy-product_attribute',
templateType: 'wp_template',
Expand All @@ -27,7 +51,8 @@ const templateUserCustomizationTests = [
},
},
{
permalink: '/product-category/clothing',
visitPage: async ( { page } ) =>
await page.goto( '/product-category/clothing' ),
templateName: 'Products by Category',
templatePath: 'woocommerce/woocommerce//taxonomy-product_cat',
templateType: 'wp_template',
Expand All @@ -37,7 +62,8 @@ const templateUserCustomizationTests = [
},
},
{
permalink: '/product-tag/recommended/',
visitPage: async ( { page } ) =>
await page.goto( '/product-tag/recommended/' ),
templateName: 'Products by Tag',
templatePath: 'woocommerce/woocommerce//taxonomy-product_tag',
templateType: 'wp_template',
Expand All @@ -47,11 +73,41 @@ const templateUserCustomizationTests = [
},
},
{
permalink: '/product/hoodie',
visitPage: async ( { page } ) => await page.goto( '/product/hoodie' ),
templateName: 'Single Product',
templatePath: 'woocommerce/woocommerce//single-product',
templateType: 'wp_template',
},
{
visitPage: async ( { frontendUtils } ) =>
await frontendUtils.goToCart(),
templateName: 'Page: Cart',
templatePath: 'woocommerce/woocommerce//page-cart',
templateType: 'wp_template',
},
{
visitPage: async ( { frontendUtils } ) => {
await frontendUtils.goToShop();
await frontendUtils.addToCart();
await frontendUtils.goToCheckout();
},
templateName: 'Page: Checkout',
templatePath: 'woocommerce/woocommerce//page-checkout',
templateType: 'wp_template',
},
{
visitPage: async ( { frontendUtils, page } ) => {
const checkoutPage = new CheckoutPage( { page } );
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't know if this is the best way to create the CheckoutPage() object, but it was the cleanest way I could find without having to extend the test object of all tests. 🤔

await frontendUtils.goToShop();
await frontendUtils.addToCart( SIMPLE_VIRTUAL_PRODUCT_NAME );
await frontendUtils.goToCheckout();
await checkoutPage.fillInCheckoutWithTestData();
await checkoutPage.placeOrder();
},
templateName: 'Order Confirmation',
templatePath: 'woocommerce/woocommerce//order-confirmation',
templateType: 'wp_template',
},
];
const userText = 'Hello World in the template';
const defaultTemplateUserText = 'Hello World in the default template';
Expand All @@ -60,6 +116,7 @@ templateUserCustomizationTests.forEach( ( testData ) => {
test.describe( `${ testData.templateName } template`, async () => {
test( 'can be modified and reverted', async ( {
admin,
frontendUtils,
editorUtils,
page,
} ) => {
Expand All @@ -75,7 +132,7 @@ templateUserCustomizationTests.forEach( ( testData ) => {
attributes: { content: userText },
} );
await editorUtils.saveTemplate();
await page.goto( testData.permalink );
await testData.visitPage( { frontendUtils, page } );
await expect( page.getByText( userText ).first() ).toBeVisible();

// Verify the edition can be reverted.
Expand All @@ -86,19 +143,20 @@ templateUserCustomizationTests.forEach( ( testData ) => {
await editorUtils.revertTemplateCustomizations(
testData.templateName
);
await page.goto( testData.permalink );
await testData.visitPage( { frontendUtils, page } );
await expect( page.getByText( userText ) ).toHaveCount( 0 );
} );

if ( testData.defaultTemplate ) {
test( `defaults to the ${ testData.defaultTemplate.templateName } template`, async ( {
admin,
frontendUtils,
editorUtils,
page,
} ) => {
// Edit default template and verify changes are visible.
await admin.visitSiteEditor( {
postId: testData.defaultTemplate.templatePath,
postId: testData.defaultTemplate?.templatePath || '',
postType: testData.templateType,
} );
await editorUtils.enterEditMode();
Expand All @@ -110,7 +168,7 @@ templateUserCustomizationTests.forEach( ( testData ) => {
},
} );
await editorUtils.saveTemplate();
await page.goto( testData.permalink );
await testData.visitPage( { frontendUtils, page } );
await expect(
page.getByText( defaultTemplateUserText ).first()
).toBeVisible();
Expand All @@ -121,9 +179,9 @@ templateUserCustomizationTests.forEach( ( testData ) => {
`path=/${ testData.templateType }/all`
);
await editorUtils.revertTemplateCustomizations(
testData.defaultTemplate.templateName
testData.defaultTemplate?.templateName || ''
);
await page.goto( testData.permalink );
await testData.visitPage( { frontendUtils, page } );
await expect(
page.getByText( defaultTemplateUserText )
).toHaveCount( 0 );
Expand Down
4 changes: 4 additions & 0 deletions .../changelog/43992-update-cart-checkout-order-confirmation-templates-to-parameterized-tests
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
Significance: patch
Type: update
Comment: Move Cart, Checkout and Order Confirmation template customization tests to the parameterized tests file