Easily add content to your Screenly digital signage displays in a few clicks. ✨

✅ Prerequisites

• Linux or macOS — If you're on Windows, you can use WSL. All of the scripts were written in Bash.
• Docker — The easiest way to get started is to install Docker Desktop.
• jq — Most of the scripts in the bin/ directory use jq to parse JSON. Install it from here.

🌱 Install

• Install the extension from the Chrome Web Store.
• Install the extension from Firefox Add Ons.

💻 Develop

The extension is built using webpack. Please check our contributing guidelines for detailed information about opening pull requests and releasing new versions.

$ PLATFORM=<PLATFORM> \
  VERSION=<VERSION> \
    ./bin/start_development_mode.sh

Important

• VERSION can be any valid version semver string (X.Y.Z), where X, Y, and Z are non-negative numbers.
• PLATFORM can be either chrome or firefox.

Now load the content of the dist/ folder as an unpacked extension in Chrome. As you make changes to the code, the extension is automatically rebuilt.

Getting Inside the Docker Container

$ docker compose exec browser-extension bash

Distribute

$ VERSION=<VERSION> \
  PLATFORM=<PLATFORM> \
    ./bin/package_extension.sh

The name of the packaged extension will be screenly-<PLATFORM>-extension-<VERSION>.zip. For example, screenly-chrome-extension-0.0.1.zip or screenly-firefox-extension-0.0.1.zip.

Testing Packaged Extensions

Note

You can also download the packaged extensions from the GitHub Releases page.

Chrome

• Extract the zip file to a folder.
• Open Chrome and navigate to chrome://extensions/.
• Click on Load unpacked and select the folder you extracted the zip file to.
• The extension should now be loaded and ready to use.

Firefox

Important

Add-ons installed from a .zip file will be uninstalled when Firefox is closed. This means that you will need to re-install the extension every time you open Firefox.

• Open Firefox and navigate to about:debugging.
• Click on This Firefox and then Load Temporary Add-on.
• You can either select the manifest.json file or the zipped extension.
• The extension should now be loaded and ready to use.

🧪 Run Unit Tests

$ ./bin/run_tests.sh

Randomized with seed <SEED>
Started
....................


20 specs, 0 failures
Finished in 0.01 seconds
Randomized with seed <SEED> (jasmine --random=true --seed=<SEED>)

✨ Run Linter and Formatter

Build the Docker image, which is a one-time operation:

$ docker compose build

🧹 Run Linter

$ ./bin/run_eslint.sh

This will run ESLint on the codebase and show any style issues or potential problems that need to be fixed.

💅 Run Formatter

This project uses Prettier to format the code. For more information why the linter and formatter are separate, see this article about ESLint deprecating formatting rules.

To check the code for formatting issues without changing any files, use the check mode:

$ MODE="check" ./bin/run_formatter.sh

To format the code and fix formatting issues, use the write mode:

$ MODE="write" ./bin/run_formatter.sh