/aem-content-fragments-powerautomate

Sample AppBuilder application which implements a custom AEM Content Fragment Editor integrated with a custom PowerAutomate flow

Primary LanguageJavaScriptApache License 2.0Apache-2.0

Sample Content Fragment Editor

Welcome to my demo Application!

Setup

  • Populate the .env file in the project root and fill it as shown below

Local Dev

  • aio app run to start your local Dev server
  • App will run on localhost:9080 by default

By default the UI will be served locally but actions will be deployed and served from Adobe I/O Runtime. To start a local serverless stack and also run your actions locally use the aio app run --local option.

Test & Coverage

  • Run aio app test to run unit tests for ui and actions
  • Run aio app test -e to run e2e tests

Deploy & Cleanup

  • aio app deploy to build and deploy all actions on Runtime and static files to CDN
  • aio app undeploy to undeploy the app

Config

.env

# This file should not be committed to source control

## please provide your Adobe I/O Runtime credentials
# AIO_RUNTIME_AUTH=
# AIO_RUNTIME_NAMESPACE=

package.json

  • We use the name and version fields for the deployment. Make sure to fill those out. Do not use illegal characters as this might break the deployment (e.g. /, @, #, ..).

manifest.yml

  • List your backend actions under the actions field within the __APP_PACKAGE__ package placeholder. We will take care of replacing the package name placeholder by your project name and version.
  • For each action, use the function field to indicate the path to the action code.
  • More documentation for supported action fields can be found here.

Action Dependencies

  • You have two options to resolve your actions' dependencies:

    1. Packaged action file: Add your action's dependencies to the root package.json and install them using npm install. Then set the function field in manifest.yml to point to the entry file of your action folder. We will use parcelJS to package your code and dependencies into a single minified js file. The action will then be deployed as a single file. Use this method if you want to reduce the size of your actions.

    2. Zipped action folder: In the folder containing the action code add a package.json with the action's dependencies. Then set the function field in manifest.yml to point to the folder of that action. We will install the required dependencies within that directory and zip the folder before deploying it as a zipped action. Use this method if you want to keep your action's dependencies separated.

Debugging in VS Code

While running your local server (aio app run), both UI and actions can be debugged, to do so open the vscode debugger and select the debugging configuration called WebAndActions. Alternatively, there are also debug configs for only UI and each separate action.