From 733d8a520f3b1418ff6bb62611e5afb1c098af8b Mon Sep 17 00:00:00 2001
From: Carlos Bravo <37012961+c4rl0sbr4v0@users.noreply.github.com>
Date: Tue, 23 Jan 2024 17:44:43 +0100
Subject: [PATCH] Fix flaky test on-window (#58134)

---
 .../directive-on-window/render.php               | 16 ++++++++++++----
 .../directive-on-window/view.js                  | 13 +++++++++----
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/packages/e2e-tests/plugins/interactive-blocks/directive-on-window/render.php b/packages/e2e-tests/plugins/interactive-blocks/directive-on-window/render.php
index e9c8792354e2a5..9c067d33cb34af 100644
--- a/packages/e2e-tests/plugins/interactive-blocks/directive-on-window/render.php
+++ b/packages/e2e-tests/plugins/interactive-blocks/directive-on-window/render.php
@@ -8,10 +8,18 @@
 gutenberg_enqueue_module( 'directive-on-window-view' );
 ?>
 
-<div data-wp-interactive='{ "namespace": "directive-on-window" }' data-wp-context='{"isVisible":true}'>
-	<button data-wp-on--click="actions.visibilityHandler" data-testid="visibility">Switch visibility</button>
-	<div data-wp-show-mock="context.isVisible">
-		<div data-wp-on-window--resize="callbacks.resizeHandler">
+<div data-wp-interactive='{ "namespace": "directive-on-window" }'>
+	<button
+		data-wp-on--click="actions.visibilityHandler"
+		data-testid="visibility">
+		Switch visibility
+	</button>
+	<div data-wp-text="state.isEventAttached" data-testid="isEventAttached">no</div>
+	<div data-wp-show-mock="state.isVisible">
+		<div
+			data-wp-on-window--resize="callbacks.resizeHandler"
+			data-wp-init="callbacks.init"
+		>
 			<p data-wp-text="state.counter" data-testid="counter">0</p>
 		</div>
 	</div>
diff --git a/packages/e2e-tests/plugins/interactive-blocks/directive-on-window/view.js b/packages/e2e-tests/plugins/interactive-blocks/directive-on-window/view.js
index 11d01b7a216d1c..1743311dee6cb9 100644
--- a/packages/e2e-tests/plugins/interactive-blocks/directive-on-window/view.js
+++ b/packages/e2e-tests/plugins/interactive-blocks/directive-on-window/view.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { store, directive, getContext } from '@wordpress/interactivity';
+import { store, directive } from '@wordpress/interactivity';
 
 // Mock `data-wp-show` directive to test when things are removed from the
 // DOM.  Replace with `data-wp-show` when it's ready.
@@ -19,16 +19,21 @@ directive(
 const { state } = store( 'directive-on-window', {
 	state: {
 		counter: 0,
+		isVisible: true,
+		isEventAttached: 'no',
 	},
 	callbacks: {
-		resizeHandler: ( ) => {
+		resizeHandler() {
 			state.counter += 1;
 		},
+		init() {
+			state.isEventAttached = 'yes';
+		}
 	},
 	actions: {
 		visibilityHandler: () => {
-			const context = getContext();
-			context.isVisible = ! context.isVisible;
+			state.isEventAttached = 'no';
+			state.isVisible = ! state.isVisible;
 		},
 	}
 } );