Charts display differently when viewing live app vs edit mode

Hello, I am trying to figure out why 2 of 5 bar charts are displaying differently in my live app. These bar charts display correctly when I'm editing or while previewing in edit mode for the same inputs.

It seems like the live app is not selecting the x-axis data correctly.

I'm not really sure how to approach debugging this one.

1 Like

Also the live app and the latest working version are the same. I created & published a release, was creating a video demo-ing the app and then realized the charts are incorrect.

1 Like

Weirdly 1 of the 2 charts incorrect is displaying correctly today. One is still wrong. No changes made to the app other than refreshing the page.

1 Like

I tried it again with a tiny dataset (7 days, with 3 stacked bars per day) because I had a suspicion that the bars charts just have too many graphical elements. However nothing changed, they still don't display.

Any other ideas anyone? :pray:

@s_p That is very unusual, I am sorry you are having these issues.

Let me try to trouble shoot what could be going on, I haven't seen a bug like this where the charts component displays so differently between edit and live app.

Are you self hosting or on the cloud? If self hosted, which version? Do you have widget grid enabled? Are charts working in other apps or do all apps in your org have this bug with charts displaying differently?

1 Like

@Jack_T I deleted and recreated the charts entirely and deleted unused keys in the source data. I'm not sure why that fixed it honestly since I've been creating charts the same way for the previous 4 apps (with unused keys too). So I'm also not really sure if this will come back again later.

To answer your questions though:

  • I am running on the cloud.
  • Widget grid is enabled.
  • This is the only app where this occurred and I've created 4 others apps with charts.
1 Like

Very happy to hear you were able to get it resolved!

Sometimes a hard restart is the best course of action :sweat_smile:

I would love to try to triage what had caused this specific data payload to not work. It sounds like you are very experienced and systematic with your chart building.

Equally likely is that there was a minor patch made to the cloud and now it has been fixed :thinking: we had some other issues with users on widget grid but i had not heard of anything chart related so that might be a stretch.

Let me know if this comes back at all! We might need to do some live debugging during office hours in that case but hopefully this issue is in the past now :crossed_fingers:

2 Likes

@Jack_T For reference, the version changed from 3.102.0 to 3.104.0 (from metadata.json) from when I was having the issue to when it was fixed, based on my release history.

The reason I decided to delete and recreate though was because I saw these keys when diffing changes:

isDataTemplateDirty ={true}
isLayoutJsonDirty={true}

Can you perhaps elaborate on what these mean? I don't think it's what I expected, even though I stumbled upon a fix :sweat_smile:

Ahhh ok very interesting, thank you for sharing those details.

Might have been a bug patch between those versions that was causing the problem.

I haven't seen
isDataTemplateDirty ={true} isLayoutJsonDirty={true} before :sweat_smile: I can check with our engineering team to see if they might have more details.

2 Likes

I heard from our engineering team that the Dirty param for the state of chart components might have been created as a way to stop rendering when some dependencies have issues.

This has been engineered out of the new charts component which runs much better, more reliably and is highly recomended.

I am also super curious on exact events would lead to a chart becoming 'dirty' but the engineer who built this out in 2020 might have left the team :sweat_smile:

2 Likes

Thanks for following up @Jack_T

2 Likes