Defining interactivity API context with single quotes fail

[Fab1en]

In ​the documentation, we can read an example using double quotes to define interactivity API context :

<li data-wp-context='{ "isMenuOpen": false }'>

However, the following HTML code is also valid (using single quotes instead of doubles inside the object):

<li data-wp-context="{ 'isMenuOpen': false }">

But it silently fails to properly define the context. I understand that single quotes are not valid in JSON, but I think that it should raise an error.

I think it should also be mentioned more explicitly in ​the documentation : to define a context with double quotes inside, one should surround it with single quotes, whereas all other HTML attributes definitions are surrounded by double quotes.

[jonsurrell]

Ideally, folks rely on the ​wp_interactivity_data_wp_context() function for this. It outputs the HTML attribute ready to be printed to the page. There's no need to write or encode the data on your own.

​It's mentioned in the linked documentation, but it would be good to update more examples to use it.

If no errors or warnings are printed when the directive is invalid JSON, or is not an object which I believe is a requirement, then it could certainly help to display some errors in debug environements.

[luisherranz]

Thanks for reporting this, @Fab1en. PRs to solve the two shortcomings (improved documentation and warning in debug environments) are certainly welcome 🙂