Dropdown is closed when interacting with a form inside dropdown menu

[maxokorokov]

Bug description:

Dropdown menu shouldn't close itself when there is a form inside the dropdown menu and user is interacting with the form. Even with [autoClose]="true" (default)

Link to minimally-working StackBlitz that reproduces the issue:

Stackblitz with both ng-bootstrap and bootstrap dropdowns to compare:

https://stackblitz.com/edit/angular-uahpzh?file=index.html

To reproduce:

• Click on ng-bootstrap button to open the menu
• Click anything inside login form
• Dropdown will close, but it shouldn't

Versions of Angular, ng-bootstrap and Bootstrap:

ng-bootstrap: 4.1.1

[martinezMaximiliano]

I am interested in working on this. I'm thinking I would create a ngbDropdownIgnore directive to ignore clicks on certain elements. So the user could apply this to the form or whatever other elements they want.

Is this an acceptable approach? If so, would that be considered a new feature instead of a bugfix? If not, would it be better to explicitly ignore form elements only?

[maxokorokov]

@martinezMaximiliano it is actually fixed by existing #3113.

The approach there was to close only on dropdown item clicks by default. This also fixes another issue with clicking on dropdown scrollbar.

[mhintzke]

@maxokorokov I was just scratching my head for a good hour digging into the source code trying to figure out why my code (on v4.1.1) was not working when using the exact same code that is on in the documentation example here. Had to create a fresh Angular app and reproduce the scenario where I then inspected the source code and discovered your fix that was introduced in 4.1.3.

Thanks a lot!