16.3.1 regression: p-overlayPanel dismisses when making changes to nested p-multiSelect with appendTo="body"

[NateRadebaugh]

Describe the bug

I have a p-multiSelect with appendTo="body" inside of p-overlayPanel.

When the user toggles selection of a p-multiSelect, the p-overlayPanel dismisses.

This is a regression that started when I upgraded from 16.1.x to 16.3.1 and is still present in primeng@16.4.2

I've found that this reproduces when I use appendTo="body" on the p-multiSelect inside of the p-overlayPanel since the updated code in p-overlayPanel considers it a "click away" even though the actual component is within the overlay.

Related: #13601

Environment

browser

Reproducer

https://stackblitz.com/edit/stackblitz-starters-hzx9fv?file=src%2Fmain.component.html

Angular version

16.2

PrimeNG version

16.4.2

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v18.17,.1

Browser(s)

Chrome

Steps to reproduce the behavior

Open overlay panel
Open multiselect
Choose an item
Overlay panel closes automatically!

Expected behavior

Overlay panel should stay open until I click away or programatically close it.

[erber014]

Can confirm this issue, this happens with more components than just the p-multiSelect, for example the calendar component. A previous issue similar to this exists here: #13950

[NateRadebaugh]

For now, I disabled the dismissable feature and manually handle dismissing the panel for now since otherwise this had me stuck on primeng@~16.1.0.

This workaround isn't ideal but got me moving forward to the latest primeng:

<p-overlayPanel
  #overlayPanel
  [dismissable]="false"
>
    <!-- ... -->
    <button type="text" (click)="overlaypanel.hide()">Cancel</button>
</p-overlaypanel>

[simoneraffaelli]

I ended up making another workaround, if someone is interested: #14323 (comment)

[simoneraffaelli]

as stated here: #14323

This problem is still present if you click the clear icon on the dropdown or if you uncheck the combobox