chat iframe: emberchat.js line 23 causing page to become unresponsive on pages with multiple embedded streams

[jzisser9]

In the past day or so, I've been seeing an issue with embedded Twitch chat where the emberchat.js script gets stuck on line 23 by Firefox:

WARNING: UNRESPONSIVE SCRIPT
A script on this page may be busy, or it may have stopped responding. You can stop the script now, open the script in the debugger, or let the script continue.

Script: http://web-cdn.ttvnw.net/emberchat.js:23

The problem seems to have something to do embedding multiple Twitch stream iframes in a page. The problem doesn't really seem to happen with one or two streams embedded, but the page will hang for 10 seconds or so with 3 streams, and almost a minute with 4. The problem is exacerbated further with any more embedded streams than that.

I believe I can confirm this is not an issue with the way I'm embedding the streams and chat, since the problem also manifests on long-standing services that embed multiple Twitch streams, like multitwitch.tv and kadgar.net - and this problem didn't exist there before.

So far, I've been able to reproduce this in Windows and Mac Chrome, and Windows and Mac Firefox. The issue does not seem to occur in Mac Safari and Microsoft Edge.

[jzisser9]

I'm seeing the following console logs in an incognito Chrome window after trying to load the chat iframe onto the page (while it hangs):

[Report Only] Refused to load the image 'http://www.twitch.tv/favicon.ico' because it violates the following Content Security Policy directive: "img-src https: data:".

[Report Only] Refused to load the stylesheet 'http://web-cdn.ttvnw.net/styles/application.css' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the stylesheet 'http://web-cdn.ttvnw.net/styles/application-8d415989d9002cd077287d281055b393.css' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the stylesheet 'http://web-cdn.ttvnw.net/styles/application-blessed1.css' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the stylesheet 'http://web-cdn.ttvnw.net/styles/application-blessed1-9f88069db4f9e40b450f19342c490be8.css' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'style-src' was not explicitly set, so 'default-src' is used as a fallback.

GET http://usher.twitch.tv/api/channel/hls/professorbroman.m3u8?player=twitchwe…ource=true&sig=e65cd921f3711b1db410e3adfa88ced073ad154e&allow_spectre=true 404 (Not Found)
TwitchPlayer: ERROR - Error loading URL: [IOErrorEvent type="ioError" bubbles=false cancelable=false eventPhase=2 text="Error #2032"]
[Report Only] Refused to load the script 'http://www-cdn.jtvnw.net/assets/global-644f3245659d964dbfeca8e41bc51d35.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

JQMIGRATE: Logging is active
JQMIGRATE: jQuery.browser is deprecated
[Report Only] Refused to load the script 'http://www.googletagservices.com/tag/js/gpt.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://cdn.mxpnl.com/libs/mixpanel-2.2.min.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to frame 'http://api.twitch.tv/crossdomain/receiver.html?v=2' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://api.mixpanel.com/track?data=eyJldmVudCI6ImV4cGVyaW1lbnRfYnJhbmNoIiwi…oid2ViIiwidG9rZW4iOiI4MDk1NzY0Njg1NzIxMzRmOTA5ZGZmYTZiZDBkY2ZjZiJ9fQ%3D%3D' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://spade.twitch.tv/?data=eyJldmVudCI6ImV4cGVyaW1lbnRfYnJhbmNoIiwicHJvcG…JFRElSRUNUIiwiZXhwZXJpbWVudF9ncm91cCI6Imlnbm9yZSIsInBsYXRmb3JtIjoid2ViIn19' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://www-cdn.jtvnw.net/assets/emberhelper-2e78664278e7a501ea64f8853ee3e667.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

GET chrome-extension://boadgeojelhgndaghljhdicfkmllpafd/cast_sender.js net::ERR_ADDRESS_UNREACHABLE
GET chrome-extension://dliochdbjfkdbacpmhlcpmleaejidimm/cast_sender.js net::ERR_ADDRESS_UNREACHABLE
[Report Only] Refused to load the script 'http://partner.googleadservices.com/gpt/pubads_impl_79.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

GET chrome-extension://hfaagokkkhdbgiakmmlclaapfelnkoah/cast_sender.js net::ERR_ADDRESS_UNREACHABLE
[Report Only] Refused to connect to 'http://api.mixpanel.com/track/?data=eyJldmVudCI6ICJtcF9wYWdlX3ZpZXciLCJwcm9…iAiODA5NTc2NDY4NTcyMTM0ZjkwOWRmZmE2YmQwZGNmY2YifX0%3D&ip=1&_=1454812767835' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback.

GET chrome-extension://fmfcbgogabcbclcofgocippekhfcmgfj/cast_sender.js net::ERR_ADDRESS_UNREACHABLE
GET chrome-extension://enhhojjnijigcajfphajepfemndkmdlo/cast_sender.js net::ERR_ADDRESS_UNREACHABLE
No cast extension found
The specified value "!" does not conform to the required format.  The format is "#rrggbb" where rr, gg, bb are two-digit hexadecimal numbers.
[Report Only] Refused to load the script 'http://web-cdn.ttvnw.net/emberchat.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to frame 'http://tpc.googlesyndication.com/safeframe/1-0-2/html/container.html?n=1' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://web-cdn.ttvnw.net/emberchat-ae6b485614a382563c7f219b168727f7.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

GET http://usher.twitch.tv/api/channel/hls/kinggothalion.m3u8?allow_spectre=tru…_source=true&player=twitchweb&sig=2bbf4dc55e3a65f086c8f88f4a3da9db94b4f91f 404 (Not Found)
TwitchPlayer: ERROR - Error loading URL: [IOErrorEvent type="ioError" bubbles=false cancelable=false eventPhase=2 text="Error #2032"]
[Report Only] Refused to load the script 'http://www-cdn.jtvnw.net/tmilibs/tmi-v3.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://www-cdn.jtvnw.net/tmilibs/tmi-v3.rbdf4b5569e4b3ec25b2609e180aab4afda6e9f22.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://www.google-analytics.com/ga.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://b.scorecardresearch.com/beacon.js?_=1454812767653' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://edge.quantserve.com/quant.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://www.google-analytics.com/plugins/ga/inpage_linkid.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the image 'http://web-cdn.ttvnw.net/images/xarth/twitch_logo_white_102_33.png' because it violates the following Content Security Policy directive: "img-src https: data:".

[Report Only] Refused to frame 'http://chatdepot.twitch.tv/crossdomain/tmi.html' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to frame 'http://tmi.twitch.tv/static/crossdomain_receiver.html' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to frame 'http://api.twitch.tv/assets/tmi_crossdomain_receiver.html' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load plugin data from '' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'object-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load plugin data from 'http://www.twitch.tv/tmilibs/JSSocket.swf' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'object-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the script 'http://connect.facebook.net/en_US/sdk.js' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'script-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to load the image 'http://pixel.quantserve.com/pixel;r=763038236;a=p-16uNVwiyGoWyg;labels=gami…e.application%2Fx-shockwave-flash%2Cvideo%3Aheight.378%2Cvideo%3Awidth.620' because it violates the following Content Security Policy directive: "img-src https: data:".

[Report Only] Refused to load the image 'http://b.scorecardresearch.com/b?c1=2&c2=6745306&c3=1&c4=&c5=01&c6=&c15=&ns…=http%3A%2F%2Flocalhost%3A3000%2Fteawrex%26kinggothalion%26professorbroman' because it violates the following Content Security Policy directive: "img-src https: data:".

[Report Only] Refused to connect to 'http://www.twitch.tv/tmilibs/JSSocket.r87d5ce36f728d05d6dd7726f53841fa72b521499.swf' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to frame 'http://staticxx.facebook.com/connect/xd_arbiter.php?version=42#channel=f2d5f9136c&origin=http%3A%2F%2Fwww.twitch.tv' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

[Report Only] Refused to connect to 'ws://192.16.64.178/' because it violates the following Content Security Policy directive: "default-src https: wss: http://*.hls.ttvnw.net 'unsafe-inline' 'unsafe-eval'". Note that 'connect-src' was not explicitly set, so 'default-src' is used as a fallback.

[jzisser9]

EDIT: Given @EmersonGGS's response, this might not actually be a factor.

This seems to have something to do with embedding multiple streams in a page. I noticed this in my project as well as others that also embed multiple Twitch streams in a page, like Multitwitch and Kadgar.net.

The threshold seems to be around 3 or 4 streams - that is, when I embed 3 streams in the page, the chat panel hangs for about 10 seconds before loading. With 4, it takes substantially longer for the chat panel to stop hanging. This is also noticeable on Multitwitch.tv and Kadgar.net.

[EmersonGGS]

I'm receiving this same issue.

My page is embedding a chat and a player for one user only, not multiple as @Argus9 is. The player seems to load fine, but the chat window is broken and will pass the error as stated above Warning: Unresponsive script. emberchat.js: 23

[jzisser9]

@EmersonGGS, that's interesting. What properties and parameters are you setting on each of those iframes? Maybe that's a factor?

[EmersonGGS]

player iframe (works as expected): <iframe id="playeriFrame" src="http://player.twitch.tv/?channel={channelname}" frameborder="0" allowfullscreen></iframe>

chat iframe (broken, results in the error): <iframe frameborder="0" scrolling="no" id="chat_embed" src="http://www.twitch.tv/{channelname}/chat" height="100%" width="100px"></iframe>

[jzisser9]

Yep, looks similar to how I've set up my iframes.

[EmersonGGS]

I've also tried to load emberchat.js manually, but with no success. I've also noticed, that everything works perfectly in my local environment on localhost, only when its uploaded to the server does it actually run into this emberchat.js problem.

[EmersonGGS]

It appears the main issue is that the regex is timing out (crashing) on the url where our files are being hosted. perhaps this could be a similar issue to yours @Argus9

[jzisserJg]

@EmersonGGS, interesting idea. Unfortunately, I have this problem in my local environment as well.

[FugiTech]

This shouldn't occur anymore