Treatment of html in version 9

[drmrbrewer]

Hit Run repeatedly with the following jsfiddle:

http://jsfiddle.net/ohmkqzub/

This is meant to simulate that the title is made up of individual components, each of which is subject to different formatting based on user settings, and the word separator is also a user option... and a valid and common choice is just a space character ( ).

Now try it with highcharts version 9:

http://jsfiddle.net/tna93r6x/

Why does the space character get wiped out? Anything to do with the new filtering feature?

[KacperMadej]

Every whitespace text is filtered (maybe @TorsteinHonsi might be able to provide more info about this?):

highcharts/ts/Core/Renderer/HTML/AST.ts

Lines 469 to 472 in 3e09d20

	// Whitespace text node, don't append it to the AST
	if (/^[\s]*$/.test(textContent)) {
	return;
	}

Workaround: use a blank Braille block (source)
Demo: http://jsfiddle.net/BlackLabel/jt8fL1zq/

@drmrbrewer If you need to disable this AST feature for further testing - the ugly hack continues in the top JS code lines: http://jsfiddle.net/BlackLabel/jt8fL1zq/1/

[drmrbrewer]

@KacperMadej thanks... I think the only viable workaround is to disable AST... as mentioned in the other issue I can't really see the value of AST in the first place, particularly if it can so easily just be disabled via a hack!

EDIT in retrospect the replacement of each normal space should be separator.replace(/ /g, '\u2008') not separator.replace(/ /g, '\u0020') since multiple \u0020 chars seem to be treated as just a single white space.

HC 8: http://jsfiddle.net/es54m2jf/ (working)
HC 9: http://jsfiddle.net/wfsjLpkq/ (broken)
HC 9: http://jsfiddle.net/k3hgmauq/ (working with hack to disable AST)

[TorsteinHonsi]

I acknowledge this as a bug.

Minimal demo

https://jsfiddle.net/highcharts/gj9uv7wz/

I can't really see the value of AST in the first place, particularly if it can so easily just be disabled via a hack!

@drmrbrewer Our aim with the AST and allow-lists is to stop XSS coming in from string configuration in chart options. When you have full access to scripting in the page, you can insert anything you'd like into the DOM, with or without Highcharts.

[TorsteinHonsi]

I think the whitespace filtering is an attempt to port this check from v8:

highcharts/ts/Core/Renderer/SVG/SVGRenderer.ts

Lines 1291 to 1293 in 4f52c15

	// Trim to prevent useless/costly process on the spaces
	// (#5258)
	.replace(/^\s+|\s+$/g, '')

But whitespace in between elements have a meaning in HTML and SVG, so we need to preserve it for cases like this. Perhaps what we need to do instead is to just trim the HTML before parsing. Then the unit and visual tests will reveal unwanted side effects.