twilio / twilio-conversations-demo-react

Twilio Conversations Demo Web Application
MIT License
95 stars 287 forks source link

TypeError: Cannot read properties of undefined (reading 'updateToken') #152

Open aryo opened 5 months ago

aryo commented 5 months ago

We're following the example, where on tokenAboutToExpire we fetch a new token and call client.updateToken, but we're seeing a lot of these errors:

TypeError: Cannot read properties of undefined (reading 'updateToken')
  at call(node_modules/@twilio/conversations/builds/browser.js:9351:49)
  at tryCatch(node_modules/@twilio/conversations/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:45:16)
  at _invoke(node_modules/@twilio/conversations/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:133:17)
  at key(node_modules/@twilio/conversations/node_modules/@babel/runtime/helpers/regeneratorRuntime.js:74:21)
  at asyncGeneratorStep(node_modules/@twilio/conversations/node_modules/@babel/runtime/helpers/asyncToGenerator.js:3:20)
  at _next(node_modules/@twilio/conversations/node_modules/@babel/runtime/helpers/asyncToGenerator.js:22:9)

We are thinking of try/catching client.updateToken so it doesn't die, but from reading the conversations js internals, it looks like internally Client._fpaToken won't get set due to the error. Would there be any bad side effects?

We're on @twilio/conversations 2.4.1.

berkus commented 5 months ago

This means your client is undefined. Probably not yet initialized.

aryo commented 5 months ago

@berkus the client is defined. the error is thrown internally from within Client:

image

we're using it the exact same way as in the example:

    client.on("tokenAboutToExpire", async () => {
      const token = await getToken();
      await client.updateToken(token);
    }
berkus commented 4 months ago

@kmorope pls take a look at this folks.

kmorope commented 4 months ago

Hi @aryo, I'm trying to replicate the scenario for the issue but gonna need further info on your tech stack, are you using CRA like the Twilio conversations demo app or another framework? I made some tests directly on the demo app changing the token TTL, but the client is always defined, even in cases where the TTL is defined in less than a minute.

aryo commented 3 months ago

@kmorope Sorry for late reply, but yeah we are using CRA and the client instance lifecycle is similar to the example. A slight difference is that we have more things that can trigger another deinitialization of the client (e.g. log out etc) and we shutdown the client after removing listeners:

client.removeAllListeners();
await client.shutdown();

For completeness here's our initialization sequence + tokenAboutToExpire registration:

const token = await getToken();
const client = new Client(token)

client.on("tokenAboutToExpire", async () => {
  const token = await getToken();
  await client.updateToken(token);
});