bug(CdkDrag): Drag preview doesn't work well with sticky elements and scrolling
- Lingua principale
- TypeScript
- Stelle
- 25k
- Fork
- 6.8k
- Merge medio
- 1g 8h
- PR unite (30g)
- 91
Descrizione
### Is this a regression?
- [ ] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
_No response_
### Description
if the `cdkDrag` directive is applied on an element inside a container with `position: sticky`, scrolling will reposition the drag preview element. this is especially undesired for configurations such as `[cdkDropListLockAxis]="'x'"` and `[cdkDropListOrientation]="'horizontal'"`
### Reproduction
https://stackblitz.com/edit/components-issue-rtfk83?file=src/app/example-component.html
Steps to reproduce:
1. hold mouse down on element that contains "foo"
2. drag a little bit, then scroll vertically while holding the drag
3. should see the drag preview reposition even though "lock axis" is configured
### Expected Behavior
should not reposition vertically
### Actual Behavior
repositions vertically
### Environment
- Angular: 13.3.0
- CDK/Material: 13.3.0
- Browser(s): Chrome
- Operating System (e.g. Windows, macOS, Ubuntu): macOS
Guida per i contributori
Apri la guida per i contributori
Direzione di ricerca
Inizia con la riproduzione collegata di StackBlitz e analizza il comportamento di CDK drag preview quando l’elemento trascinato si trova all’interno di un sticky container. Riproduci il riposizionamento verticale durante lo scorrimento con lock axis e horizontal orientation configurati. Il lavoro è completato quando la preview rimane fissa verticalmente durante il drag, mentre il comportamento orizzontale esistente rimane intatto.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- angular, typescript
- Ambito
- frontend
- Tipo di issue
- Bug
- Difficoltà
- 3/5
- Tempo stimato
- 1-2 giorni
- Stato di attività
- Ferma
- Chiarezza
- Abbastanza chiara
- Idoneità per principianti
- 42/100