dropdown menu click causes page to horizontally scroll ?

[jarekpc]

This is a bug report for the @clr Angular or UI versions of the design system.
For the web-component implementation of Clarity (@cds), visit vmware-clarity/core.
my package.json:
"@angular/animations": "16.2.12",
"@angular/cdk": "16.2.12",
"@angular/common": "16.2.12",
"@angular/compiler": "16.2.12",
"@angular/core": "16.2.12",
"@angular/forms": "16.2.12",
"@angular/google-maps": "16.2.12",
"@angular/platform-browser": "16.2.12",
"@angular/platform-browser-dynamic": "16.2.12",
"@angular/router": "16.2.12",
"@cds/core": "6.9.1",
"@clr/angular": "16.3.1",
"@clr/icons": "13.0.2",
"@clr/ui": "16.3.1",
If you are a VMware employee or a contractor in VMware, please use our support channel in slack to raise Clarity issues.

Describe the bug

When I updated Clarity and Angular to version 16, clicking on a dropdown in a table causes the page to scroll horizontally

How to reproduce

My code:

<button clrDropdownTrigger (click)="calculatePos($event, node.element)">


<clr-dropdown-menu #menu id="menu" [clrPosition]="menuPosition" *clrIfOpen>
<button clrDropdownItem *ngIf="!isAttached(node.element)" (click)="onAttachButtonClicked(node.element)">
Attach

Steps to reproduce the behavior:

1 Click on icon cog
2. See error (the page will scroll horizontally)

Expected behavior

A clear and concise description of what you expected to happen.

Versions

16
Clarity version:

• v13.x
• v15.x
• [x ] Other:

Framework version:
ie: Angular 15
Angular 16
Device:

• Type:
• OS: Windows 10
• Browser chrome (version: 118.0.5993.89), firefox

Additional notes

Add any other notes about the problem here.

[kevinbuhmann]

Please add a StackBlitz reproduction. Your code snippets references event handlers without the associated code.

https://stackblitz.com/@clr-team

[jarekpc]

Here is my code: https://stackblitz.com/edit/clarity-light-theme-clr16-xwajwy?file=src%2Fapp%2Fapp.component.html
When I click on clr-dropdown in cltr-tree, the page scrolls horizontally and disable display flex (screen below):

I think is problem with clr-tree because same button, dropdown is working . How to solve this?

[jarekpc]

Could you answer the question please?

[jarekpc]

When I updated project to clarity-17 still the same (not working)