Quick Edit and other JS broken on .org

[tobifjellner]

While handling pending posts on make.wordpress.org/polyglots/ I MUST use the "Quick Edit" functionality in order to change particular post settings directly in the post list. (If I try to change these things in the "normal editor", the Author field will break.)

But today the Quick Edit doesn't work on make/polyglots, nor on sv.wordpress.org, so it seems to be (more or less) happening in all our Meta environment.
Whether or not it's something in 6.0 Alpha of core or something specific for "meta" - that I don't know. But I need it to handle some pending posts.

This worked for sure two days ago.

[coffee2code]

This is related to ​https://core.trac.wordpress.org/changeset/52937 (for ​#core55250).

Console error says:

Uncaught ReferenceError: wp is not defined            load-scripts.php:12:62

This affects 'Quick Edit' for standard posts on most of the Make sites (e.g. make/photos, make/openverse, make/polyglots, make/design, make/marketing, etc) but NOT make/core or make/meta.

This also affects all the Directories (Photo, Plugin, Theme, Pattern). Loading the admin dashboard for each yields errors:

Uncaught ReferenceError: wp is not defined
Uncaught TypeError: window.wp.deprecateL10nObject is not a function
Uncaught TypeError: _ is undefined
Uncaught TypeError: b is undefined
Uncaught ReferenceError: Backbone is not defined
Uncaught TypeError: _ is undefined
Uncaught ReferenceError: ClipboardJS is not defined
Uncaught TypeError: wp.ajax is undefined

In such cases, any functionality relying on the JS wp is broken.

[Ipstenu]

Well that explains why the backend notes of plugins suddenly stopped working :(

[ocean90]

This is actually caused by ​Gutenberg overriding scripts and dependencies and only happens if SCRIPT_DEBUG is false. For some reasons that override is causing the common script to be loaded via load-scripts.php and thus before wp-i18n.

[dd32]

For some reasons that override is causing the common script to be loaded via load-scripts.php and thus before wp-i18n.

It appears that common is loaded via load-scripts.php regardless, just that without Gutenberg common is loaded twice..

Regardless, WordPress.org is now pinned to ​[build52525].

[ocean90]

Replying to dd32:

It appears that common is loaded via load-scripts.php regardless, just that without Gutenberg common is loaded twice..

Huh, I'm not seeing that on test.wordpress.org/wp-admin.

This is causing the JS errors:

<script type='text/javascript'>
/* <![CDATA[ */
var _wpUtilSettings = {"ajax":{"url":"\/wp-admin\/admin-ajax.php"}};var wpApiSettings = {"root":"https:\/\/test.wordpress.org\/wp-json\/","nonce":"0b7aa65013","versionString":"wp\/v2\/"};/* ]]> */
</script>
<script type='text/javascript' src='https://test.wordpress.org/wp-admin/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=hoverIntent,regenerator-runtime,wp-polyfill,common,hoverintent-js,admin-bar,clipboard,underscore,wp-util,wp-api-request&amp;ver=6.0-alpha-52937'></script>
<script src='https://test.wordpress.org/wp-content/plugins/gutenberg/build/hooks/index.min.js?ver=cf663486a38abeb9211b951c31c45f52' id='wp-hooks-js'></script>
<script src='https://test.wordpress.org/wp-content/plugins/gutenberg/build/i18n/index.min.js?ver=48225910192aa129f266fcda8da5fa7a' id='wp-i18n-js'></script>
<script id='wp-i18n-js-after'>
wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } );
</script>
<script src='https://test.wordpress.org/wp-content/plugins/gutenberg/build/dom-ready/index.min.js?ver=ea6a91f02ba567427b25595ee72ecaff' id='wp-dom-ready-js'></script>

With ​this line in Gutenberg commented out and no JS errors:

<script type='text/javascript' src='https://test.wordpress.org/wp-admin/load-scripts.php?c=0&amp;load%5Bchunk_0%5D=hoverIntent,regenerator-runtime,wp-polyfill,wp-hooks&amp;ver=6.0-alpha-52937'></script>
<script src='https://test.wordpress.org/wp-includes/js/dist/i18n.min.js?ver=30fcecb428a0e8383d3776bcdd3a7834' id='wp-i18n-js'></script>
<script id='wp-i18n-js-after'>
wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } );
</script>
<script src='https://test.wordpress.org/wp-admin/js/common.min.js?ver=6.0-alpha-52937' id='common-js'></script>
<script src='https://test.wordpress.org/wp-includes/js/hoverintent-js.min.js?ver=2.2.1' id='hoverintent-js-js'></script>
<script src='https://test.wordpress.org/wp-includes/js/admin-bar.min.js?ver=6.0-alpha-52937' id='admin-bar-js'></script>
<script src='https://test.wordpress.org/wp-includes/js/clipboard.min.js?ver=6.0-alpha-52937' id='clipboard-js'></script>
<script src='https://test.wordpress.org/wp-includes/js/underscore.min.js?ver=1.13.1' id='underscore-js'></script>
<script id='wp-util-js-extra'>
var _wpUtilSettings = {"ajax":{"url":"\/wp-admin\/admin-ajax.php"}};
</script>

[youknowriad]

Ok, so here’s what I found so far:

In Core, there’s this function call ​https://github.com/WordPress/wordpress-develop/blob/c7e067c578362fd67580ef1ef230856e57171329/src/wp-includes/script-loader.php#L260 I think the intent of the 1 (last argument) is to register the script in the footer like Gutenberg, but the reality is that it’s misused, this 1 argument at the end doesn’t do anything IMO (the last argument is supposed to be an array).

In Gutenberg we correctly set the scripts to load in the footer. Meaning in core scripts are in the header, in Gutenberg they are in the footer causing the issue. I’m not sure yet how it’s related to the commit about empty translations but it’s this difference in script registration that triggers the error.

A simple fix could be to just load the scripts in the header in Gutenberg (like core) but that won’t solve the root of the issue. Ideally I guess core should load the scripts in the footer, but I suspect that if we do this change in Core, we’d break the translations similar to when using the gutenberg plugin.

[ocean90]

@youknowriad The 1 argument is ​a special case handled by WP_Scripts. The scripts should be correctly registered for in the footer.

I’m not sure yet how it’s related to the commit about empty translations

Scripts which have inline scripts assigned won't get concatenated via load-scripts.php thus we ended with something like this:

<script id='common-js-translations'>
( function( domain, translations ) {
	var localeData = translations.locale_data[ domain ] || translations.locale_data.messages;
	localeData[""].domain = domain;
	wp.i18n.setLocaleData( localeData, domain );
} )( "default", { "locale_data": { "messages": { "": {} } } } );
</script>
<script src='http://localhost:8889/wp-admin/js/common.min.js?ver=6.0-alpha-52448-src' id='common-js'></script>

[youknowriad]

If I remove this part in Gutenberg, it behaves like core again ​https://github.com/WordPress/gutenberg/blob/19d45c3be883dad10cea50a76becc1191edf9112/lib/client-assets.php#L78-L82

So that's why I thought it was related to in_footer.

[ocean90]

Removing this part switches the scripts to be registered for the head which basically moves wp-i18n to the top and so before common which is still in the footer. I have simplified this in ​https://github.com/WordPress/gutenberg/pull/39497 a bit.

[dd32]

This was fixed upstream.