UI grid expandable rows not working as expected on latest chrome version

[siraajahmed]

Hi

We are on the latest version of UI grid.

We have a problem with the expandable/collapseable grid rows ever since we upgraded to the latest chrome version (77.0.3865.90) - on version 76 we do not get any issues.

The Issue: When you expand or collapse the rows, ui grid doesn't seem to complete the process. it either leaves a big white space between rows (when you collapse) or as seen in the screenshot the expanded row data overlaps other rows (look at the last row in the picture, the columns reference, type, status, last user, last activity date should not be there, the expanded row should have pushed the row down)

Now when you resize the page or open/close dev tools, UI grid seems to "wake up" and everything snaps back in place... until you do another action.

Also have noticed hovering over a tooltip can also cause UI grid to "wake up" but this never fixes the issue. This could be a bug with digest and UI grid maybe.

Any advice or fixes for this would be greatly appreciated.

Thanks

[amitjain24524]

After the update, google chrome (ver:77) from (ver:76) expanded row not working as expected. Before update google chrome expanded row of 'angular-UI-grid' was working properly, However, It's working fine in other browsers like Mozilla Firefox and Microsoft Edge and also working in older Version(76.0.3809.132) of chrome.

Before Update

After Update

[amitjain24524]

Have you raise an issue to Google. I think it's occurring because new Native lazy loading added in new update.

[siraajahmed]

@amitjain24524 Yeah I have raised an issue to Google too. Hopefully this gets resolved ASAP now

[amitjain24524]

I think if add

.ui-grid-row{
clear:both;
height:0;
}

in css fixed the issue
it works for me

[siraajahmed]

@amitjain24524 nice find! that works for me too. Although I still get a little flicker. Thanks so much

[amitjain24524]

@siraajahmed Use some animation for fixing flicker issue like
animation: fadeIn 1s ease-in 0.1s forwards;

[siraajahmed]

@amitjain24524 thanks bro. Do you know why "clear: both" fixes the issue? I can't tell what is being floated that would need the clear.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale]

This issue has been automatically closed because it has not had recent activity. If you believe that this is still an issue in the latest version, feel free to re-open it. Thank you for your contributions.