AEM Sidekick

Browser extension for authoring AEM sites

Status

Installation

1. Go to the Chrome Web Store
2. Click Add to Chrome
3. Confirm by clicking Add extension
4. Click the extensions icon next to Chrome's address bar to see a list of all extensions:
5. Verify that there's an icon like this:
6. Click the pin button next to it to make sure it always stays visible.

Development

Install Dependencies

$ npm install

Build and Test Locally

1. Start the development server to trigger a build on each code change:

   $ npm run build:watch
   

2. Open Chrome and navigate to chrome://extensions
3. Turn on Developer mode at the top right of the header bar
4. Click the Load unpacked button in the action bar
5. Navigate to the dist > chrome folder and click Select to install and activate the Sidekick extension.
6. Verify that your Extensions page displays a card like this:
7. Click the extensions icon next to Chrome's address bar to see a list of all extensions:
8. Verify that there's an icon like this:
9. Click the pin icon next to it to make sure it always stays visible.

Code Changes

• Keep npm run build:watch running during development. The build usually takes between 1 and 3 seconds.
• Changes to the application (everything under app) require a reload of the tab.
• Changes to the service worker (background.js and its includes) require a reload of the extension by clicking the reload icon on the extension card.

Run All Tests

$ npm test

Debug Browser Tests

$ npm run test:watch

Lint

$ npm run lint

Build All

$ npm run build

Build Chrome

$ npm run build:chrome

...

Deployment

...