@wordpress/e2e-tests 7.23.0 → 7.25.0

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+## 7.25.0 (2024-03-21)
+
+## 7.24.0 (2024-03-06)
+
 ## 7.23.0 (2024-02-21)
 
 ## 7.22.0 (2024-02-09)

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/e2e-tests",
-	"version": "7.23.0",
+	"version": "7.25.0",
 	"description": "End-To-End (E2E) tests for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -23,13 +23,13 @@
 		"node": ">=14"
 	},
 	"dependencies": {
-		"@wordpress/e2e-test-utils": "^10.23.0",
-		"@wordpress/interactivity": "^5.1.0",
-		"@wordpress/interactivity-router": "^1.2.0",
-		"@wordpress/jest-console": "^7.23.0",
-		"@wordpress/jest-puppeteer-axe": "^6.23.0",
-		"@wordpress/scripts": "^27.3.0",
-		"@wordpress/url": "^3.53.0",
+		"@wordpress/e2e-test-utils": "^10.25.0",
+		"@wordpress/interactivity": "^5.3.0",
+		"@wordpress/interactivity-router": "^1.4.0",
+		"@wordpress/jest-console": "^7.25.0",
+		"@wordpress/jest-puppeteer-axe": "^6.25.0",
+		"@wordpress/scripts": "^27.5.0",
+		"@wordpress/url": "^3.55.0",
 		"chalk": "^4.0.0",
 		"expect-puppeteer": "^4.4.0",
 		"filenamify": "^4.2.0",
@@ -46,5 +46,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "c139588f4c668b38bafbc5431f2f4e3903dbe683"
+	"gitHead": "ffc07735d0abfb3f69e91d48f25b7fe8d1ef92d2"
 }

package/plugins/block-bindings.php

@@ -21,7 +21,6 @@ function gutenberg_test_block_bindings_register_custom_fields() {
 			'default'      => 'Value of the text_custom_field',
 		)
 	);
-	// TODO: Change url.
 	register_meta(
 		'post',
 		'url_custom_field',
@@ -32,5 +31,24 @@ function gutenberg_test_block_bindings_register_custom_fields() {
 			'default'      => '#url-custom-field',
 		)
 	);
+	register_meta(
+		'post',
+		'_protected_field',
+		array(
+			'type'    => 'string',
+			'single'  => true,
+			'default' => 'protected field value',
+		)
+	);
+	register_meta(
+		'post',
+		'show_in_rest_false_field',
+		array(
+			'show_in_rest' => false,
+			'type'         => 'string',
+			'single'       => true,
+			'default'      => 'show_in_rest false field value',
+		)
+	);
 }
 add_action( 'init', 'gutenberg_test_block_bindings_register_custom_fields' );

package/plugins/interactive-blocks/deferred-store/block.json

@@ -0,0 +1,15 @@
+{
+	"$schema": "https://schemas.wp.org/trunk/block.json",
+	"apiVersion": 2,
+	"name": "test/deferred-store",
+	"title": "E2E Interactivity tests - deferred store",
+	"category": "text",
+	"icon": "heart",
+	"description": "",
+	"supports": {
+		"interactivity": true
+	},
+	"textdomain": "e2e-interactivity",
+	"viewScriptModule": "file:./view.js",
+	"render": "file:./render.php"
+}

package/plugins/interactive-blocks/deferred-store/render.php

@@ -0,0 +1,15 @@
+<?php
+/**
+ * HTML for testing scope restoration with generators.
+ *
+ * @package gutenberg-test-interactive-blocks
+ */
+?>
+
+<div
+	data-wp-interactive="test/deferred-store"
+	<?php echo wp_interactivity_data_wp_context( array( 'text' => '!dlrow ,olleH' ) ); ?>
+>
+	<span data-wp-text="state.reversedText" data-testid="result"></span>
+	<span data-wp-text="state.reversedTextGetter" data-testid="result-getter"></span>
+</div>

package/plugins/interactive-blocks/deferred-store/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );

package/plugins/interactive-blocks/deferred-store/view.js

@@ -0,0 +1,20 @@
+/**
+ * WordPress dependencies
+ */
+import { store, getContext } from '@wordpress/interactivity';
+
+document.addEventListener( 'DOMContentLoaded', () => {
+	setTimeout( () => {
+		store( 'test/deferred-store', {
+			state: {
+				reversedText() {
+					return [ ...getContext().text ].reverse().join( '' );
+				},
+
+				get reversedTextGetter() {
+					return [ ...getContext().text ].reverse().join( '' );
+				},
+			},
+		} );
+	}, 50 );
+} );

package/plugins/interactive-blocks/directive-bind/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-bind-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-bind/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-bind-view' );
 ?>
 
 <div data-wp-interactive="directive-bind">

package/plugins/interactive-blocks/directive-bind/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );

package/plugins/interactive-blocks/directive-class/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-class-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-class/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-class-view' );
 ?>
 
 <div data-wp-interactive='{"namespace": "directive-class"}'>

package/plugins/interactive-blocks/directive-class/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );

package/plugins/interactive-blocks/directive-context/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-context-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-context/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-context-view' );
 ?>
 
 <div data-wp-interactive='{"namespace": "directive-context"}'>
@@ -18,6 +16,7 @@ wp_enqueue_script_module( 'directive-context-view' );
 		>
 			<!-- rendered during hydration -->
 		</pre>
+		<button data-testid="parent replace" data-wp-on--click="actions.replaceObj">Replace obj</button>
 		<button
 			data-testid="parent prop1"
 			name="prop1"
@@ -50,6 +49,14 @@ wp_enqueue_script_module( 'directive-context-view' );
 		>
 			obj.prop5
 		</button>
+		<button
+			data-testid="parent new"
+			name="new"
+			value="modifiedFromParent"
+			data-wp-on--click="actions.updateContext"
+		>
+			new
+		</button>
 		<div
 			data-wp-context='{ "prop2":"child","prop3":"child","obj":{"prop5":"child","prop6":"child"},"array":[4,5,6] }'
 		>
@@ -59,6 +66,7 @@ wp_enqueue_script_module( 'directive-context-view' );
 			>
 				<!-- rendered during hydration -->
 			</pre>
+			<button data-testid="child replace" data-wp-on--click="actions.replaceObj">Replace obj</button>
 			<button
 				data-testid="child prop1"
 				name="prop1"
@@ -107,6 +115,24 @@ wp_enqueue_script_module( 'directive-context-view' );
 			>
 				obj.prop6
 			</button>
+			<button
+				data-testid="child copy obj"
+				data-wp-on--click="actions.copyObj"
+			>
+				Copy obj
+			</button>
+			<div>
+				Is proxy preserved? <span
+					data-testid="is proxy preserved"
+					data-wp-text="state.isProxyPreserved"
+				></span>
+			</div>
+			<div>
+				Is proxy preserved on copy? <span
+					data-testid="is proxy preserved on copy"
+					data-wp-text="state.isProxyPreservedOnCopy"
+				></span>
+			</div>
 		</div>
 		<br />
 
@@ -127,10 +153,15 @@ wp_enqueue_script_module( 'directive-context-view' );
 	data-wp-router-region="navigation"
 	data-wp-context='{ "text": "first page" }'
 >
+	<div data-wp-context='{}'>
+		<div data-testid="navigation inherited text" data-wp-text="context.text"></div>
+		<div data-testid="navigation inherited text2" data-wp-text="context.text2"></div>
+	</div>
 	<div data-testid="navigation text" data-wp-text="context.text"></div>
 	<div data-testid="navigation new text" data-wp-text="context.newText"></div>
 	<button data-testid="toggle text" data-wp-on--click="actions.toggleText">Toggle Text</button>
 	<button data-testid="add new text" data-wp-on--click="actions.addNewText">Add New Text</button>
+	<button data-testid="add text2" data-wp-on--click="actions.addText2">Add Text 2</button>
 	<button data-testid="navigate" data-wp-on--click="actions.navigate">Navigate</button>
 	<button data-testid="async navigate" data-wp-on--click="actions.asyncNavigate">Async Navigate</button>
 </div>
@@ -143,3 +174,41 @@ wp_enqueue_script_module( 'directive-context-view' );
 	<span data-testid="non-default suffix context" data-wp-text="context.text"></span>
 	<span data-testid="default suffix context" data-wp-text="context.defaultText"></span>
 </div>
+
+<div
+	data-wp-interactive='directive-context'
+	data-wp-context='{ "list": [
+		{ "id": 1, "text": "Text 1" },
+		{ "id": 2, "text": "Text 2" }
+	] }'
+>
+	<button data-testid="select 1" data-wp-on--click="actions.selectItem" value=1>Select 1</button>
+	<button data-testid="select 2" data-wp-on--click="actions.selectItem" value=2>Select 2</button>
+	<div data-testid="selected" data-wp-text="state.selected"></div>
+</div>
+
+<div
+	data-wp-interactive="directive-context-watch"
+	data-wp-context='{"counter":0}'
+>
+	<button
+		data-testid="counter parent"
+		data-wp-on--click="actions.increment"
+		data-wp-text="context.counter"
+	></button>
+	<div
+		data-wp-context='{"counter":0, "changes":0}'
+		data-wp-watch="callbacks.countChanges"
+	>
+		<button
+			data-testid="counter child"
+			data-wp-on--click="actions.increment"
+			data-wp-text="context.counter"
+		>
+		</button>
+		<span
+			data-testid="counter changes"
+			data-wp-text="context.changes"
+		></span>
+	</div>
+</div>

package/plugins/interactive-blocks/directive-context/view.asset.php

@@ -0,0 +1,9 @@
+<?php return array(
+	'dependencies' => array(
+		'@wordpress/interactivity',
+		array(
+			'id'     => '@wordpress/interactivity-router',
+			'import' => 'dynamic',
+		),
+	),
+);

package/plugins/interactive-blocks/directive-context/view.js

@@ -9,6 +9,19 @@ store( 'directive-context', {
 			const ctx = getContext();
 			return JSON.stringify( ctx, undefined, 2 );
 		},
+		get selected() {
+			const { list, selected } = getContext();
+			return list.find( ( obj ) => obj === selected )?.text;
+		},
+		get isProxyPreserved() {
+			const ctx = getContext();
+			const pointer = ctx.obj;
+			return pointer === ctx.obj;
+		},
+		get isProxyPreservedOnCopy() {
+			const { obj, obj2 } = getContext();
+			return obj === obj2;
+		}
 	},
 	actions: {
 		updateContext( event ) {
@@ -22,6 +35,19 @@ store( 'directive-context', {
 			const ctx = getContext();
 			ctx.text = ctx.text === 'Text 1' ? 'Text 2' : 'Text 1';
 		},
+		selectItem( event ) {
+			const ctx = getContext();
+			const value = parseInt( event.target.value );
+			ctx.selected = ctx.list.find( ( { id } ) => id === value );
+		},
+		replaceObj() {
+			const ctx = getContext();
+			ctx.obj = { overwritten: true };
+		},
+		copyObj() {
+			const ctx = getContext();
+			ctx.obj2 = ctx.obj;
+		}
 	},
 } );
 
@@ -29,12 +55,17 @@ const html = `
 		<div
 			data-wp-interactive="directive-context-navigate"
 			data-wp-router-region="navigation"
-			data-wp-context='{ "text": "second page" }'
+			data-wp-context='{ "text": "second page", "text2": "second page" }'
 		>
+			<div data-wp-context='{}'>
+				<div data-testid="navigation inherited text" data-wp-text="context.text"></div>
+				<div data-testid="navigation inherited text2" data-wp-text="context.text2"></div>
+			</div>
 			<div data-testid="navigation text" data-wp-text="context.text"></div>
 			<div data-testid="navigation new text" data-wp-text="context.newText"></div>
 			<button data-testid="toggle text" data-wp-on--click="actions.toggleText">Toggle Text</button>
-			<button data-testid="add new text" data-wp-on--click="actions.addNewText">Add new text</button>
+			<button data-testid="add new text" data-wp-on--click="actions.addNewText">Add New Text</button>
+			<button data-testid="add text2" data-wp-on--click="actions.addText2">Add Text 2</button>
 			<button data-testid="navigate" data-wp-on--click="actions.navigate">Navigate</button>
 			<button data-testid="async navigate" data-wp-on--click="actions.asyncNavigate">Async Navigate</button>
 		</div>`;
@@ -49,13 +80,17 @@ const { actions } = store( 'directive-context-navigate', {
 			const ctx = getContext();
 			ctx.newText = 'some new text';
 		},
+		addText2() {
+			const ctx = getContext();
+			ctx.text2 = 'some new text';
+		},
 		navigate() {
 			return import( '@wordpress/interactivity-router' ).then(
-				( { actions: routerActions } ) =>
-					routerActions.navigate(
-						window.location,
-						{ force: true, html },
-					)
+				( { actions: routerActions } ) => {
+					const url = new URL( window.location.href );
+					url.searchParams.set( 'next_page', 'true' );
+					return routerActions.navigate( url, { force: true, html } );
+				}
 			);
 
 		},
@@ -66,3 +101,21 @@ const { actions } = store( 'directive-context-navigate', {
 		},
 	},
 } );
+
+store( 'directive-context-watch', {
+	actions: {
+		increment: () => {
+			const ctx = getContext();
+			ctx.counter = ctx.counter + 1;
+		},
+	},
+	callbacks: {
+		countChanges: () => {
+			const ctx = getContext();
+			// Subscribe to changes in counter.
+			// eslint-disable-next-line no-unused-expressions
+			ctx.counter;
+			ctx.changes = ctx.changes + 1;
+		},
+	},
+});

package/plugins/interactive-blocks/directive-each/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-each-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-each/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-each-view' );
 ?>
 
 <div data-wp-interactive="directive-each">

package/plugins/interactive-blocks/directive-each/view.asset.php

@@ -0,0 +1,9 @@
+<?php return array(
+	'dependencies' => array(
+		'@wordpress/interactivity',
+		array(
+			'id'     => '@wordpress/interactivity-router',
+			'import' => 'dynamic',
+		),
+	),
+);

package/plugins/interactive-blocks/directive-init/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-init-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-init/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-init-view' );
 ?>
 
 <div data-wp-interactive="directive-init">

package/plugins/interactive-blocks/directive-init/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );

package/plugins/interactive-blocks/directive-key/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-key-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-key/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-key-view' );
 ?>
 
 <div

package/plugins/interactive-blocks/directive-key/view.asset.php

@@ -0,0 +1,9 @@
+<?php return array(
+	'dependencies' => array(
+		'@wordpress/interactivity',
+		array(
+			'id'     => '@wordpress/interactivity-router',
+			'import' => 'dynamic',
+		),
+	),
+);

package/plugins/interactive-blocks/directive-on/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-on-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-on/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-on-view' );
 ?>
 
 <div data-wp-interactive="directive-on">

package/plugins/interactive-blocks/directive-on/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );

package/plugins/interactive-blocks/directive-on-document/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-on-document-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-on-document/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-on-document-view' );
 ?>
 
 <div data-wp-interactive="directive-on-document">

package/plugins/interactive-blocks/directive-on-document/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );

package/plugins/interactive-blocks/directive-on-window/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-on-window-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-on-window/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-on-window-view' );
 ?>
 
 <div data-wp-interactive="directive-on-window">

package/plugins/interactive-blocks/directive-on-window/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );

package/plugins/interactive-blocks/directive-priorities/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-priorities-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-priorities/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-priorities-view' );
 ?>
 
 <div data-wp-interactive="directive-priorities">

package/plugins/interactive-blocks/directive-priorities/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );

package/plugins/interactive-blocks/directive-run/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-run-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-run/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-run-view' );
 ?>
 
 <div

package/plugins/interactive-blocks/directive-run/view.asset.php

@@ -0,0 +1,9 @@
+<?php return array(
+	'dependencies' => array(
+		'@wordpress/interactivity',
+		array(
+			'id'     => '@wordpress/interactivity-router',
+			'import' => 'dynamic',
+		),
+	),
+);

package/plugins/interactive-blocks/directive-style/block.json

@@ -10,6 +10,6 @@
 		"interactivity": true
 	},
 	"textdomain": "e2e-interactivity",
-	"viewScript": "directive-style-view",
+	"viewScriptModule": "file:./view.js",
 	"render": "file:./render.php"
 }

package/plugins/interactive-blocks/directive-style/render.php

@@ -4,8 +4,6 @@
  *
  * @package gutenberg-test-interactive-blocks
  */
-
-wp_enqueue_script_module( 'directive-style-view' );
 ?>
 
 <div data-wp-interactive="directive-style">

package/plugins/interactive-blocks/directive-style/view.asset.php

@@ -0,0 +1 @@
+<?php return array( 'dependencies' => array( '@wordpress/interactivity' ) );