realm-js icon indicating copy to clipboard operation
realm-js copied to clipboard

calling stream.return() on chrome 124 crashes browser

Open sharifmacky opened this issue 4 months ago • 14 comments

Calling return() on a change stream using the Websdk on Chrome ~~Android~~ 124 causes the browser to crash, showing "Aw, Snap! Something went wrong..." Works fine on ~~Desktop.~~ 123

Stepping through the sdk source it seems like on ~~desktop~~ Chrome 123, i.return() is a wrapper which then calls cancel() on the underlying stream reader. On ~~mobile~~ 124, i.return is a native fn.

return(value) {
        iterator.then((i) => i.return ? i.return(value) : void 0);  // <--- i.return is native on 124 
        return originalReturn.call(stream, value); // this is fine
}

On ~~mob~~ 124, it calls return() on the native fn and then steps into the watch() impl. After that the browser crashes.

Specifically I noticed that in the asyncIteratorFromResponseBody function, requests on ~~a mobile browser~~ 124 seem to have a Symbol.asyncIterator in the body and so don't get wrapped as do the requests from ~~a desktop browser~~ 123. If I comment the 'else if' block out, everything "seems" to work. Although I'm sure there's a better fix

function asyncIteratorFromResponseBody(body) {
  if (typeof body !== "object" || body === null) {
    throw new Error("Expected a non-null object");
  } else if (Symbol.asyncIterator in body) {   // <---------- this kills chrome on 124
    return body;                              // commenting this if block out "fixes" it
  } else if ("getReader" in body) {
    const stream = body;
    return {
      [Symbol.asyncIterator]() {
        const reader = stream.getReader();
        return {
          next() {
            return reader.read();
          },
          async return() {
            await reader.cancel();
            return { done: true, value: null };
          }
        };
      }
    };
  } else {
    throw new Error("Expected an AsyncIterable or a ReadableStream");
  }
}

I've yet to test on IOS.

Mobile Chrome: 124.0.6367.54 Android 13; KB2003 Build/RKQ1.211119.001

Desktop Chrome: ~~123.0.6312.106~~ Verified on 124.0.6367.61 Windows 11 Pro, OS build 22631.3447, Feature Experience Pack 1000.22688.1000.0

sharifmacky avatar Apr 21 '24 12:04 sharifmacky

➤ PM Bot commented:

Jira ticket: RJS-2809

sync-by-unito[bot] avatar Apr 21 '24 12:04 sync-by-unito[bot]

Thank you for reporting.

Symbol.asyncIterator should be supported by Chrome on Android. We need to investigate further.

Is it possible for you to upgrade your Desktop Chrome to 124 to see if it works or doesn't work?

kneth avatar Apr 22 '24 08:04 kneth

Yes it seems like a chrome 124 issue. On chrome desktop the same behaviour is now happening where Symbol.asyncIterator is in the response body and the browser crashes.

sharifmacky avatar Apr 23 '24 09:04 sharifmacky

Hi. We have a similar issue in our React web app. After upgrading to the latest version of Chrome (or Edge, and other Chromium-based browsers), our users encountered a constantly occurring "Aw, Snap!"-like error.

During the investigation, we found that the problem only occurs on newer versions of Chromium (v124) and is related to the use of change streams. All previous Chromium versions are working fine for us (v123 included). Firefox and Safari working fine too. Also, it looks like the problem is not related to the OS, Сhromium crashes on Windows and Mac OS (but we have not tested any Linux distros yet).

Tests show that just using the asyncIterator doesn't cause any problems, but for some reason when we use an asyncGenerator (AsyncGenerator<Realm.Services.MongoDB.ChangeEvent>), a memory leak occurs, which leads to a crash of the browser tab. At the moment, this is all that we have been able to find, but I will be glad to share any info if we find anything else.

Dv-Andrew avatar Apr 23 '24 09:04 Dv-Andrew

https://github.com/realm/realm-js/blob/6269081d4e58c116ea7800bdd18c59dc0ffd9c80/packages/realm-web/src/Fetcher.ts#L42-L43

sharifmacky avatar Apr 23 '24 09:04 sharifmacky

Hi. We have a similar issue in our React web app. After upgrading to the latest version of Chrome (or Edge, and other Chromium-based browsers), our users encountered a constantly occurring "Aw, Snap!"-like error.

During the investigation, we found that the problem only occurs on newer versions of Chromium (v124) and is related to the use of change streams. All previous Chromium versions are working fine for us (v123 included). Firefox and Safari working fine too. Also, it looks like the problem is not related to the OS, Сhromium crashes on Windows and Mac OS (but we have not tested any Linux distros yet).

Tests show that just using the asyncIterator doesn't cause any problems, but for some reason when we use an asyncGenerator (AsyncGenerator<Realm.Services.MongoDB.ChangeEvent>), a memory leak occurs, which leads to a crash of the browser tab. At the moment, this is all that we have been able to find, but I will be glad to share any info if we find anything else.

Exactly the same happening for me and my users re Change Streams.

andy-dextrous avatar Apr 25 '24 00:04 andy-dextrous

@Dv-Andrew Thank for all the details. @andy-dextrous Thank for confirming.

I will bring it up with the team to see what we can do but it might take a while.

kneth avatar Apr 26 '24 14:04 kneth

@kneth Were there any updates? I am having a lot of difficulty.

piesuke avatar May 07 '24 05:05 piesuke

@piesuke Unfortunately we haven't any updates to share yet.

kneth avatar May 07 '24 12:05 kneth