angular / angular/components

CdkVirtualScrollViewport will not scroll past 266304 rows, no matter how many rows are in the array

Aperta
#24,208 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub
area: cdk/scrolling docs P4
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

Using the example project found at:
https://material.angular.io/cdk/scrolling/examples#cdk-virtual-scroll-context

If one increases the items array length to 1,000,000 elements, the virtual scroll viewport still renders and scrolls but will not scroll down past row number 266304.
`export class CdkVirtualScrollContextExample {
items = Array.from({length: 1000000}).map((_, i) => `Item #${i}`);
}`

This puts a hard cap on the size of dataset one can scroll through.

### Reproduction

Steps to reproduce:
1. Open in stackblitz the example found at https://material.angular.io/cdk/scrolling/examples#cdk-virtual-scroll-context
2. Increase the size of the array for the data feeding the example to 1,000,000 elements
3. Attempt to scroll to the bottom.

### Expected Behavior

Expect to see Item # 1,000,000 at the bottom area of the virtual scrolling area.

### Actual Behavior

I see item # 266,304 at the bottom of the scrolling area, with the scrollbar all the way at the bottom.

### Environment

- Angular: 13.0.0
- CDK/Material:13.1.2
- Browser(s): Brave, Safari
- Operating System (e.g. Windows, macOS, Ubuntu): macOS

Guida per i contributori

Apri la guida per i contributori

Direzione di ricerca

Riproduci il limite nell’esempio di contesto dello scorrimento virtuale di CDK collegato nell’issue modificando l’array in modo che contenga 1.000.000 di elementi. Analizza il comportamento dello scorrimento virtuale di CDK in prossimità della posizione di scorrimento massima; il lavoro è completato quando il viewport può raggiungere la fine dell’array invece di fermarsi alla riga 266304 e la riproduzione è stata verificata nei browser elencati.

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
Specificata chiaramente
Idoneità per principianti
48/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.