Interactivity API: Improve data-wp-context debugging by validating it as a stringified JSON Object. (#61045)

* Initial commit, add warning in JS

* remove package.json element

* Add changelog

* Use only warn

* Remove enqueue

* revert whitespace

* revert whitespace

* Prevent production constant missing errors

Co-authored-by: cbravobernal <cbravobernal@git.wordpress.org>
Co-authored-by: sirreal <jonsurrell@git.wordpress.org>

Author: cbravobernal

packages/interactivity/CHANGELOG.md

@@ -4,6 +4,10 @@
 
 ## 5.5.0 (2024-04-19)
 
+### Enhancements
+
+-	Improve data-wp-context debugging by validating it as a stringified JSON Object. ([#61045](https://github.com/WordPress/gutenberg/pull/61045))
+
 ### Bug Fixes
 
 -   Hooks useMemo and useCallback should return a value. ([#60474](https://github.com/WordPress/gutenberg/pull/60474))

packages/interactivity/src/directives.js

@@ -241,6 +241,17 @@ export default () => {
 			const contextStack = useMemo( () => {
 				if ( defaultEntry ) {
 					const { namespace, value } = defaultEntry;
+					// Check that the value is a JSON object. Send a console warning if not.
+					if (
+						typeof SCRIPT_DEBUG !== 'undefined' &&
+						SCRIPT_DEBUG === true &&
+						! isPlainObject( value )
+					) {
+						// eslint-disable-next-line no-console
+						console.warn(
+							`The value of data-wp-context in "${ namespace }" store must be a valid stringified JSON object.`
+						);
+					}
 					updateSignals( currentValue.current, {
 						[ namespace ]: deepClone( value ),
 					} );