Side Loading

This page shows how to load your add-on from a local web server into eLabNext for live development. Before you begin, complete the Getting Started setup — you'll need Developer Mode enabled and a local HTTPS server hosting your add-on JavaScript file.

Load your add-on

Open the eLabNext Sandbox in your browser. Click the SDK Developer Tools icon (</>) in the top-right of the navigation bar to enable Developer Mode. With Developer Mode on, a Developer Panel button appears in the bottom-right corner of every page.
Click the Developer Panel button to open the SDK Dev Tools panel, then select the Side Loading tab.
Paste the URL of your add-on JavaScript file into Add-on script URL (for example, https://localhost:8443/plugin.js).
Paste your add-on's rootVar into Add-on RootVar (for example, MY_ADDON). The rootVar must start with a letter or underscore and contain only letters, digits, and underscores.
(Optional) Click Test URL to verify the URL serves your add-on script and that the script contains the rootVar you entered. The result appears in a banner below the buttons.
Click Save Settings. eLabNext loads the add-on immediately and persists the settings so they reload on every future page load.

If you don't have an add-on of your own yet, click Download Template to get a minimal starter file you can host on your local server. Pre-built examples are also available in the Recipes section — including Registering for a Samples Bulk Action and Button for Sample Action.

Stop side-loading

To stop a side-loaded add-on:

In the Side Loading tab, click Clear.
Confirm the dialog.

eLabNext reloads the page so the add-on script and any state it registered are fully unloaded. Your saved values are wiped on the server too — the add-on stops loading on future page loads until you save new settings.

Side-load add-on setup

When you are ready to start side-loading your own add-on, it is important to understand the key elements that make up an add-on suitable for side-loading. To gain a deeper understanding, refer to the following example code and its description:

Additionally, there are pre-built examples available that can be side-loaded directly. These examples can be found in the Recipes section and are a great starting point for developing your own add-ons through side-loading.

Troubleshooting

Symptom	Cause / fix
Add-on doesn't load after save	Confirm your local HTTPS server is running and the URL is reachable from your browser.
Save fails with "Script loaded but does not contain the RootVar"	The rootVar you entered doesn't match the variable your script defines on `window`. Update one to match the other.
Save fails with "That RootVar is already in use"	Another add-on (yours or one from the Marketplace) already uses this rootVar. Choose a different one.
CORS error when loading the script	Enable Local Network Access for the Sandbox in Chrome 142+. See Getting Started.

Save failures now show both an inline banner and a toast — if your save reports success without one of those errors, the values are persisted.