primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.62k stars 4.63k forks source link

menu: appendTo values other than body not working correctly in v18 #16795

Open jasonverber opened 1 week ago

jasonverber commented 1 week ago

Describe the bug

When Menu.appendTo is set to a value other than "body" the menu items are not appended to the element passed via template ref, but rather the element is appended to the menu items.

appendOverlay() {
        if (this.appendTo) {
            if (this.appendTo === 'body') this.renderer.appendChild(this.document.body, this.container);
            else appendChild(this.container, this.appendTo);
        }
    }

Changing the order of the parameters fixes this:

appendOverlay() {
        if (this.appendTo) {
            if (this.appendTo === 'body') this.renderer.appendChild(this.document.body, this.container);
            else appendChild(this.appendTo, this.container);
        }
    }

This actually appears to be backwards everywhere that the @primeuix/utils version of appendChild is called.

Environment

Fresh download of the v18 branch running the showcase app with a menu added to a button will reproduce this. Personally running on an Apple silicon Mac with node 18.19.1.

Reproducer

https://stackblitz.com/edit/github-l2mr75?file=src%2Fapp%2Fapp.component.html

Angular version

18

PrimeNG version

18.0.0-rc.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.19.1

Browser(s)

No response

Steps to reproduce the behavior

  1. Install PrimeNG 18
  2. Use the Menu component with [appendTo]="someTemplateRef"
  3. Observe the menu does not appear where it should.
  4. Update menu.ts to reverse the order of the parameters for appendChild
  5. Observe the menu does appear where it should.

Expected behavior

Menu items should appear appended to the element passed in via appendTo