TypeError: _iterator[Symbol.iterator] is not a function || For await of loop not working on Mobile (React Native)

[KochMario]

I'm currently in the stage for adding socketcluster-client to my React Native App after I've setup the corresponding server module. In my first evaluation stage I validated the client and server connection via browser (React Frontend). In this environment the usage of for await loops in order to consume channels or event listeners worked without any issues.

However the same setup doesn't seem to work on Mobile - in this case React Native. When trying to setup listeners for events like connect, subscribe or authStateChange I'm receiving the error TypeError: _iterator[Symbol.iterator] is not a function. The same applies to subscribing to channels and consuming their data.

What seems to work, on the other hand, is the 'older' style with a while loop. So this works:

(async () => {
  let consumer = socket.listener('connect');

  while (true) {
    let packet = await consumer.next();
    if (packet.done) break;
    console.log('DEF (while loop):', packet.value);
  }
})();

And this does NOT work:

(async () => {
  let consumer = socket.listener('connect');

  for await (const data of consumer) {
    console.log(`SocketManager - connect`, data);
  }
})();

My best clue would be that there's a difference between browser and mobile environment and that's why the for await of loop works in the browser but not in the app context. I've tried both with a real Android device and with iOS Simulator.

I couldn't find any similar issues or information overall. Are you guys hearing of this issue for the first time or has this been addressed at some point? What's kinda strange is that it's obviously trying to access [Symbol.iterator] even though it should be using [Symbol.asyncIterator] instead.

Some additional info:

"react": "16.13.1"
"react-native": "0.63.3",
"socketcluster-client": "16.0.2",

[jondubois]

@KochMario I have not heard of this issue before. It is strange that it tries to access Symbol.iterator instead of Symbol.asyncIterator - Could it be an issue with your Babel config? Maybe the target ECMAScript version is too old? It doesn't seem to recognize Symbol.asyncIterator.

[KochMario]

Thanks for the speedy reply! You're absolutely right. Adding https://babeljs.io/docs/en/babel-plugin-proposal-async-generator-functions, solved it.

Thanks a lot @jondubois, I highly appreciate how active and responsive you guys are maintaining this repo. 💯👏🏼