Extension panel is blank on local test and twitch hosted

Extensions
1

I have an index.html, poll.js, style.css extension. It is pretty simple. The index.html includes the poll script which periodically polls an external api for leaderboard information. The index.html serves this info. I can see it working when I host it locally, but my attempt to connect this extension to twitch results in an empty panel:
image
I know that this is user error, but I’m not sure where to start looking. I had this same issue when I followed the “would you rather” tutorial, meaning I got an empty panel.
I tried skipping this step and moving straight to the hosted test just in case I’m having a local cert issue or something. But same result.

2

Check the console and/or network tab of inspector

Extensions are debugged the same way as regular websites, as they are a website.

Common issues here are:

  • 404 index.html failed to load as your zip file is incorrectly built, such as a zip of a folder of files isntead of a zip of files (network tab)
  • index.html loaded but you didn’t include the Twitch JS Helper. (console tab with a “ClientID not loaded” error)
  • index.html loaded you have the Twitch JS helper but you didn’t invoke the JS Helper and it’s onAuthorized functions (console tab with a “ClientID not loaded” error)
  • your tried to use inline JS/CSS (csp error in console tab)
  • you tried to load External JS (csp error just not allowed)
  • you tried to load Javascript but you used an absolute link instead of a relative link preventing the loading (network tab 404 on the JS)

thats just a few things it can be off the top of my head

1 Like
3

I did not include the twitch js helper. Do I need it even if I’m not calling any twitch apis?

4

Yes and onAuthorized invoked

5

According to this tutorial, all I need is an html file to create an extension:

I follow that tutorial and see the same thing above, a blank panel. In console: Failed to load resource: the server responded with a status of 404 ().

6

thats suggests

7

It’s a zip file with one file inside, index.html. Is that incorrect?

8

If that matches the entries you put in the developer console for the path to the views to load sure.

Often people create a zip file and accidentally do a folder in the zip instead of the files

So you need to trace and debug and check its loading what you think it’s loading

1 Like
9

I really appreciate your responses! I knew it was something dumb, but takes a while to debug when I have no experience in this area. I’m posting my stupidity here in case it helps anyone in the future. I named my file index.html, but Windows added a .txt to it, so it was actually index.html.txt. Hence, it could not be found.
Thanks again, Barry!