Fix disappearing legend entries

[fredrikw]

This should be a fix to #4986 with an added mock to show the problem. Basically, there was a mismatch between when calculating whether a legend fits in one row and when calculating whether to add a new row, leading to a "itemGap" width difference in the row lengths. This PR addresses this by changing the calculation of row breaks.

[fredrikw]

The test-image failure I believe is due to that I opted to change the calculation when breaking rows instead of when calculating if the legend is "one row only". I actually think it looks better with my changes, but I can switch if you would like me to. That way I think the test error would go away. (I'll address the missing line at the same time)

[archmoj]

@fredrikw Could you pick the commit which adds the baseline for your new mock?
51265e5

And here is more info on how to generate new baselines: https://github.com/plotly/plotly.js/blob/master/test/image/README.md

[archmoj]

The test-image failure I believe is due to that I opted to change the calculation when breaking rows instead of when calculating if the legend is "one row only". I actually think it looks better with my changes, but I can switch if you would like me to. That way I think the test error would go away.

I also like this new baseline:

Please also commit the changes to this baseline so that the test image could pass.

[archmoj]

Thanks very much for the PR.
💃