Maximum call stack size exceeded

[jonathaneckman]

Describe the bug Scrolling quickly in a grouped list with endless scroll throws a RangeError.

Reproduction It can be reproduced in the grouped-endless-scrolling e2e test.

To Reproduce Steps to reproduce the behavior:

1. Scroll down super fast.

2. See error in console.

   streams.ts:65 Uncaught RangeError: Maximum call stack size exceeded
      at streams.ts:65
      at Array.forEach (<anonymous>)
      at streams.ts:64
      at publish (actions.ts:93)
      at transformers.ts:104
      at pipe.ts:135
      at streams.ts:65
      at Array.forEach (<anonymous>)
      at streams.ts:64
      at streams.ts:99

Expected behavior No error.

Screenshots

Desktop (please complete the following information):

• OS: Windows 10
• Browser: Chromium based Edge

[petyosi]

Taking a look. Thanks for becoming a sponsor!

[petyosi]

@jonathaneckman it looks like I managed to mess up the example itself at some point - thanks for spotting this. This is the incorrect line, by the way. loadMore effectively calls itself.

Here's what the fixed version looks like - I am doing my best with scrolling fast and the error is no longer there. Can you please confirm that it also works on your side?

Cheers.

[jonathaneckman]

@petyosi the updated example looks good. I wasn't able to reproduce it. Thanks!

[thecodrr]

@petyosi this bug is back in the latest version: 1.9.3

             <Virtuoso
              data={items}
              computeItemKey={(index) => items[index].id || items[index].title}
              defaultItemHeight={estimatedItemHeight}
              overscan={20}
              totalCount={items.length}
              components={{
                Scroller: CustomScrollbarsVirtualList, // I am using react-scrollbars-custom
                Header: // Render a header
              }}
              itemContent={(index, item) => {
                    // render any kind of item here
                }
              }}
            />

Stack trace:

Uncaught RangeError: Maximum call stack size exceeded
    at listStateSystem.ts:164
    at utils.ts:20
    at pipe.ts:158
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at publish (actions.ts:93)
    at transformers.ts:104
    at pipe.ts:135
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at streams.ts:99
    at utils.ts:34
    at pipe.ts:135
    at pipe.ts:158
    at utils.ts:20
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at publish (actions.ts:93)
    at transformers.ts:104
    at pipe.ts:135
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at utils.ts:34
    at utils.ts:20
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at streams.ts:99
    at utils.ts:34
    at pipe.ts:135
    at pipe.ts:158
    at utils.ts:20
    at pipe.ts:158
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at publish (actions.ts:93)
    at transformers.ts:104
    at pipe.ts:135
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at streams.ts:99
    at utils.ts:34
    at pipe.ts:135
    at pipe.ts:158

I can reproduce it when I scroll top-bottom and back really fast a couple of times.

Edit: Got a slightly different stacktrace:

Uncaught RangeError: Maximum call stack size exceeded
    at sizeSystem.ts:129
    at listStateSystem.ts:216
    at utils.ts:20
    at pipe.ts:158
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at publish (actions.ts:93)
    at transformers.ts:104
    at pipe.ts:135
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at streams.ts:99
    at utils.ts:34
    at pipe.ts:135
    at pipe.ts:158
    at utils.ts:20
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at publish (actions.ts:93)
    at transformers.ts:104
    at pipe.ts:135
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at utils.ts:34
    at utils.ts:20
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at streams.ts:99
    at utils.ts:34
    at pipe.ts:135
    at pipe.ts:158
    at utils.ts:20
    at pipe.ts:158
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at publish (actions.ts:93)
    at transformers.ts:104
    at pipe.ts:135
    at streams.ts:65
    at Array.forEach (<anonymous>)
    at streams.ts:64
    at streams.ts:99
    at utils.ts:34
    at pipe.ts:135

[petyosi]

Can you create a code sandbox? Also, does it persist if you remove the custom scrollbar?

[thecodrr]

Can you create a code sandbox? Also, does it persist if you remove the custom scrollbar?

It is unpredictable. I was having it for a bit consistently but now everything seems fine.