Skip to main content


GitHub repository

If you haven't already, check out the source code before proceeding:

git clone
cd image-display-control-web-component/image-display-control/

Code formatting

Pull and run ESLint and prettier with:

npm install
npm run lint # check for errors
npm run format # fix errors


Running the unit tests

Pull and run Web Test Runner with:

npm install
npm run test # run once
npm run test:watch # interactive watch mode

Running the local demo

Pull and run Web Dev Server in order to serve and run the demo with:

npm install
npm start # interactive watch mode


(Re-)generating tables of contents

Pull and run markdown-toc with:

npm install
npm run gentoc


Version number

Choose the next version number according to the rules of Semantic Versioning and set it in package.json.

Also update the examples to use the new version number:


Describe the changes made compared to the last released version in the changelog. Browse the git history to make sure nothing has been left out.

Update package-lock.json

rm -rf node_modules/ package-lock.json
npm install

Last tweaks and checks

Format and validate the source one last time:

npm run format
npm run gentoc
npm run test

Commit and push any local changes:

git add -A
git commit -m "<my message>"
git push

Git tag

In the rest of this document we'll assume you are releasing version 1.2.3. Create a git tag for the version you are releasing by running:

git tag 1.2.3
git push --tags

Build the package locally

Build the package locally by running:

npm pack

And check that the resulting frameright-image-display-control-web-component-1.2.3.tgz looks well-formed. Finally clean up by running:

rm frameright-image-display-control-web-component-1.2.3.tgz

Publish the package to npm

npm login --scope=@frameright
npm publish

On the first publication do npm publish --access public instead.

And check that the package looks well-formed at

Also check that the web component is available via CDN at