From f04ecbfe8dbadfb14fad34ce96744fcc936b1c6f Mon Sep 17 00:00:00 2001
From: Veljko V <veljano@yahoo.com>
Date: Fri, 23 Feb 2024 18:51:08 +0100
Subject: [PATCH] Add new E2E test for merchant transforming classic cart to
 cart block (#44926)

---
 .../e2e-add-merchant-transform-cart-test      |  4 ++
 .../tests/merchant/create-cart-block.spec.js  | 72 +++++++++++++++++++
 2 files changed, 76 insertions(+)
 create mode 100644 plugins/woocommerce/changelog/e2e-add-merchant-transform-cart-test
 create mode 100644 plugins/woocommerce/tests/e2e-pw/tests/merchant/create-cart-block.spec.js

diff --git a/plugins/woocommerce/changelog/e2e-add-merchant-transform-cart-test b/plugins/woocommerce/changelog/e2e-add-merchant-transform-cart-test
new file mode 100644
index 0000000000000..31fb8dd2e7952
--- /dev/null
+++ b/plugins/woocommerce/changelog/e2e-add-merchant-transform-cart-test
@@ -0,0 +1,4 @@
+Significance: patch
+Type: dev
+
+E2E tests: add test for transforming classic cart to cart block
diff --git a/plugins/woocommerce/tests/e2e-pw/tests/merchant/create-cart-block.spec.js b/plugins/woocommerce/tests/e2e-pw/tests/merchant/create-cart-block.spec.js
new file mode 100644
index 0000000000000..22dea643514e3
--- /dev/null
+++ b/plugins/woocommerce/tests/e2e-pw/tests/merchant/create-cart-block.spec.js
@@ -0,0 +1,72 @@
+const { test, expect } = require( '@playwright/test' );
+const { closeWelcomeModal } = require( '../../utils/editor' );
+
+const transformedCartBlockTitle = `Transformed Cart ${ Date.now() }`;
+const transformedCartBlockSlug = transformedCartBlockTitle
+	.replace( / /gi, '-' )
+	.toLowerCase();
+
+test.describe( 'Transform Classic Cart To Cart Block', () => {
+	test.use( { storageState: process.env.ADMINSTATE } );
+
+	test( 'can transform classic cart to cart block', async ( { page } ) => {
+		// go to create a new page
+		await page.goto( 'wp-admin/post-new.php?post_type=page' );
+
+		await closeWelcomeModal( { page } );
+
+		// fill page title
+		await page
+			.getByRole( 'textbox', { name: 'Add title' } )
+			.fill( transformedCartBlockTitle );
+
+		// add classic cart block
+		await page.getByRole( 'textbox', { name: 'Add title' } ).click();
+		await page.getByLabel( 'Add block' ).click();
+		await page
+			.getByPlaceholder( 'Search', { exact: true } )
+			.fill( 'classic cart' );
+		await page
+			.getByRole( 'option' )
+			.filter( { hasText: 'Classic Cart' } )
+			.click();
+
+		// transform into blocks
+		await expect(
+			page.locator(
+				'.wp-block-woocommerce-classic-shortcode__placeholder-copy'
+			)
+		).toBeVisible();
+		await page
+			.getByRole( 'button' )
+			.filter( { hasText: 'Transform into blocks' } )
+			.click();
+		await expect( page.getByLabel( 'Dismiss this notice' ) ).toContainText(
+			'Classic shortcode transformed to blocks.'
+		);
+
+		// save and publish the page
+		await page
+			.getByRole( 'button', { name: 'Publish', exact: true } )
+			.click();
+		await page
+			.getByRole( 'region', { name: 'Editor publish' } )
+			.getByRole( 'button', { name: 'Publish', exact: true } )
+			.click();
+		await expect(
+			page.getByText( `${ transformedCartBlockTitle } is now live.` )
+		).toBeVisible();
+
+		// go to frontend to verify transformed cart block
+		await page.goto( transformedCartBlockSlug );
+		await expect(
+			page.getByRole( 'heading', { name: transformedCartBlockTitle } )
+		).toBeVisible();
+		await expect(
+			page.getByText( 'Your cart is currently empty!' )
+		).toBeVisible();
+		await expect(
+			page.getByRole( 'link', { name: 'Browse store' } )
+		).toBeVisible();
+	} );
+} );