Question

How can we use a managed asset e.g. css/image in a Coach View?

Answer 1

Managed assets (web files) of a process app or toolkit are served under a fixed URL scheme, so a coach view can reference them in its Included scripts / CSS list by name - no URL needed - and in HTML / JavaScript by URL:

1. Declarative (recommended): Coach view > Behavior > Included Scripts - the list accepts .js and .css files that are managed web files of the same project or its toolkit dependencies (choose them from the picker). They load once per page.
2. By URL in the view's HTML or code - ask the coach framework for the asset URL instead of hard-coding the /teamworks/webasset/... path:

// coach view load handler: image from a managed web asset of this snapshot
var url = com_ibm_bpm_coach.getManagedAssetUrl("logo.png");   // helper of the coach framework (8.5.7+)
this.context.element.querySelector("img").src = url;

// CSS that references an image asset: use a relative URL from the CSS file's own location in the same asset folder
.header { background: url(logo.png) no-repeat; }

Rules: keep files small and in a zip asset when they belong together (fonts, a CSS with its images) - a zip is served as a folder (archive.zip/css/theme.css in the include list, and relative URLs inside the CSS resolve within the zip); avoid absolute URLs with snapshot ids in code (they change with every snapshot); a toolkit's assets are visible to every dependent app.

References

• BAW documentation - managed files (web files) and coach view included scripts