@wordpress/e2e-tests 7.5.0 → 7.6.0

package/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased
 
+## 7.6.0 (2023-06-07)
+
 ## 7.5.0 (2023-05-24)
 
 ## 7.4.0 (2023-05-10)

package/config/setup-test-framework.js

@@ -158,6 +158,15 @@ function observeConsoleLogging() {
 			return;
 		}
 
+		// Ignore framer-motion warnings about reduced motion.
+		if (
+			text.includes(
+				'You have Reduced Motion enabled on your device. Animations may not appear as expected.'
+			)
+		) {
+			return;
+		}
+
 		const logFunction = OBSERVED_CONSOLE_MESSAGE_TYPES[ type ];
 
 		// As of Puppeteer 1.6.1, `message.text()` wrongly returns an object of

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/e2e-tests",
-	"version": "7.5.0",
+	"version": "7.6.0",
 	"description": "End-To-End (E2E) tests for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -23,11 +23,11 @@
 		"node": ">=14"
 	},
 	"dependencies": {
-		"@wordpress/e2e-test-utils": "^10.5.0",
-		"@wordpress/jest-console": "^7.5.0",
-		"@wordpress/jest-puppeteer-axe": "^6.5.0",
-		"@wordpress/scripts": "^26.5.0",
-		"@wordpress/url": "^3.35.0",
+		"@wordpress/e2e-test-utils": "^10.6.0",
+		"@wordpress/jest-console": "^7.6.0",
+		"@wordpress/jest-puppeteer-axe": "^6.6.0",
+		"@wordpress/scripts": "^26.6.0",
+		"@wordpress/url": "^3.36.0",
 		"chalk": "^4.0.0",
 		"expect-puppeteer": "^4.4.0",
 		"filenamify": "^4.2.0",
@@ -45,5 +45,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "c7c79cb11b677adcbf06cf5f8cfb6c5ec1699f19"
+	"gitHead": "a92f606309b1541b834ff9b0a76ed2a466fc45ed"
 }

package/plugins/block-context.php

@@ -52,7 +52,7 @@ function gutenberg_test_register_context_blocks() {
 				'postId',
 				'postType',
 			),
-			'render_callback' => function( $attributes, $content, $block ) {
+			'render_callback' => static function( $attributes, $content, $block ) {
 				$ordered_context = array(
 					$block->context['gutenberg/recordId'],
 					$block->context['postId'],

package/plugins/iframed-block/block.json

@@ -1,5 +1,5 @@
 {
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "test/iframed-block",
 	"title": "Iframed Block",
 	"category": "text",

package/plugins/iframed-block.php

@@ -9,14 +9,14 @@
 
 add_action(
 	'setup_theme',
-	function() {
+	static function() {
 		add_theme_support( 'block-templates' );
 	}
 );
 
 add_action(
 	'init',
-	function() {
+	static function() {
 		wp_register_script(
 			'iframed-block-jquery-test',
 			plugin_dir_url( __FILE__ ) . 'iframed-block/jquery.test.js',

package/plugins/iframed-enqueue-block-assets.php

@@ -9,7 +9,7 @@
 
 add_action(
 	'enqueue_block_assets',
-	function() {
+	static function() {
 		wp_enqueue_style(
 			'iframed-enqueue-block-assets',
 			plugin_dir_url( __FILE__ ) . 'iframed-enqueue-block-assets/style.css',

package/plugins/iframed-inline-styles/block.json

@@ -1,5 +1,5 @@
 {
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "test/iframed-inline-styles",
 	"title": "Iframed Inline Styles",
 	"category": "text",

package/plugins/iframed-inline-styles/editor.js

@@ -4,7 +4,7 @@
 	const { useBlockProps } = blockEditor;
 
 	registerBlockType( 'test/iframed-inline-styles', {
-		apiVersion: 2,
+		apiVersion: 3,
 		edit: function Edit() {
 			return el( 'div', useBlockProps(), 'Edit' );
 		},

package/plugins/iframed-inline-styles.php

@@ -9,14 +9,14 @@
 
 add_action(
 	'setup_theme',
-	function() {
+	static function() {
 		add_theme_support( 'block-templates' );
 	}
 );
 
 add_action(
 	'init',
-	function() {
+	static function() {
 		wp_register_script(
 			'iframed-inline-styles-editor-script',
 			plugin_dir_url( __FILE__ ) . 'iframed-inline-styles/editor.js',
@@ -40,7 +40,7 @@ add_action(
 
 add_action(
 	'enqueue_block_editor_assets',
-	function() {
+	static function() {
 		wp_enqueue_style(
 			'iframed-inline-styles-compat-style',
 			plugin_dir_url( __FILE__ ) . 'iframed-inline-styles/compat-style.css',

package/plugins/iframed-masonry-block/block.json

@@ -1,5 +1,5 @@
 {
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "test/iframed-masonry-block",
 	"title": "Iframed Masonry Block",
 	"category": "text",

package/plugins/iframed-masonry-block/editor.js

@@ -31,7 +31,7 @@
 	];
 
 	registerBlockType( 'test/iframed-masonry-block', {
-		apiVersion: 2,
+		apiVersion: 3,
 		edit: function Edit() {
 			const ref = useRefEffect( ( node ) => {
 				const { ownerDocument } = node;

package/plugins/iframed-masonry-block.php

@@ -9,14 +9,14 @@
 
 add_action(
 	'setup_theme',
-	function() {
+	static function() {
 		add_theme_support( 'block-templates' );
 	}
 );
 
 add_action(
 	'init',
-	function() {
+	static function() {
 		wp_register_script(
 			'iframed-masonry-block-editor',
 			plugin_dir_url( __FILE__ ) . 'iframed-masonry-block/editor.js',

package/plugins/iframed-multiple-stylesheets/block.json

@@ -1,5 +1,5 @@
 {
-	"apiVersion": 2,
+	"apiVersion": 3,
 	"name": "test/iframed-multiple-stylesheets",
 	"title": "Iframed Multiple Stylesheets",
 	"category": "text",

package/plugins/iframed-multiple-stylesheets/editor.js

@@ -4,7 +4,7 @@
 	const { useBlockProps } = blockEditor;
 
 	registerBlockType( 'test/iframed-multiple-stylesheets', {
-		apiVersion: 2,
+		apiVersion: 3,
 		edit: function Edit() {
 			return el( 'div', useBlockProps(), 'Edit' );
 		},

package/plugins/iframed-multiple-stylesheets.php

@@ -9,14 +9,14 @@
 
 add_action(
 	'setup_theme',
-	function() {
+	static function() {
 		add_theme_support( 'block-templates' );
 	}
 );
 
 add_action(
 	'init',
-	function() {
+	static function() {
 		wp_register_script(
 			'iframed-multiple-stylesheets-editor-script',
 			plugin_dir_url( __FILE__ ) . 'iframed-multiple-stylesheets/editor.js',

package/plugins/marquee-function-widget.php

@@ -14,7 +14,7 @@ function marquee_greeting_init() {
 	wp_register_sidebar_widget(
 		'marquee_greeting',
 		'Marquee Greeting',
-		function() {
+		static function() {
 			$greeting = get_option( 'marquee_greeting', 'Hello!' );
 			printf( '<marquee>%s</marquee>', esc_html( $greeting ) );
 		}
@@ -23,7 +23,7 @@ function marquee_greeting_init() {
 	wp_register_widget_control(
 		'marquee_greeting',
 		'Marquee Greeting',
-		function() {
+		static function() {
 			if ( isset( $_POST['marquee-greeting'] ) ) {
 				update_option(
 					'marquee_greeting',

package/specs/editor/blocks/post-title.test.js

@@ -5,6 +5,7 @@ import {
 	createNewPost,
 	insertBlock,
 	saveDraft,
+	canvas,
 } from '@wordpress/e2e-test-utils';
 
 describe( 'Post Title block', () => {
@@ -14,11 +15,11 @@ describe( 'Post Title block', () => {
 
 	it( 'Can edit the post title', async () => {
 		// Create a block with some text that will trigger a list creation.
-		await insertBlock( 'Post Title' );
+		await insertBlock( 'Title' );
 		const editablePostTitleSelector =
 			'.wp-block-post-title[contenteditable="true"]';
-		await page.waitForSelector( editablePostTitleSelector );
-		await page.focus( editablePostTitleSelector );
+		await canvas().waitForSelector( editablePostTitleSelector );
+		await canvas().focus( editablePostTitleSelector );
 
 		// Create a second list item.
 		await page.keyboard.type( 'Just tweaking the post title' );
@@ -26,7 +27,7 @@ describe( 'Post Title block', () => {
 		await saveDraft();
 		await page.reload();
 		await page.waitForSelector( '.edit-post-layout' );
-		const title = await page.$eval(
+		const title = await canvas().$eval(
 			'.editor-post-title__input',
 			( element ) => element.textContent
 		);

package/specs/editor/blocks/site-title.test.js

@@ -9,6 +9,7 @@ import {
 	pressKeyWithModifier,
 	setOption,
 	openDocumentSettingsSidebar,
+	canvas,
 } from '@wordpress/e2e-test-utils';
 
 const saveEntities = async () => {
@@ -45,8 +46,8 @@ describe( 'Site Title block', () => {
 		await insertBlock( 'Site Title' );
 		const editableSiteTitleSelector =
 			'[aria-label="Block: Site Title"] a[contenteditable="true"]';
-		await page.waitForSelector( editableSiteTitleSelector );
-		await page.focus( editableSiteTitleSelector );
+		await canvas().waitForSelector( editableSiteTitleSelector );
+		await canvas().focus( editableSiteTitleSelector );
 		await pressKeyWithModifier( 'primary', 'a' );
 
 		await page.keyboard.type( 'New Site Title' );

package/specs/editor/plugins/annotations.test.js

@@ -8,6 +8,7 @@ import {
 	clickOnMoreMenuItem,
 	createNewPost,
 	deactivatePlugin,
+	canvas,
 } from '@wordpress/e2e-test-utils';
 
 const clickOnBlockSettingsMenuItem = async ( buttonLabel ) => {
@@ -28,6 +29,13 @@ describe( 'Annotations', () => {
 
 	beforeEach( async () => {
 		await createNewPost();
+		// To do: run with iframe.
+		await page.evaluate( () => {
+			window.wp.blocks.registerBlockType( 'test/v2', {
+				apiVersion: '2',
+				title: 'test',
+			} );
+		} );
 	} );
 
 	/**
@@ -51,7 +59,7 @@ describe( 'Annotations', () => {
 			await page.$x( "//button[contains(text(), 'Add annotation')]" )
 		 )[ 0 ];
 		await addAnnotationButton.click();
-		await page.evaluate( () =>
+		await canvas().evaluate( () =>
 			document.querySelector( '.wp-block-paragraph' ).focus()
 		);
 	}
@@ -67,7 +75,7 @@ describe( 'Annotations', () => {
 			await page.$x( "//button[contains(text(), 'Remove annotations')]" )
 		 )[ 0 ];
 		await addAnnotationButton.click();
-		await page.evaluate( () =>
+		await canvas().evaluate( () =>
 			document.querySelector( '[contenteditable]' ).focus()
 		);
 	}
@@ -78,11 +86,11 @@ describe( 'Annotations', () => {
 	 * @return {Promise<string>} The annotated text.
 	 */
 	async function getAnnotatedText() {
-		const annotations = await page.$$( ANNOTATIONS_SELECTOR );
+		const annotations = await canvas().$$( ANNOTATIONS_SELECTOR );
 
 		const annotation = annotations[ 0 ];
 
-		return await page.evaluate( ( el ) => el.innerText, annotation );
+		return await canvas().evaluate( ( el ) => el.innerText, annotation );
 	}
 
 	/**
@@ -91,7 +99,7 @@ describe( 'Annotations', () => {
 	 * @return {Promise<string>} Inner HTML.
 	 */
 	async function getRichTextInnerHTML() {
-		const htmlContent = await page.$$( '.wp-block-paragraph' );
+		const htmlContent = await canvas().$$( '.wp-block-paragraph' );
 		return await page.evaluate( ( el ) => {
 			return el.innerHTML;
 		}, htmlContent[ 0 ] );
@@ -102,12 +110,12 @@ describe( 'Annotations', () => {
 
 		await clickOnMoreMenuItem( 'Annotations' );
 
-		let annotations = await page.$$( ANNOTATIONS_SELECTOR );
+		let annotations = await canvas().$$( ANNOTATIONS_SELECTOR );
 		expect( annotations ).toHaveLength( 0 );
 
 		await annotateFirstBlock( 9, 13 );
 
-		annotations = await page.$$( ANNOTATIONS_SELECTOR );
+		annotations = await canvas().$$( ANNOTATIONS_SELECTOR );
 		expect( annotations ).toHaveLength( 1 );
 
 		const text = await getAnnotatedText();
@@ -115,7 +123,7 @@ describe( 'Annotations', () => {
 
 		await clickOnBlockSettingsMenuItem( 'Edit as HTML' );
 
-		const htmlContent = await page.$$(
+		const htmlContent = await canvas().$$(
 			'.block-editor-block-list__block-html-textarea'
 		);
 		const html = await page.evaluate( ( el ) => {
@@ -136,7 +144,7 @@ describe( 'Annotations', () => {
 		await page.keyboard.type( 'D' );
 
 		await removeAnnotations();
-		const htmlContent = await page.$$( '.wp-block-paragraph' );
+		const htmlContent = await canvas().$$( '.wp-block-paragraph' );
 		const html = await page.evaluate( ( el ) => {
 			return el.innerHTML;
 		}, htmlContent[ 0 ] );

package/specs/editor/plugins/block-variations.test.js

@@ -11,6 +11,7 @@ import {
 	openDocumentSettingsSidebar,
 	togglePreferencesOption,
 	toggleMoreMenu,
+	canvas,
 } from '@wordpress/e2e-test-utils';
 
 describe( 'Block variations', () => {
@@ -45,7 +46,7 @@ describe( 'Block variations', () => {
 		await insertBlock( 'Large Quote' );
 
 		expect(
-			await page.$(
+			await canvas().$(
 				'.wp-block[data-type="core/quote"] blockquote.is-style-large'
 			)
 		).toBeDefined();
@@ -58,7 +59,7 @@ describe( 'Block variations', () => {
 		await page.keyboard.press( 'Enter' );
 
 		expect(
-			await page.$(
+			await canvas().$(
 				'.wp-block[data-type="core/quote"] blockquote.is-style-large'
 			)
 		).toBeDefined();
@@ -75,7 +76,7 @@ describe( 'Block variations', () => {
 	test( 'Insert the Success Message block variation', async () => {
 		await insertBlock( 'Success Message' );
 
-		const successMessageBlock = await page.$(
+		const successMessageBlock = await canvas().$(
 			'.wp-block[data-type="core/paragraph"]'
 		);
 		expect( successMessageBlock ).toBeDefined();
@@ -86,12 +87,12 @@ describe( 'Block variations', () => {
 	test( 'Pick the additional variation in the inserted Columns block', async () => {
 		await insertBlock( 'Columns' );
 
-		const fourColumnsVariation = await page.waitForSelector(
+		const fourColumnsVariation = await canvas().waitForSelector(
 			'.wp-block[data-type="core/columns"] .block-editor-block-variation-picker__variation[aria-label="Four columns"]'
 		);
 		await fourColumnsVariation.click();
 		expect(
-			await page.$$(
+			await canvas().$$(
 				'.wp-block[data-type="core/columns"] .wp-block[data-type="core/column"]'
 			)
 		).toHaveLength( 4 );

package/specs/editor/plugins/cpt-locking.test.js

@@ -12,6 +12,7 @@ import {
 	pressKeyTimes,
 	pressKeyWithModifier,
 	setPostContent,
+	canvas,
 } from '@wordpress/e2e-test-utils';
 
 describe( 'cpt locking', () => {
@@ -35,7 +36,7 @@ describe( 'cpt locking', () => {
 	};
 
 	const shouldNotAllowBlocksToBeRemoved = async () => {
-		await page.type(
+		await canvas().type(
 			'.block-editor-rich-text__editable[data-type="core/paragraph"]',
 			'p1'
 		);
@@ -46,12 +47,12 @@ describe( 'cpt locking', () => {
 	};
 
 	const shouldAllowBlocksToBeMoved = async () => {
-		await page.click(
+		await canvas().click(
 			'div > .block-editor-rich-text__editable[data-type="core/paragraph"]'
 		);
 		expect( await page.$( 'button[aria-label="Move up"]' ) ).not.toBeNull();
 		await page.click( 'button[aria-label="Move up"]' );
-		await page.type(
+		await canvas().type(
 			'div > .block-editor-rich-text__editable[data-type="core/paragraph"]',
 			'p1'
 		);
@@ -71,14 +72,14 @@ describe( 'cpt locking', () => {
 		);
 
 		it( 'should not allow blocks to be moved', async () => {
-			await page.click(
+			await canvas().click(
 				'.block-editor-rich-text__editable[data-type="core/paragraph"]'
 			);
 			expect( await page.$( 'button[aria-label="Move up"]' ) ).toBeNull();
 		} );
 
 		it( 'should not error when deleting the cotents of a paragraph', async () => {
-			await page.click(
+			await canvas().click(
 				'.block-editor-block-list__block[data-type="core/paragraph"]'
 			);
 			const textToType = 'Paragraph';
@@ -88,7 +89,7 @@ describe( 'cpt locking', () => {
 		} );
 
 		it( 'should insert line breaks when using enter and shift-enter', async () => {
-			await page.click(
+			await canvas().click(
 				'.block-editor-block-list__block[data-type="core/paragraph"]'
 			);
 			await page.keyboard.type( 'First line' );
@@ -118,12 +119,14 @@ describe( 'cpt locking', () => {
 		} );
 
 		it( 'should not allow blocks to be inserted in inner blocks', async () => {
-			await page.click( 'button[aria-label="Two columns; equal split"]' );
+			await canvas().click(
+				'button[aria-label="Two columns; equal split"]'
+			);
 			await page.evaluate(
 				() => new Promise( window.requestIdleCallback )
 			);
 			expect(
-				await page.$(
+				await canvas().$(
 					'.wp-block-column .block-editor-button-block-appender'
 				)
 			).toBeNull();
@@ -173,7 +176,7 @@ describe( 'cpt locking', () => {
 		} );
 
 		it( 'should allow blocks to be removed', async () => {
-			await page.type(
+			await canvas().type(
 				'.block-editor-rich-text__editable[data-type="core/paragraph"]',
 				'p1'
 			);
@@ -193,7 +196,7 @@ describe( 'cpt locking', () => {
 		} );
 
 		it( 'should allow blocks to be removed', async () => {
-			await page.type(
+			await canvas().type(
 				'div > .block-editor-rich-text__editable[data-type="core/paragraph"]',
 				'p1'
 			);
@@ -219,7 +222,7 @@ describe( 'cpt locking', () => {
 		);
 
 		it( 'should not allow blocks to be moved', async () => {
-			await page.click(
+			await canvas().click(
 				'.block-editor-rich-text__editable[data-type="core/paragraph"]'
 			);
 			expect( await page.$( 'button[aria-label="Move up"]' ) ).toBeNull();
@@ -239,7 +242,7 @@ describe( 'cpt locking', () => {
 		);
 
 		it( 'should not allow blocks to be moved', async () => {
-			await page.click(
+			await canvas().click(
 				'.block-editor-rich-text__editable[data-type="core/paragraph"]'
 			);
 			expect( await page.$( 'button[aria-label="Move up"]' ) ).toBeNull();

package/specs/editor/plugins/iframed-inline-styles.test.js

@@ -35,8 +35,10 @@ describe( 'iframed inline styles', () => {
 		await insertBlock( 'Iframed Inline Styles' );
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();
-		expect( await getComputedStyle( page, 'padding' ) ).toBe( '20px' );
-		expect( await getComputedStyle( page, 'border-width' ) ).toBe( '2px' );
+		expect( await getComputedStyle( canvas(), 'padding' ) ).toBe( '20px' );
+		expect( await getComputedStyle( canvas(), 'border-width' ) ).toBe(
+			'2px'
+		);
 
 		await createNewTemplate( 'Iframed Test' );
 
@@ -48,5 +50,7 @@ describe( 'iframed inline styles', () => {
 		expect( await getComputedStyle( canvas(), 'border-width' ) ).toBe(
 			'2px'
 		);
+
+		expect( console ).toHaveWarned();
 	} );
 } );

package/specs/editor/plugins/iframed-masonry-block.test.js

@@ -39,7 +39,7 @@ describe( 'iframed masonry block', () => {
 		await insertBlock( 'Iframed Masonry Block' );
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();
-		expect( await didMasonryLoadCorrectly( page ) ).toBe( true );
+		expect( await didMasonryLoadCorrectly( canvas() ) ).toBe( true );
 
 		await createNewTemplate( 'Iframed Test' );
 		await canvas().waitForSelector( '.grid-item[style]' );

package/specs/editor/plugins/iframed-multiple-block-stylesheets.test.js

@@ -35,7 +35,7 @@ describe( 'iframed multiple block stylesheets', () => {
 	it( 'should load multiple block stylesheets in iframe', async () => {
 		await insertBlock( 'Iframed Multiple Stylesheets' );
 
-		await page.waitForSelector(
+		await canvas().waitForSelector(
 			'.wp-block-test-iframed-multiple-stylesheets'
 		);
 		await createNewTemplate( 'Iframed Test' );

package/specs/editor/plugins/inner-blocks-allowed-blocks.test.js

@@ -10,6 +10,7 @@ import {
 	openGlobalBlockInserter,
 	closeGlobalBlockInserter,
 	clickBlockToolbarButton,
+	canvas,
 } from '@wordpress/e2e-test-utils';
 
 describe( 'Allowed Blocks Setting on InnerBlocks', () => {
@@ -32,8 +33,8 @@ describe( 'Allowed Blocks Setting on InnerBlocks', () => {
 		const childParagraphSelector = `${ parentBlockSelector } ${ paragraphSelector }`;
 		await insertBlock( 'Allowed Blocks Unset' );
 		await closeGlobalBlockInserter();
-		await page.waitForSelector( childParagraphSelector );
-		await page.click( childParagraphSelector );
+		await canvas().waitForSelector( childParagraphSelector );
+		await canvas().click( childParagraphSelector );
 		await openGlobalBlockInserter();
 		await expect(
 			(
@@ -47,8 +48,8 @@ describe( 'Allowed Blocks Setting on InnerBlocks', () => {
 		const childParagraphSelector = `${ parentBlockSelector } ${ paragraphSelector }`;
 		await insertBlock( 'Allowed Blocks Set' );
 		await closeGlobalBlockInserter();
-		await page.waitForSelector( childParagraphSelector );
-		await page.click( childParagraphSelector );
+		await canvas().waitForSelector( childParagraphSelector );
+		await canvas().click( childParagraphSelector );
 		await openGlobalBlockInserter();
 		const allowedBlocks = await getAllBlockInserterItemTitles();
 		expect( allowedBlocks.sort() ).toEqual( [
@@ -66,8 +67,8 @@ describe( 'Allowed Blocks Setting on InnerBlocks', () => {
 		const parentBlockSelector = '[data-type="test/allowed-blocks-dynamic"]';
 		const blockAppender = '.block-list-appender button';
 		const appenderSelector = `${ parentBlockSelector } ${ blockAppender }`;
-		await page.waitForSelector( appenderSelector );
-		await page.click( appenderSelector );
+		await canvas().waitForSelector( appenderSelector );
+		await canvas().click( appenderSelector );
 		expect( await getAllBlockInserterItemTitles() ).toEqual( [
 			'Image',
 			'List',

package/specs/editor/plugins/inner-blocks-prioritized-inserter-blocks.test.js

@@ -8,6 +8,7 @@ import {
 	getAllBlockInserterItemTitles,
 	insertBlock,
 	closeGlobalBlockInserter,
+	canvas,
 } from '@wordpress/e2e-test-utils';
 
 const QUICK_INSERTER_RESULTS_SELECTOR =
@@ -108,7 +109,7 @@ describe( 'Prioritized Inserter Blocks Setting on InnerBlocks', () => {
 	describe( 'Slash inserter', () => {
 		it( 'uses the priority ordering if prioritzed blocks setting is set', async () => {
 			await insertBlock( 'Prioritized Inserter Blocks Set' );
-			await page.click( '[data-type="core/image"]' );
+			await canvas().click( '[data-type="core/image"]' );
 			await page.keyboard.press( 'Enter' );
 			await page.keyboard.type( '/' );
 			// Wait for the results to display.