JavaScript error Cannot read property 'action' of null on chrome

[manikmist09]

I am getting the following console error (chrome v63.0.3239.84) on various admin pages because of that some buttons on those pages do not respond when clicking. I have tested with disabling all the plugins and themes and using default theme but still seeing the same error on WP version 4.9.1

Uncaught TypeError: Cannot read property 'action' of null
    at updates.js?ver=4.9.1:2443
    at dispatch (jquery.js?ver=1.12.4:3)
    at r.handle (jquery.js?ver=1.12.4:3)

[manikmist09]

As the error was occurring because of var message was null and its property was checking. So, I checked if is message null before checking its property.

[dingo_bastard]

Are you sure you don't have Grammarly extension installed in your browser? This sounds a lot like #42815 duplicate to me.

[manikmist09]

@dingo_bastard , yes I do have Grammarly extension installed and disabling that the error does not shows. But if I check whether message itself is null or not before checking its property message.action the error does not show. so the condition will be like null === message || 'undefined' === typeof message.action.

I think that's good to have in that condition so we won't see any errors for the same reason. What do you think?

[dingo_bastard]

I think, like in the ticket I linked that the issue is not in the WordPress but in the Grammarly extension ;)

We could apply a patch that you suggested, but what if something is actually conflicting on Grammarly's end, we wouldn't know it if we silenced the error.

[ediamin]

Hi, I can confirm this is not related to Grammarly extension. I'm using Vue js in one of my plugins and got the same error. Here is my test plugin to reproduce the error: ​https://github.com/ediamin/wp_action_error_reproduce_plugin

The main reason is in update.js we are listening for message event which is produced by window.postMessage(). Now, if any of the enqueued scripts has postMessage('', 'http://yourdomain.com'), then the message will be null and hence, message.action throws Cannot read property 'action' of null error.

By the way, my reproduce plugin will throw the error in some of the admin pages, like plugins.php. But typing postMessage('', 'http://yourdomain.com') will give the error in any of the admin pages.

[afercia]

I have no idea what Grammarly does, and no idea why one would want to use an empty message, but checking for an object existence before checking for its properties seems a common best practice to me.

From the jQuery docs:

Prior to jQuery 1.9, $.parseJSON returned null instead of throwing an error if it was passed an empty string, null, or undefined, even though those are not valid JSON.

In other parts in core where $.parseJSON() is used, I don't see a great consistency but at least in one case there's a check for the object being truthy.

The patch would need a refresh for proper indentation (please use tabs) and to remove a double space.

Proposing for 4.9.2 consideration.

[manikmist09]

Indented using tabs and removed double space

[manikmist09]

Hi @afercia, Thank you for considering the patch for v4.9.2, I have fixed the indentation problem using tabs and removed double space.

[dd32]

Bumping to 4.9.3 due to 4.9.2s release

[SergeyBiryukov]

In 42604:

Upgrade/Install: In postMessage events handler, check for message object existence before checking its action property.

Props manikmist09.
Fixes #43005.

[SergeyBiryukov]

In 42605:

Upgrade/Install: In postMessage events handler, check for message object existence before checking its action property.

Props manikmist09.
Merges [42604] to the 4.9 branch.
Fixes #43005.

[manikmist09]

Thank you. I have reopened the ticket mistakenly.