The last data label has a different class format than the others, when useHTML property is set to true

[PaulDalek]

Expected behaviour

All data labels have the same CSS class format:
highcharts-label highcharts-data-label highcharts-data-label-color-# highcharts-tracker

Actual behaviour

The last data label has a different class format than the others:
highcharts-data-labels highcharts-series-0 highcharts-pie-series highcharts-tracker

It seems it happens from v5.0.13

Live demos

http://jsfiddle.net/4f0ocxun/ - v6.0.1, the last label class is different
http://jsfiddle.net/rLqkq0xj/ - v5.0.12, works fine

[TorsteinHonsi]

I can't reproduce this - see http://jsfiddle.net/highcharts/4f0ocxun/1/.

[TorsteinHonsi]

I can't reproduce this - see http://jsfiddle.net/highcharts/4f0ocxun/1/.

[PaulDalek]

Here is an image showing this:

Not sure if this is a bug or if it is intentional though.

[PaulDalek]

Here is an image showing this:

Not sure if this is a bug or if it is intentional though.

[TorsteinHonsi]

It's not intentional - I see it some of the times but not all. And it seems to only appear if I hover close to the chart when it is animating in... Are there any side effects of it that you are aware of?

[TorsteinHonsi]

It's not intentional - I see it some of the times but not all. And it seems to only appear if I hover close to the chart when it is animating in... Are there any side effects of it that you are aware of?

[barryp]

I see this too, with v5.0.12 I'd get a bar chart with labels having this class structure:

<div class="highcharts-data-labels highcharts-series-0 highcharts-bar-series highcharts-color-0 " 
    <div class="highcharts-label highcharts-data-label highcharts-data-label-color-0 highcharts-tracker" 

But after switching to v6.0.3 I see

<div class="highcharts-data-labels highcharts-series-0 highcharts-bar-series highcharts-color-0 " 
    <div class="highcharts-data-labels highcharts-series-0 highcharts-bar-series highcharts-color-0 highcharts-tracker" 

Seems like the inner <div> is now just copying the classes from the outer div, and adding "highcharts-tracker"

[barryp]

I see this too, with v5.0.12 I'd get a bar chart with labels having this class structure:

<div class="highcharts-data-labels highcharts-series-0 highcharts-bar-series highcharts-color-0 " 
    <div class="highcharts-label highcharts-data-label highcharts-data-label-color-0 highcharts-tracker" 

But after switching to v6.0.3 I see

<div class="highcharts-data-labels highcharts-series-0 highcharts-bar-series highcharts-color-0 " 
    <div class="highcharts-data-labels highcharts-series-0 highcharts-bar-series highcharts-color-0 highcharts-tracker" 

Seems like the inner <div> is now just copying the classes from the outer div, and adding "highcharts-tracker"

[barryp]

I made two jsfiddles with simplified versions of what I'm seeing in my site, check the console output to see the difference between the classes applied to the divs.

I also used some CSS to show the ".highcharts-data-label span" in red, which you see in 5.0.12 but not 6.0.3

v5.0.12: https://jsfiddle.net/qgukvxbm/2/
v6.0.3: https://jsfiddle.net/nyymrug4/2/

[barryp]

I made two jsfiddles with simplified versions of what I'm seeing in my site, check the console output to see the difference between the classes applied to the divs.

I also used some CSS to show the ".highcharts-data-label span" in red, which you see in 5.0.12 but not 6.0.3

v5.0.12: https://jsfiddle.net/qgukvxbm/2/
v6.0.3: https://jsfiddle.net/nyymrug4/2/

[KacperMadej]

@barryp Thank you for the demos.

To sum it up: the last dataLabel div has wrong wrong classes - copied from parent. Compare with other dataLabels to confirm or visually - the last label is not red.
Current (6.0.3) - wrong: https://jsfiddle.net/BlackLabel/nyymrug4/3/
Last working (5.0.12): https://jsfiddle.net/BlackLabel/qgukvxbm/3/

Offending commit: 71c360e

[KacperMadej]

@barryp Thank you for the demos.

To sum it up: the last dataLabel div has wrong wrong classes - copied from parent. Compare with other dataLabels to confirm or visually - the last label is not red.
Current (6.0.3) - wrong: https://jsfiddle.net/BlackLabel/nyymrug4/3/
Last working (5.0.12): https://jsfiddle.net/BlackLabel/qgukvxbm/3/

Offending commit: 71c360e