Gitter Sidecar and “RangeError: Maximum call stack size exceeded”

Gitter is an interesting Slack-like alternative that I tried using recently. (I’m also looking into Samepage and Padlet for work).

I tried embedding a Gitter room into my page, but it didn’t work well. I kept getting a “RangeError: Maximum call stack size exceeded” message and a bunch of javascript errors.

 

Why does this happen? Well, it’s pretty simple, yet dumbfounding. When specifying the Gitter room, you can’t just embed a channel (TGMGroup); you have to embed a specific room (TGMGroup/Lobby).

 

Here’s code for an embedded iframe:

<iframe src="https://gitter.im/CHANNEL/ROOM_NAME" width="100%" height="500">

or for a WP iframe embed, use the WP iframe plugin and replace the <> with [].

Use the WP Code Embed plugin for the SideCar open-button-and-get-a-gitter-client-in-the-side-of-your-website feature with the code:

<script>
  ((window.gitter = {}).chat = {}).options = {
    room: 'CHANNEL/ROOM_NAME'
  };
</script>
<script src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer></script>

Sources: Gitter, Unknown