I'm submitting a
[x] bug report
Current behavior
After updating from 6.0.1 to 6.0.2, toggling the display of a div containing a p-overlayPanel without triggering the display of the overlay will result in the following error:
AppComponent.html:5 ERROR TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.
at OverlayPanel.push../node_modules/primeng/components/overlaypanel/overlaypanel.js.OverlayPanel.restoreAppend (overlaypanel.js:74)
at OverlayPanel.push../node_modules/primeng/components/overlaypanel/overlaypanel.js.OverlayPanel.ngOnDestroy (overlaypanel.js:124)
at callProviderLifecycles (core.js:9574)
at callElementProvidersLifecycles (core.js:9542)
at callLifecycleHooksChildrenFirst (core.js:9532)
at destroyView (core.js:10594)
at callWithDebugContext (core.js:11352)
at Object.debugDestroyView [as destroyView] (core.js:11036)
at ViewContainerRef_.push../node_modules/@angular/core/fesm5/core.js.ViewContainerRef_.clear (core.js:8750)
at NgIf.push../node_modules/@angular/common/fesm5/common.js.NgIf._updateView (common.js:3358)
If I remove appendTo="body", there aren't any error anymore.
Expected behavior
6.0.1 toggles the display without any issue.
Minimal reproduction of the problem with instructions
The following template will crash on toggle:
@Component({
selector: 'app-root',
template: `
<p-toggleButton onLabel="on" offLabel="off" [(ngModel)]="display"></p-toggleButton>
<div *ngIf="display">
<button class="ui-button-secondary align-self-center" type="button" pButton label="Options" (click)="overlay.toggle($event)"></button>
<p-overlayPanel appendTo="body" #overlay>
<div>
Hello world
</div>
</p-overlayPanel>
</div>
`
})
export class AppComponent {
display = false;
}
off toggleon toggle (do not click on Options)Angular version: 6.1.0
PrimeNG version: 6.0.2
Browser: Chrome
Fyi, same error is happening with confirm dialog.
Adding && this.container to the line 73 of overlaypanel.js seem to fix the problem.
Heads up, looks like a duplicate ticket was resolved for this issue: #6168
Fixed in 6.1.0-RC1 already, yes.
Most helpful comment
Adding
&& this.containerto the line 73 of overlaypanel.js seem to fix the problem.