Fix some e2e tests

packages/block-editor/src/components/rich-text/use-input-rules.js

@@ -136,11 +136,20 @@ export function useInputRules( props ) {
 			}
 		}
 
-		element.addEventListener( 'input', onInput );
-		element.addEventListener( 'compositionend', onInput );
+		// We use queueMicrotask to dealy the onOnput event handler
+		// This was necessary after React 18 upgrade
+		// The reason is that propsRef is not updated yet
+		// when the event handler is called
+		// Ideally the event handled shouldn't be relying on propsRef
+		// but should be relying on DOM state.
+		const delayedOnInput = ( event ) =>
+			queueMicrotask( () => onInput( event ) );
+		element.addEventListener( 'input', delayedOnInput );
+		element.addEventListener( 'compositionend', delayedOnInput );
+
 		return () => {
-			element.removeEventListener( 'input', onInput );
-			element.removeEventListener( 'compositionend', onInput );
+			element.removeEventListener( 'input', delayedOnInput );
+			element.removeEventListener( 'compositionend', delayedOnInput );
 		};
 	}, [] );
 }

packages/e2e-test-utils/src/click-block-appender.js

@@ -10,4 +10,7 @@ export async function clickBlockAppender() {
 		'.block-editor-default-block-appender__content'
 	);
 	await appender.click();
+
+	// this was necessary after React 18 (probably due to the auto-batching)
+	await page.evaluate( () => new Promise( window.requestAnimationFrame ) );
 }

packages/e2e-tests/specs/editor/various/__snapshots__/rich-text.test.js.snap

@@ -72,6 +72,12 @@ exports[`RichText should not format text after code backtick 1`] = `
 <!-- /wp:paragraph -->"
 `;
 
+exports[`RichText should not highlight more than one format 1`] = `
+"<!-- wp:paragraph -->
+<p><strong>1</strong> <strong>2</strong></p>
+<!-- /wp:paragraph -->"
+`;
+
 exports[`RichText should not lose selection direction 1`] = `
 "<!-- wp:paragraph -->
 <p><strong>1</strong>2-3</p>

packages/e2e-tests/specs/editor/various/rich-text.test.js

@@ -80,6 +80,7 @@ describe( 'RichText', () => {
 					.length
 		);
 
+		expect( await getEditedPostContent() ).toMatchSnapshot();
 		expect( count ).toBe( 1 );
 	} );
 
@@ -381,7 +382,9 @@ describe( 'RichText', () => {
 
 		// Add text and select to color.
 		await page.keyboard.type( '1' );
+
 		await pressKeyWithModifier( 'primary', 'a' );
+
 		await clickBlockToolbarButton( 'More' );
 
 		const button = await page.waitForXPath(
@@ -391,6 +394,9 @@ describe( 'RichText', () => {
 		await button.evaluate( ( element ) => element.scrollIntoView() );
 		await button.click();
 
+		await page.evaluate(
+			() => new Promise( window.requestAnimationFrame )
+		);
 		// Tab to the "Text" tab.
 		await page.keyboard.press( 'Tab' );
 		// Tab to black.