Migrate html block test case to Playwright (#41231)

* Migrate html spec test case

* Address Review Feedbacks

* Apply suggestions from code review

Co-authored-by: Pooja Killekar <poojakillekar@Poojas-MacBook-Air.local>
Co-authored-by: Kai Hao <kevin830726@gmail.com>

test/e2e/specs/editor/blocks/html.spec.js

@@ -0,0 +1,33 @@
+/**
+ * WordPress dependencies
+ */
+const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' );
+
+test.describe( 'HTML block', () => {
+	test.beforeEach( async ( { admin } ) => {
+		await admin.createNewPost();
+	} );
+
+	test( 'can be created by typing "/html"', async ( { editor, page } ) => {
+		// Create a Custom HTML block with the slash shortcut.
+		await page.click( 'role=button[name="Add default block"i]' );
+		await page.keyboard.type( '/html' );
+		await expect(
+			page.locator( 'role=option[name="Custom HTML"i][selected]' )
+		).toBeVisible();
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type( '<p>Pythagorean theorem: ' );
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type(
+			'<var>a</var><sup>2</sup> + <var>b</var><sup>2</sup> = <var>c</var><sup>2</sup> </p>'
+		);
+		// Check the content.
+		const content = await editor.getEditedPostContent();
+		expect( content ).toBe(
+			`<!-- wp:html -->
+<p>Pythagorean theorem: 
+<var>a</var><sup>2</sup> + <var>b</var><sup>2</sup> = <var>c</var><sup>2</sup> </p>
+<!-- /wp:html -->`
+		);
+	} );
+} );