Javascript error thrown from uiComponent 'notification_area' if messages are malformed

[sylvainraye]

A javascript error is thrown from the uiComponent notification_area in Magento backend when the parameter $content of the class \Magento\Ui\TemplateEngine\Xhtml\Result::wrapContent is empty or false. As the parameter is provided, no PHP error is thrown and the parameter doesn't have a strict type like string.
The javascript error blocks all others frontend behavior.

The \Magento\Ui\TemplateEngine\Xhtml\Result::wrapContent method return a requireJs dependency but cause of the empty/false value, javascript throw this error:

Uncaught SyntaxError: Unexpected token } in JSON at position 33
    at JSON.parse (<anonymous>)
    at getNodeData (scripts.js:87)
    at Array.map (<anonymous>)
    at scripts.js:117

The position 33 is the following javascript piece of code returned by the method \Magento\Ui\TemplateEngine\Xhtml\Result::wrapContent

{"*": {"Magento_Ui/js/core/app": }}

Preconditions

1. Magento 2.2.3
2. PHP 7.1
3. MariaDB 15.1
4. MAMPro with Apache 2.4
5. A notification message providing a potential json_encode error

Steps to reproduce

1. Have a notification providing a json_encode error as this one will return false if not successful:
   We discovered a third party module from Wyomind providing this issue because the notification message has the following content (see attachment) with a malformed UTF8 and

[notification_area_data_source] => Array
(
	[type] => dataSource
	[name] => notification_area_data_source
	[dataScope] => notification_area
	[config] => Array
		(
			[data] => Array
				(
					[totalRecords] => 3
					[items] => Array
						(
							[0] => Array
								(
									[identity] => 474f763ee31e264fe88a0b2acedb275d
									[severity] => 1
									[created_at] => 2018-04-20 18:13:56
									[text] => One or more of the Cache Types are invalidated: Blocks HTML output, Collections Data.  Please go to <a href="http://domain.test/admin/admin/cache/index/key/b4b91dcc283814b9c86c4e7bdb5974e6ff54c94e725fe0b936344f634e294f4d/">Cache Management</a> and refresh cache types.
								)

							[1] => Array
								(
									[identity] => cf26fc7b5a6e6f0ad76fc5826c76deef
									[severity] => 1
									[created_at] => 2018-04-20 12:33:11
									[text] => <div style='padding-bottom:5px;'><b> Wyomind Data Feed Manager</b> <br> Your license is not yet activated.<br><a target='_blank' href='https://www.wyomind.com/license_activation/?licensemanager=3.5.0&method=post&rv=11.4.0.2&cv=11.4.0.2&namespace=datafeedmanager&activation_key=�'���l`N�G��+�2�������a��R�س�&domain=https://domain.test/&magento=2.2.3'>Activate it now !</a></div>
								)

							[2] => Array
								(
									[identity] => da332d712f3215b9b94bfa268c398323
									[severity] => 2
									[created_at] => 2018-04-20 12:30:52
									[text] => Magento\Framework\Phrase Object
										(
											[text:Magento\Framework\Phrase:private] => One or more <a href="%1">indexers are invalid</a>. Make sure your <a href="%2" target="_blank">Magento cron job</a> is running.
											[arguments:Magento\Framework\Phrase:private] => Array
												(
													[0] => http://domain.test/admin/indexer/indexer/list/key/f5b0ff91d68e33fa09e9173fefb2718926d23f12df3e5025079da3aff57824db/
													[1] => http://devdocs.magento.com/guides/v2.0/config-guide/cli/config-cli-subcommands-cron.html#config-cli-cron-bkg
												)

										)

								)

						)

				)

			[update_url] => http://domain.test/admin/mui/index/render/key/031c5f717bde8027453f0ab6d9c0ba30e1d7cbadce8561efe538f9e86e1dcb6d/
			[component] => Magento_Ui/js/grid/provider
			[storageConfig] => Array
				(
					[indexField] => identity
				)

			[aclResource] => Magento_AdminNotification::show_list
			[params] => Array
				(
					[namespace] => notification_area
				)

		)

)

)

Expected result

1. No javascript error thrown thanks to a try/catch and log the issue
2. A way to catch json_encode error and provide the issue in console.log

Actual result

Uncaught SyntaxError: Unexpected token } in JSON at position 33
    at JSON.parse (<anonymous>)
    at getNodeData (scripts.js:87)
    at Array.map (<anonymous>)
    at scripts.js:117

Js position 33 is:
{"*": {"Magento_Ui/js/core/app": }}

There is json_encode function called at \Magento\Ui\TemplateEngine\Xhtml\Result::appendLayoutConfiguration to encode the configuration in json, however in some cases it can return false if any issue happens. The function json_last_error_msg() permits to determine what was the last error returned. In my case, it was a Malformed UTF-8 characters, possibly incorrectly encoded issue

Solution:

One of the solution is of course making sure that no error can happen in json_encode, however a platform like Magento support third parties extension and those may provide issue, it's important to reduce the fields of blocking issue. So, in the case of the notification_area, it's better to totally not display the notifications but inform at least the user that there is a blocking issue by displaying an error message in the notification area then they should contact the admin instead of blocking completely the backend cause of this javascript error.

As workaround, we did temporary the following into the method \Magento\Ui\TemplateEngine\Xhtml\Result::wrapContent

    protected function wrapContent($content)
    {
        if (empty($content)) {
            return '';
        }

        return '<script type="text/x-magento-init"><![CDATA['
        . '{"*": {"Magento_Ui/js/core/app": ' . str_replace(['<![CDATA[', ']]>'], '', $content) . '}}'
        . ']]></script>';
    }

[acampos1916]

I've been experiencing this exact problem this week (M2.2.1). I too am using a Wyomind extension.

Your workaround at least allowed me to use the admin.

[powierski]

Having the same issue, also have the Wyomind extension installed.

Can confirm the above solution/workaround resolves the issue.

[AlekosDordas]

I've been experiencing this exact problem this week (M2.2.1). I too am using a Wyomind extension.

Your workaround at least allowed me to use the admin.

The empty $content return ' ' gave me a warning in the dashboard. I changed it instead to the following, and it didn't give me any kind of warning.

        if (empty($content)) {
            return '<script type="text/x-magento-init"><![CDATA[{}]]></script>';
        }

(P.s i used a Wyomind extension as well)

[magento-engcom-team]

Hi @sdzhepa. Thank you for working on this issue.
Looks like this issue is already verified and confirmed. But if your want to validate it one more time, please, go though the following instruction:

• 1. Add/Edit Component: XXXXX label(s) to the ticket, indicating the components it may be related to.

• 2. Verify that the issue is reproducible on 2.3-develop branch

  Details

  - Add the comment @magento-engcom-team give me 2.3-develop instance to deploy test instance on Magento infrastructure.
  - If the issue is reproducible on 2.3-develop branch, please, add the label Reproduced on 2.3.x.
  - If the issue is not reproducible, add your comment that issue is not reproducible and close the issue and stop verification process here!

• 3. Verify that the issue is reproducible on 2.2-develop branch.

  Details

  - Add the comment @magento-engcom-team give me 2.2-develop instance to deploy test instance on Magento infrastructure.
  - If the issue is reproducible on 2.2-develop branch, please add the label Reproduced on 2.2.x

• 4. If the issue is not relevant or is not reproducible any more, feel free to close it.

[magento-engcom-team]

Hi @quisse. Thank you for working on this issue.
Looks like this issue is already verified and confirmed. But if your want to validate it one more time, please, go though the following instruction:

• 1. Add/Edit Component: XXXXX label(s) to the ticket, indicating the components it may be related to.

• 2. Verify that the issue is reproducible on 2.3-develop branch

  Details

  - Add the comment @magento-engcom-team give me 2.3-develop instance to deploy test instance on Magento infrastructure.
  - If the issue is reproducible on 2.3-develop branch, please, add the label Reproduced on 2.3.x.
  - If the issue is not reproducible, add your comment that issue is not reproducible and close the issue and stop verification process here!

• 3. Verify that the issue is reproducible on 2.2-develop branch.

  Details

  - Add the comment @magento-engcom-team give me 2.2-develop instance to deploy test instance on Magento infrastructure.
  - If the issue is reproducible on 2.2-develop branch, please add the label Reproduced on 2.2.x

• 4. If the issue is not relevant or is not reproducible any more, feel free to close it.

[magento-engcom-team]

Hi @sylvainraye. Thank you for your report.
The issue has been fixed in #20271 by @quisse in 2.2-develop branch
Related commit(s):

• 7e3ea1b3313bc99e0f8c3ee458a96aee4b1bdedc
• f72fb4222a562a162b1ac36e9f79ea721124192a
• dbb905ca08ebd47d3ef9ebfff77424ccf7fecc56
• c3f4d5d32b3d02e0bb090b3c0353c6b03d84a88c
• 31bf4b223e1a49f575b8c17f2adc9d62db482993

The fix will be available with the upcoming 2.2.8 release.