Page 1 of 1
[Salesforce] Grid: FA icons occasionally fail to render when row grouping is enabled
Posted: Tue Aug 16, 2022 11:21 pm
by mkelch
We are developing an LWC that uses the Grid library. We have noticed that when row grouping is enabled, there's a chance for Font Awesome icons within the table to disappear when quickly scrolling away from and back to a row. When the row grouping feature is disabled the issue is not reproducible.
Attached is a video demo of this happening in our Salesforce org.
I've also attached the full JS file for our LWC. Below are some snippets from the JS showing the grid and column config:
this.grid = new bryntum.grid.Grid({
appendTo: this.template.querySelector("div.grid-container"),
columns: this.columns,
store: this.rowDataStore,
features: {
group: {
field: "target",
renderer: ({ groupRowFor, isFirstColumn }) => {
if (!isFirstColumn) {
return "";
}
return groupRowFor ? "Targets" : "Non-Targets";
},
},
},
});
this.columns = [
{
id: "target",
field: "target",
icon: "b-fa b-fa-bullseye",
width: 70,
locked: true,
align: "center",
resizable: false,
renderer: ({ value }) =>
value ? { tag: "i", class: "b-fa b-fa-bullseye target-icon" } : "",
},
];
Thanks in advance for your feedback!
Re: [Salesforce] Grid: FA icons occasionally fail to render when row grouping is enabled
Posted: Thu Aug 18, 2022 11:47 am
by Maxim Gorkovsky
Hello.
Which grid version do you use?
Re: [Salesforce] Grid: FA icons occasionally fail to render when row grouping is enabled
Posted: Thu Aug 18, 2022 3:35 pm
by mkelch
Hello, we are currently on version 5.1.0 of the LWC module.
Re: [Salesforce] Grid: FA icons occasionally fail to render when row grouping is enabled
Posted: Thu Aug 18, 2022 4:04 pm
by Maxim Gorkovsky
Version 5.1.0 has a serious bug: https://github.com/bryntum/support/issues/4979 Can you try upgrading to 5.1.1 release?
Re: [Salesforce] Grid: FA icons occasionally fail to render when row grouping is enabled
Posted: Thu Aug 18, 2022 4:45 pm
by mkelch
Thanks for the feedback. However, I was able to reproduce the issue with the 5.1.1 release.
Re: [Salesforce] Grid: FA icons occasionally fail to render when row grouping is enabled
Posted: Mon Aug 22, 2022 8:47 am
by Maxim Gorkovsky
Reproduced, ticket opened here: https://github.com/bryntum/support/issues/5094 Thank you for report.
There is a workaround you can apply to fix this problem on the app level - you need to always return Object from the renderer:
renderer : ({ value }) => (value ? { tag : 'i', class : 'b-fa b-fa-bullseye target-icon' } : { html : '' })
Re: [Salesforce] Grid: FA icons occasionally fail to render when row grouping is enabled
Posted: Mon Aug 22, 2022 3:15 pm
by mkelch
Excellent, thank you for the workaround!