Contents

Extensions Developer Rig

Introduction

The Developer Rig allows Extensions developers to develop and test Extensions quickly, easily, and locally. It is a lightweight web app that runs in a browser and lets you test with production APIs and hosted assets on Twitch. Please note: before you can use the Developer Rig, you must first create an extension manifest on dev.twitch.tv.

The Developer Rig also can be used to manage your Bits product catalog, if you have completed Extensions monetization developer onboarding (required for non-Twitch partners/affiliates) and your extension is enabled for Bits monetization. See Bits in Extensions Guide.

If your extension is enabled for Bits monetization, when you configure the Developer Rig to run with your extension, you will see a Manage Products tab. Here, you can view, create, edit, and deprecate products — as long as your extension is enabled for Bits and you are logged in to the account that owns your extension.

The Developer Rig is supported in Chrome and Firefox on Windows and Chrome and Safari on MacOS. Make sure your version of the rig is up to date: click your Twitch account name in the upper right corner of the rig, and the drop down menu will indicate if your version is up to date. (This works in version v0.3.0 (mid-July 2018) and later.)

Starting Up the Rig

To get the Developer Rig:

  1. Download and extract the Zip file.
  2. Set up for the script to run:
    • On Windows, go to Settings > Update & Security > For developers. Select Developer Mode.
    • On MacOS, go to System Preferences > Security & Privacy > General. Under Allow apps downloaded from, select App Store and identified developers.
  3. In the scripts folder, run (double click) the configure (macOS) or configure.cmd (Windows) file. This script installs and configures all dependencies for the rig. As part of this process, you will need to provide your computer login credentials, since you are creating a certificate.

After installing the rig, you can launch it by either:

Then sign in with your Twitch credentials.

Creating a Project

From the rig, select Select an Extension Project > Create New Project.

At the center of the Developer Rig is your extension project, a combination of the extension code and the extension manifest (metadata needed to run the code on Twitch or in the rig). When you start the rig for the first time, you’ll need to create your first project.

To create an extension project:

  1. Add your extension information, to use an extension manifest already created on your Twitch developer dashboard. Enter the clientId (copy this from your Extensions overview page), secret (copy this from Settings > Secret Keys for your extension), and extension version number (the default is 0.0.1).
  2. Specify the root Project Folder for project files.
  3. Under Add Code to Project, indicate how you want to add the initial code: None (the rig creates just a project folder, no code) or Use Existing Sample Template (full code samples provided by Twitch, with front-end and, in some cases, back-end parts). If you choose to use an existing template, select a template.
  4. Click Save or Cancel.

Other Rig Functionality

The rig has several tabs to assist your development process and run your project:

Tab This is where you ...
Project Overview

Run your project (following the steps on the page), manage project metadata, and run the commands to host your front- and back-end files.

Also, click here to refresh your extension project, if you change your extension manifest (and it was created on the Twitch dev site, not locally).

Configuration Service Access and manage extension configuration data, for use by the Configuration Service.
Extension Views

Create and interact with different views of your extension, for testing. Select among these Extension Types:

  • The Panel view shows what your extension looks like as a panel extension.
  • The Configuration view appears on a broadcaster's dashboard for an extension.
  • The Dashboard view is presented to broadcasters after they install an extension but before they activate it.

To add a new view for the configured client ID, click the + button. To delete a view, click the X on the view.

Depending on the selected type, you also select one or more Viewer Types:

  • Broadcaster
  • Logged-in viewers (linked and unlinked)
  • Logged-out viewers (i.e., anonymous users)

Extension output logs can be redirected to the rig console, a local console specific to the Developer Rig. The console is at the bottom of the Extension Views page. To enable your extension to output to this console, make the following call from the extension's JavaScript front end: window.Twitch.ext.rig.log(<message to log>)

Manage Bits Product

Integrate Bits into your extension. Before this tab is available for use, you must complete Extensions monetization onboarding and include Bits monetization in your extension (see Bits in Extensions Guide).

Troubleshooting

On Windows 10, my system settings don’t let me run scripts downloaded from the Internet

In the For Developers section of your system settings, change your security setting to Developer Mode.

I get an error when trying to run yarn test

Sometimes deleting and reinstalling your node_modules fixes this issue.

On macOS, you may need to explicitly install watchman via brew install watchman.

yarn install fails in libssh2

See issue #48. Be sure libssh and its dependencies are installed.

I get an error when pulling in the example project

Ensure that Git is in your PATH variables by trying to run git at your command line. If that works, also ensure that the local folder does not currently exist.

I’m sure my Developer Rig configuration is correct, but my extension doesn’t work

Clear your browser cache and local storage and restart the Developer Rig.

To delete the rig’s local storage, open the JavaScript console in your browser on a tab with the rig open, do localStorage.clear(); then refresh.

Ensure you’ve included the Twitch Extensions Helper in your front-end files.