diff --git a/packages/e2e-tests/plugins/interactive-blocks/directive-bind/render.php b/packages/e2e-tests/plugins/interactive-blocks/directive-bind/render.php index 20f9313588046..c629e098b6e78 100644 --- a/packages/e2e-tests/plugins/interactive-blocks/directive-bind/render.php +++ b/packages/e2e-tests/plugins/interactive-blocks/directive-bind/render.php @@ -93,6 +93,7 @@ diff --git a/packages/e2e-tests/plugins/interactive-blocks/directive-bind/view.js b/packages/e2e-tests/plugins/interactive-blocks/directive-bind/view.js index 0d93e93ba1450..47d1262f37ed2 100644 --- a/packages/e2e-tests/plugins/interactive-blocks/directive-bind/view.js +++ b/packages/e2e-tests/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; }, }, } ); diff --git a/test/e2e/specs/interactivity/directive-bind.spec.ts b/test/e2e/specs/interactivity/directive-bind.spec.ts index 525fceab5ca6a..11902018e0753 100644 --- a/test/e2e/specs/interactivity/directive-bind.spec.ts +++ b/test/e2e/specs/interactivity/directive-bind.spec.ts @@ -210,6 +210,12 @@ test.describe( 'data-wp-bind', () => { const el = container.getByTestId( testid ); const toggle = container.getByTestId( 'toggle value' ); + // Ensure hydration has happened. + const checkbox = page.getByTestId( + 'add missing checked at hydration' + ); + await expect( checkbox ).toBeChecked(); + const hydratedAttr = await el.getAttribute( name ); const hydratedProp = await el.evaluate( ( node, propName ) => ( node as any )[ propName ], @@ -236,7 +242,13 @@ test.describe( 'data-wp-bind', () => { return; } - await toggle.click( { clickCount: 2, delay: 50 } ); + await toggle.click( { clickCount: 2 } ); + + // Ensure values have been updated after toggling. + await expect( toggle ).toHaveAttribute( + 'data-toggle-count', + '2' + ); // Values should be the same as before. const renderedAttr = await el.getAttribute( name );