Clarity: Using clDgRowSelection affects cell width in Datagrid

[bniedermeyer]

[x] bug
[ ] feature request
[ ] enhancement

Expected behavior

Using clDgRowSelection should not impact table formatting.

Actual behavior

When adding [clDgRowSelection]="true" to a clr-datagrid component the width of cells are changed and the table content is no longer contained in the width of the grid.

Reproduction of behavior

The stackblitz templates are not loading for me - I've uploaded a working repro here

Environment details

• Angular version: 6.1.0

• Clarity version: 0.12.7

• OS and version: Windows 10

• Browser: [Chrome 68 | Firefox 61 | Edge 40]

[hippee-lee]

@bniedermeyer - I ported the code in the github repo to a stackblitz. Can you confirm that this is the same as in the repo and that overflow is an issue clDgRowSelection? I'm not seeing the cells overflow. on StackBlitz.

https://stackblitz.com/edit/clarity-datagrid-issue-2525-reproduction

[bniedermeyer]

Interesting. I'm not seeing the issue in Stackblitz either and the code is the same as my repro. I wonder if project setup has something to do with it? Originally I saw this issue in my app, then created the repro project to make sure it wasn't something with my original application causing the issue.

For the repro I followed these steps:

1. ng new clarity-selectable-row
2. ng add @clr/angular
3. npm install [email protected] to deal with missing peer dependency warning
4. Added code to app.component.html and app.component.ts to recreate the issue.

Perhaps there is a difference in the way the Stackblitz apps are setup vs how they're setup when using the ng add command? I'm not at a place where I can test a project where I've manually added Clarity. I will do that asap and report back.

[hippee-lee]

It looks like the stackblitz was not using hte latest version of Clarity. I updated it and it reproduced the issue. Thanks for reporting this.

We will take a look into it and see whats causing it.
https://stackblitz.com/edit/clarity-datagrid-issue-2525-reproduction

[zerocewl]

Same here, if i use clDgRowSelection with v 0.12.7 the table does not resize the content of the rows according to the column size.

Workaround: use v 0.12.6 or remove clDgRowSelection.

[youdz]

Should be fixed by #2508. It broke when we made the clDgRowSelection feature more accessible.

This feature keeps creating issues for us, we highly recommend not using it since we believe it's both bad for accessibility reasons and doesn't bring anything in terms of UX (or worsen UX in some cases). Until #2508 goes in, we don't have time to allocate to fix this yet another time.

[alonbez]

Looks like #2508 was merged but the issue still reproducing.

[gnomeontherun]

These changes are not yet in master, they were in a feature branch that hasn't been released.

[youdz]

Fixed by #2670.

[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.