Interactivity API: fix property modification backport to 6.7.2

packages/block-library/src/navigation/index.php

@@ -813,7 +813,7 @@ function block_core_navigation_add_directives_to_submenu( $tags, $block_attribut
 	) ) {
 		// Add directives to the parent `<li>`.
 		$tags->set_attribute( 'data-wp-interactive', 'core/navigation' );
-		$tags->set_attribute( 'data-wp-context', '{ "submenuOpenedBy": { "click": false, "hover": false, "focus": false }, "type": "submenu" }' );
+		$tags->set_attribute( 'data-wp-context', '{ "submenuOpenedBy": { "click": false, "hover": false, "focus": false }, "type": "submenu", "modal": null }' );
 		$tags->set_attribute( 'data-wp-watch', 'callbacks.initMenu' );
 		$tags->set_attribute( 'data-wp-on--focusout', 'actions.handleMenuFocusout' );
 		$tags->set_attribute( 'data-wp-on--keydown', 'actions.handleMenuKeydown' );

packages/interactivity/CHANGELOG.md

@@ -4,6 +4,12 @@
 
 ### Bug Fixes
 
+-   Fix property modification from inherited context two or more levels above ([#66872](https://github.com/WordPress/gutenberg/pull/66872)).
+
+## 6.11.0 (2024-10-30)
+
+### Bug Fixes
+
 -   Fix reactivity of undefined objects and arrays added with `deepMerge()` ([#66183](https://github.com/WordPress/gutenberg/pull/66183)).
 
 ## 6.10.0 (2024-10-16)

packages/interactivity/src/proxies/context.ts

@@ -38,6 +38,9 @@ const contextHandlers: ProxyHandler< object > = {
 	getOwnPropertyDescriptor: ( target, key ) =>
 		descriptor( target, key ) ||
 		descriptor( contextObjectToFallback.get( target ), key ),
+	has: ( target, key ) =>
+		Reflect.has( target, key ) ||
+		Reflect.has( contextObjectToFallback.get( target ), key ),
 };
 
 /**

packages/interactivity/src/proxies/test/context-proxy.ts

@@ -137,6 +137,24 @@ describe( 'Interactivity API', () => {
 				expect( context.a ).toBe( 2 );
 				expect( state.a ).toBe( 2 );
 			} );
+
+			it( "should modify props inherited from fallback's ancestors", () => {
+				const ancestor: any = proxifyContext(
+					{ ancestorProp: 'ancestor' },
+					{}
+				);
+				const fallback: any = proxifyContext(
+					{ fallbackProp: 'fallback' },
+					ancestor
+				);
+				const context: any = proxifyContext( {}, fallback );
+
+				context.ancestorProp = 'modified';
+
+				expect( context.ancestorProp ).toBe( 'modified' );
+				expect( fallback.ancestorProp ).toBe( 'modified' );
+				expect( ancestor.ancestorProp ).toBe( 'modified' );
+			} );
 		} );
 
 		describe( 'computations', () => {