@wordpress/e2e-tests 7.27.0 → 7.29.0

package/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+## 7.29.0 (2024-05-16)
+
+## 7.28.0 (2024-05-02)
+
 ## 7.27.0 (2024-04-19)
 
 ## 7.26.0 (2024-04-03)

package/mu-plugins/server-timing.php

@@ -0,0 +1,91 @@
+<?php
+
+add_filter(
+	'template_include',
+	static function ( $template ) {
+
+		global $timestart, $wpdb;
+
+		$server_timing_values = array();
+		$template_start       = microtime( true );
+
+		$server_timing_values['wpBeforeTemplate'] = $template_start - $timestart;
+
+		ob_start();
+
+		add_action(
+			'shutdown',
+			static function () use ( $server_timing_values, $template_start, $wpdb ) {
+				$output = ob_get_clean();
+
+				$server_timing_values['wpTemplate'] = microtime( true ) - $template_start;
+
+				$server_timing_values['wpTotal'] = $server_timing_values['wpBeforeTemplate'] + $server_timing_values['wpTemplate'];
+
+				/*
+				 * While values passed via Server-Timing are intended to be durations,
+				 * any numeric value can actually be passed.
+				 * This is a nice little trick as it allows to easily get this information in JS.
+				 */
+				$server_timing_values['wpMemoryUsage'] = memory_get_usage();
+				$server_timing_values['wpDbQueries']   = $wpdb->num_queries;
+
+				$header_values = array();
+				foreach ( $server_timing_values as $slug => $value ) {
+					if ( is_float( $value ) ) {
+						$value = round( $value * 1000.0, 2 );
+					}
+					$header_values[] = sprintf( '%1$s;dur=%2$s', $slug, $value );
+				}
+				header( 'Server-Timing: ' . implode( ', ', $header_values ) );
+
+				echo $output;
+			},
+			PHP_INT_MIN
+		);
+
+		return $template;
+	},
+	PHP_INT_MAX
+);
+
+add_action(
+	'admin_init',
+	static function () {
+		global $timestart, $wpdb;
+
+		ob_start();
+
+		add_action(
+			'shutdown',
+			static function () use ( $wpdb, $timestart ) {
+				$output = ob_get_clean();
+
+				$server_timing_values = array();
+
+				$server_timing_values['wpTotal'] = microtime( true ) - $timestart;
+
+				/*
+				 * While values passed via Server-Timing are intended to be durations,
+				 * any numeric value can actually be passed.
+				 * This is a nice little trick as it allows to easily get this information in JS.
+				 */
+				$server_timing_values['wpMemoryUsage'] = memory_get_usage();
+				$server_timing_values['wpDbQueries']   = $wpdb->num_queries;
+
+				$header_values = array();
+				foreach ( $server_timing_values as $slug => $value ) {
+					if ( is_float( $value ) ) {
+						$value = round( $value * 1000.0, 2 );
+					}
+					$header_values[] = sprintf( '%1$s;dur=%2$s', $slug, $value );
+				}
+				header( 'Server-Timing: ' . implode( ', ', $header_values ) );
+
+				echo $output;
+			},
+			PHP_INT_MIN
+		);
+	},
+	PHP_INT_MAX
+);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/e2e-tests",
-	"version": "7.27.0",
+	"version": "7.29.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.27.0",
-		"@wordpress/interactivity": "^5.5.0",
-		"@wordpress/interactivity-router": "^1.6.0",
-		"@wordpress/jest-console": "^7.27.0",
-		"@wordpress/jest-puppeteer-axe": "^6.27.0",
-		"@wordpress/scripts": "^27.7.0",
-		"@wordpress/url": "^3.57.0",
+		"@wordpress/e2e-test-utils": "^10.29.0",
+		"@wordpress/interactivity": "^5.7.0",
+		"@wordpress/interactivity-router": "^1.8.0",
+		"@wordpress/jest-console": "^7.29.0",
+		"@wordpress/jest-puppeteer-axe": "^6.29.0",
+		"@wordpress/scripts": "^27.9.0",
+		"@wordpress/url": "^3.59.0",
 		"chalk": "^4.0.0",
 		"expect-puppeteer": "^4.4.0",
 		"filenamify": "^4.2.0",
@@ -46,5 +46,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "280403b4c1cf6cc2c55a6c4d56f9ef91145e4191"
+	"gitHead": "42f38f287506a6b3ed8ccba839b18ad066821044"
 }

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

@@ -16,5 +16,5 @@ document.addEventListener( 'DOMContentLoaded', () => {
 				},
 			},
 		} );
-	}, 50 );
+	}, 100 );
 } );

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

@@ -93,6 +93,7 @@
 		<button
 			data-testid="toggle value"
 			data-wp-on--click="actions.toggleValue"
+			data-wp-bind--data-toggle-count="context.count"
 		>Toggle</button>
 	</div>
 	<?php endforeach; ?>

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

@@ -32,6 +32,7 @@ const { state, foo } = store( 'directive-bind', {
 
 			context.previousValue = context.value;
 			context.value = previousValue;
+			context.count = ( context.count ?? 0 ) + 1;
 		},
 	},
 } );

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

@@ -147,9 +147,9 @@ store( 'directive-each', {
 			state
 				.animalBreeds
 				.forEach( ( { name, breeds } ) => {
-					if ( name === 'Dog') breeds.unshift( 'german shepherd' );
-					if ( name === 'Cat') breeds.unshift( 'maine coon' );
-					if ( name === 'Rat') breeds.unshift( 'satin' );
+					if ( name === 'Dog') {breeds.unshift( 'german shepherd' );}
+					if ( name === 'Cat') {breeds.unshift( 'maine coon' );}
+					if ( name === 'Rat') {breeds.unshift( 'satin' );}
 				} );
 		}
 	}

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

@@ -6,7 +6,8 @@
  */
 ?>
 
-<div data-wp-interactive="directive-on">
+<?php // A wrong directive name like "data-wp-on--" should not kill the interactivity. ?>
+<div data-wp-interactive="directive-on" data-wp-on--="">
 	<div>
 		<p data-wp-text="state.counter" data-testid="counter">0</p>
 		<button

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

@@ -24,4 +24,8 @@
 			<p data-wp-text="state.counter" data-testid="counter">0</p>
 		</div>
 	</div>
+	<div data-wp-on-document--keydown="actions.keydownHandler" data-wp-on-document--keydown--second="actions.keydownSecondHandler">
+		<p data-wp-text="state.keydownHandler" data-testid="keydownHandler">no</p>
+		<p data-wp-text="state.keydownSecondHandler" data-testid="keydownSecondHandler">no</p>
+	</div>
 </div>

package/plugins/interactive-blocks/directive-on-document/view.js

@@ -25,6 +25,8 @@ const { state } = store( 'directive-on-document', {
 		counter: 0,
 		isVisible: true,
 		isEventAttached: 'no',
+		keydownHandler: 'no',
+		keydownSecondHandler: 'no',
 	},
 	callbacks: {
 		keydownHandler() {
@@ -39,5 +41,11 @@ const { state } = store( 'directive-on-document', {
 			state.isEventAttached = 'no';
 			state.isVisible = ! state.isVisible;
 		},
+		keydownHandler: () => {
+			state.keydownHandler = 'yes';
+		},
+		keydownSecondHandler: () => {
+			state.keydownSecondHandler = 'yes';
+		}
 	}
 } );

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

@@ -21,4 +21,8 @@
 			<p data-wp-text="state.counter" data-testid="counter">0</p>
 		</div>
 	</div>
+	<div data-wp-on-window--resize="actions.resizeHandler" data-wp-on-window--resize--second="actions.resizeSecondHandler">
+		<p data-wp-text="state.resizeHandler" data-testid="resizeHandler">no</p>
+		<p data-wp-text="state.resizeSecondHandler" data-testid="resizeSecondHandler">no</p>
+	</div>
 </div>

package/plugins/interactive-blocks/directive-on-window/view.js

@@ -25,6 +25,8 @@ const { state } = store( 'directive-on-window', {
 		counter: 0,
 		isVisible: true,
 		isEventAttached: 'no',
+		resizeHandler: 'no',
+		resizeSecondHandler: 'no',
 	},
 	callbacks: {
 		resizeHandler() {
@@ -39,5 +41,11 @@ const { state } = store( 'directive-on-window', {
 			state.isEventAttached = 'no';
 			state.isVisible = ! state.isVisible;
 		},
+		resizeHandler: () => {
+			state.resizeHandler = 'yes';
+		},
+		resizeSecondHandler: () => {
+			state.resizeSecondHandler = 'yes';
+		}
 	}
 } );

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

@@ -24,8 +24,8 @@ const namespace = 'directive-priorities';
  */
 const executionProof = ( n ) => {
 	const el = document.querySelector( '[data-testid="execution order"]' );
-	if ( ! el.textContent ) el.textContent = n;
-	else el.textContent += `, ${ n }`;
+	if ( ! el.textContent ) {el.textContent = n;}
+	else {el.textContent += `, ${ n }`;}
 };
 
 /**

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

@@ -13,7 +13,7 @@ directive(
 	'show-mock',
 	( { directives: { 'show-mock': showMock }, element, evaluate } ) => {
 		const entry = showMock.find( ( { suffix } ) => suffix === 'default' );
-		if ( ! evaluate( entry ) ) return null;
+		if ( ! evaluate( entry ) ) {return null;}
 		return element;
 	}
 );

package/plugins/interactive-blocks/namespace/block.json

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

package/plugins/interactive-blocks/namespace/render.php

@@ -0,0 +1,23 @@
+<?php
+/**
+ * HTML for testing the directive `data-wp-bind`.
+ *
+ * @package gutenberg-test-interactive-blocks
+ */
+?>
+
+<div data-wp-interactive="">
+	<a data-wp-bind--href="state.url" data-testid="empty namespace"></a>
+</div>
+
+<div data-wp-interactive="namespace">
+	<a data-wp-bind--href="state.url" data-testid="correct namespace"></a>
+</div>
+
+<div data-wp-interactive="{}">
+	<a data-wp-bind--href="state.url" data-testid="object namespace"></a>
+</div>
+
+<div data-wp-interactive>
+	<a data-wp-bind--href="other::state.url" data-testid="other namespace"></a>
+</div>

package/plugins/interactive-blocks/namespace/view.asset.php

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

package/plugins/interactive-blocks/namespace/view.js

@@ -0,0 +1,16 @@
+/**
+ * WordPress dependencies
+ */
+import { store } from '@wordpress/interactivity';
+
+store( 'namespace', {
+	state: {
+		url: '/some-url',
+	},
+} );
+
+store( 'other', {
+	state: {
+		url: '/other-store-url',
+	},
+} );

package/plugins/lightbox-allow-editing-false-enabled-false.php

@@ -0,0 +1,26 @@
+<?php
+/**
+ * Plugin Name: Lightbox Allow Editing False Enabled False
+ * Plugin URI: https://github.com/WordPress/gutenberg
+ * Author: Gutenberg Team
+ *
+ * @package gutenberg-lightbox-allow-editing-false-enabled-false
+ */
+
+function filter_theme_json_theme( $theme_json ) {
+	$new_data = array(
+		'version'  => 2,
+		'settings' => array(
+			'blocks' => array(
+				'core/image' => array(
+					'lightbox' => array(
+						'allowEditing' => false,
+						'enabled'      => false,
+					),
+				),
+			),
+		),
+	);
+	return $theme_json->update_with( $new_data );
+}
+add_filter( 'wp_theme_json_data_theme', 'filter_theme_json_theme' );