Clarity: [datagrid][V3] when Angular "ivy" is disabled, sorting make elements disapear

[ymanvieu]

Describe the bug

On Angular 9 withe Ivy disabled, trying to sort twice the same column make disapear all elements of the datagrid.

With fewer elements in the datagrid, the bug doesn't seem to appear.

How to reproduce

https://stackblitz.com/edit/angular-ivy-d5sdvj

Steps to reproduce the behavior:

1. sort twice any column except the first one

Expected behavior

elements must be sorted correctly

Versions

App

• Angular: 9.0/9.1
• Clarity: 3.0/3.1

Device:

• OS: Win10 pro 64
• Browser : firefox/chrome
• Version 77/83

Additional notes

works fine if Ivy is enabled or using Clarity 2 without Ivy

[gnomeontherun]

Hi @ymanvieu, what is your requirement to have Ivy disabled? There were some changes we had to make to the Datagrid so that it worked correctly with Ivy, and now I'm not sure we can support both. @Shijir

[ymanvieu]

hello @gnomeontherun
In our company project, which use clarity, we have dependencies not compatible with Ivy. we have successfully upgraded to angular 9, but activating Ivy breaks compilation.

We use extensively Clarity and other than this bug, everything else works as expected even without Ivy.

[shravansofts]

Our project also have dependencies to run without IVY.
Moreover IVY is customer choice to use or not. We expect clarity to work irrespective of IVY setting.

[znpopov]

Our project also has some dependencies that require to have Ivy disabled.
We are also reproducing the issue easily on data-grids with pagination, although I am not sure if this is directly related to the pagination.
Can this be further investigated? Thanks!

[ymanvieu]

@znpopov indeed, it's the pagination that is breaking the sorting.
use my stackblitz and remove the clr-dg-pagination tag, and you can see that sorting works again.

[juanmendes]

The team at VCD also relies on third party products that don't yet have support for Ivy.

[gnomeontherun]

I understand that turning Ivy off might be desirable for various reasons, but we need help to triage and isolate these issues. Any support is welcome to triage the issue. It's not the default in Angular to do turn off Ivy now, so we aren't actively testing with Ivy off.

[ryan-bradford]

At VCD we are also noticing this issue. It initially popped up when testing the filtering of server driven grids with Clarity 3. Here is a simple Stackblitz that shows when the data changes around a few times the grid will become hidden. https://stackblitz.com/edit/clarity-v3-light-theme-vu68ai. Our fix for this issue was to use a grid internal and run this.grid["organizer"].resize();. We also noticed that turning off trackBy in our app fixes the issue.

[Jinnie]

Fixed with https://github.com/vmware/clarity/pull/5117 (and related backports)

[github-actions[bot]]

Hi there 👋, this is an automated message. To help Clarity keep track of discussions, we automatically lock closed issues after 14 days. Please look for another open issue or open a new issue with updated details and reference this one as necessary.