From dad7083bc8b85d03955be237e21d7c619117692d Mon Sep 17 00:00:00 2001 From: Felix Arntz Date: Thu, 2 Jan 2025 14:58:20 -0800 Subject: [PATCH] Proxy event object when withSyncEvent() is not used. --- packages/interactivity/src/directives.tsx | 37 +++++++++++++++++++++-- 1 file changed, 35 insertions(+), 2 deletions(-) diff --git a/packages/interactivity/src/directives.tsx b/packages/interactivity/src/directives.tsx index ecac89a32be2e1..e2fea91a0c4d38 100644 --- a/packages/interactivity/src/directives.tsx +++ b/packages/interactivity/src/directives.tsx @@ -50,6 +50,39 @@ function deepClone< T >( source: T ): T { return source; } +function wrapEventAsync( event: Event ) { + const handler = { + get( target: any, prop: any, receiver: any ) { + const value = target[ prop ]; + switch ( prop ) { + case 'currentTarget': + warn( + `Accessing the synchronous event.${ prop } property in a store action without wrapping it in withSyncEvent() is deprecated and will stop working in WordPress 6.9. Please wrap the store action in withSyncEvent().` + ); + break; + case 'preventDefault': + case 'stopImmediatePropagation': + case 'stopPropagation': + warn( + `Using the synchronous event.${ prop }() function in a store action without wrapping it in withSyncEvent() is deprecated and will stop working in WordPress 6.9. Please wrap the store action in withSyncEvent().` + ); + break; + } + if ( value instanceof Function ) { + return function ( this: any, ...args: any[] ) { + return value.apply( + this === receiver ? target : this, + args + ); + }; + } + return value; + }, + }; + + return new Proxy( event, handler ); +} + const newRule = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g; const ruleClean = /\/\*[^]*?\*\/| +/g; @@ -105,7 +138,7 @@ const getGlobalEventDirective = ( const cb = ( event: Event ) => { const resolved = resolveEntry( entry ); if ( ! resolved.value?.sync ) { - // TODO: Wrap event in proxy. + event = wrapEventAsync( event ); } evaluateResolved( resolved, event ); }; @@ -296,7 +329,7 @@ export default () => { } const resolved = resolveEntry( entry ); if ( ! resolved.value?.sync ) { - // TODO: Wrap event in proxy. + event = wrapEventAsync( event ); } evaluateResolved( resolved, event ); if ( globalThis.IS_GUTENBERG_PLUGIN ) {