Label state retained with reflow

[JananiGunasekaran]

Bug Report

Description

We are consuming terra-graphs in our application. We see that the label state is getting retained with reflow.

If there is graph which has just one element charted ( which doesn't show ellipsis on the vertical axis label ) on first load and then navigating to a time which has multiple elements with values ( which show ellipsis on the vertical axis label ), the popup on click of the label doesn't work.

Another scenario is - If there is graph which has multiple elements with values ( which show ellipsis on the vertical axis label ) on first load and then navigating to a time which has just one element charted ( which doesn't show ellipsis on the vertical axis label ), the popup on click of the label shows the single label which shouldn't be the case since the label is not truncated.

Both the above behaviours are due to the label state being retained with reflow. Please find below the issue reproducible for both scenarios in the sandbox.

NOTE: Pop up works BY ITSELF when there is data (multiple elements with values) when we load the application on the first time - (without having to navigate to a different time to see the data)

Graphs affected

• Bar graph
• Bubble graph
• Gantt chart
• Line graph
• Paired result
• Pie chart
• Scatter plot
• Timeline

Steps to Reproduce

1. Load a graph which has just one element charted ( which doesn't show ellipsis on the vertical axis label ).
2. Then navigate to a time which has multiple elements with values ( which show ellipsis on the vertical axis label ).
3. The popup on click of the label doesn't work.

Link to CodeSandbox

Scenario 1 to reproduce the behaviour
Scenario 2 to reproduce the behaviour

Additional Context / Screenshots

Expected Behavior

Popup while clicking on label should work when label is truncated. Popup should not display when the label is not truncated.

Possible Solution

Environment

• Component Name and Version: Assessments-graph-js & Advanced-graphing-js
• Browser Name and Version: Google Chrome 92.0.4515.131
• Node/npm Version: [e.g. Node 8/npm 5] Node 10.16.2 / npm 6.14.6
• Webpack Version:
• Operating System and version (desktop or mobile): mac0S

@ Mentions

@AshishMotanamGurunadham

[ryanthemanuel]

@JananiGunasekaran this is being worked on and will be tracked with an internal JIRA. Please reach out for the issue if you want to follow it.