angular / angular/components

angular element with overlay rendered in overlay

Aperta
#16,862 17 commenti 14 reazioni 0 assegnatari Vedi su GitHub
area: cdk/overlay feature P5
Lingua principale
TypeScript
Stelle
25k
Fork
6.8k
Merge medio
1g 8h
PR unite (30g)
91

Descrizione

#### Reproduction

https://github.com/rcketscientist/AngularElementOverlayRepro

Steps to reproduce:
1. Create an Angular Element that leverages a CdkOverlay Material widget (tooltip, select, etc)
2. Place that selector in a CdkOverlay (MatDialog, for example).

As soon you interact with the "inner" CdkOverlay by hovering over the tooltip or activating the select, the host CdkOverlay will just crash without an error message I can pick up on.

This might not really be a bug, but rather a limitation of Angular Elements, but being that it can be triggered with simple widgets I wonder if there's not some way I can get the Angular Elements to play well with the host.

The Angular Elements work fine when not hosted in a CdkOverlay.


#### Expected Behavior

What behavior were you expecting to see?
CdkOverlay within Angular Element plays well with the host.

#### Actual Behavior

What behavior did you actually see?
Acitvation of the CdkOverlay within an Angular Element causes the host CdkOverlay to silently crash.

#### Environment

- Angular:8
- CDK/Material: 8
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): Win/Mac

Guida per i contributori

Apri la guida per i contributori

Direzione di ricerca

Iniziare dalla riproduzione disponibile all'indirizzo https://github.com/rcketscientist/AngularElementOverlayRepro e riprodurre il malfunzionamento usando Angular 8, CDK/Material 8 e Chrome. Analizzare l'interazione tra il widget CDK Overlay di un Angular Element e il relativo overlay host; il lavoro è completato quando l'interazione con tooltip o select non causa più silenziosamente il crash dell'overlay host, oppure quando la limitazione è documentata.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
angular, typescript
Ambito
frontend
Tipo di issue
Bug
Difficoltà
4/5
Tempo stimato
3-5 giorni
Stato di attività
Ferma
Chiarezza
Da chiarire
Idoneità per principianti
35/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.