Error when running from 2nd browser

[Shehbaz]

Great lesson, thanks for making it!

When I try to run localhost from a different browser (original Chrome, second Firefox) I receive:

Unhandled Rejection (TypeError): Cannot read property 'attach' of undefined
_callee2$
C:/Users/XXX/code/twilio-gatsby-video-chat/src/hooks/use-twilio-video.js:126
  123 | });
  124 | 
  125 | // Attach the local video if it’s not already visible.
> 126 | if (!videoRef.current.hasChildNodes()) {

The error can be seen when running the browsers in either order. I can't determine why this error is being thrown, so I wanted to ask.

Thanks and Cheers!

[Jason Lengstorf]

hmm... does this happen if you use the demo? https://gatsby-twilio-video-chat.netlify.com/

I just opened Chrome and Firefox and didn't hit that issue

[Shehbaz]

Ya, the demo site worked the first time in chrome, but didn't work in firefox when I tried to join the same room.
Demo site doesn't look to be using the exact same code as this repo:
-browser url isn't updating when I join a room
-no "Leave Room" button after joining a room

I suspect something with the Twilio API, when I tried to launch again fresh from Chrome, the self video won't display anymore and errors seem to indicate something funky going on with that.

Currently, I can't get the self video in any browser for the demo site. The application itself fails gracefully (local would crash app) but interestingly each browser gives a different error in the console.
Chrome: no error, but it was throwing one in a previous attempt
Firefox:

Firefox can’t establish a connection to the server at wss://global.vss.twilio.com/signaling. twilioconnection.js:254
2020-04-07 04:16:20.096Z | WARN in [TwilioConnection #6: wss://global.vss.twilio.com/signaling]: Closed: 1006 - log.js:204
Firefox can’t establish a connection to the server at wss://sdkgw.us1.twilio.com/v1/VideoEvents. index.js:225
The connection to wss://sdkgw.us1.twilio.com/v1/VideoEvents was interrupted while the page was loading. index.js:225
Error: Signaling connection error twilioerror.js:103

IE11 (not for real use 🙂 but was curious about the error):

HTML1300: Navigation occurred.
gatsby-twilio-video-chat.netlify.com (1,1)

0: Unable to get property 'isPersonal' of undefined or null reference
Autoformfill_ContentScript.js (1,168)

Unhandled promise rejection TwilioError: Media connection failed

Let me know if I can help debug!

[Jason Lengstorf]

if it can't establish a connection to Twilio's WebSocket server, I'm not sure we'll be able to debug here — I think we need Twilio's help 😕

it's probably worth opening an issue on their lib? tag me and I can follow along to make any downstream changes required, too

thanks!