CEP 9 HTML Extension Cookbook

CEP 9 HTML Extension Cookbook

Overview

This cookbook is a guide to creating CEP 9.0 HTML/JavaScript Extensions for Creative Cloud applications. CSXS is the old name before CS6, and CEP (Common Extensibility Platform) is new name from CS6. When we talk about CEP or CSXS, they refer to the same project.

CEP Extensions

CEP (formerly CSXS) Extensions extend the functionality of the Adobe point products in which they run. Extensions are loaded into applications through the PlugPlug Library architecture. Starting from CEP 4.0, HTML/CSS and JavaScript (ECMAScript 5) can be used to develop extensions.

Extension Types

These extension types are supported by CEP. You need to specify an extension’s type in its manifest.xml.

• Panel
  • The Panel type behaves like any other application panel. It can be docked, participates in workspaces, has fly-out menus, and is re-opened at start-up if open at shutdown.
• ModalDialog
  • A Modal Dialog type opens a new extension window and forces the user to interact only with the extenison window before returning control to the host application. User can interact with host application only after closing extension window.
• Modeless
  • A Modeless Dialog type opens a new extension window but doesn’t force the user to interact with the extension window.
• Custom (Since CEP 5.0)
  • This type is for invisible extensions. An invisible extension remains hidden and never becomes visible during its whole life cycle. Read “Invisible HTML Extensions” for more details.

Applications Integrated with CEP

These applications support CEP HTML extensions.

Application

Host ID

CC Version

CC 2014 Version

CC 2015 Version

CC 2015 Dot Version

CC 2017 Version

CC 2018 Version

CC 2019 Version

CC 2020 Version

Photoshop

PHSP/PHXS

14 (CEP 4)

15 (CEP 5)

16 (CEP 6)

17.0.2 (CEP 7)

18 (CEP 7)

19 (CEP 8)

20 (CEP 9)

21 (CEP 9)

InDesign

IDSN

9 (CEP 4)

10 (CEP 5)

11 (CEP 6)

-

12 (CEP 7)

13 (CEP 8)

14 (CEP 9)

15 (CEP 9)

InCopy

AICY

9 (CEP 4)

10 (CEP 5)

11 (CEP 6)

-

12 (CEP 7)

13 (CEP 8)

14 (CEP 9)

15 (CEP 9)

Illustrator

ILST

17 (CEP 4)

18 (CEP 5)

19 (CEP 6)

20 (CEP 7)

21 (CEP 7)

22 (CEP 8)

23 (CEP 9)

24 (CEP 9)

Premiere Pro

PPRO

7 (CEP 4)

8

9

10.3 (CEP 6)

11 (CEP 6)

12 (CEP 8)

13 (CEP 9)

14 (CEP 9)

Prelude

PRLD

2 (CEP 4)

3

4

5.0.1 (CEP 6)

6 (CEP 7)

7 (CEP 8)

8 (CEP 9)

9 (CEP 9)

After Effects

AEFT

12

13

13.5

13.8.1 (CEP 6)

14 (CEP 6)

15 (CEP 8)

16 (CEP 9)

17 (CEP 9)

Animate (Flash Pro)

FLPR

13

14 (CEP 5)

15 (CEP 6)

15.2 (CEP 6.1)

16 (CEP 6.1)

18 (CEP 8)

19 (CEP 9)

20 (CEP 9)

Audition

AUDT

6

7

8

9.2.1 (CEP 6)

10 (CEP 6)

11

12 (CEP 9)

13 (CEP 9)

Dreamweaver

DRWV

13 (CEP 4)

15 (CEP 5)

16 (CEP 6)

-

17 (CEP 6.1)

18 (CEP 8)

19 (CEP 9)

20 (CEP 9)

Muse

MUSE

7.4

-

2015

-

2017

2018

-

-

Bridge

KBRG

6

-

6.3.1

-

-

8 (CEP 8)

9 (CEP 9)

10 (CEP 9)

Rush

RUSH

-

-

-

-

-

-

1 (CEP 9)

1.2.1 (CEP 9)

Chromium Embedded Framework (CEF)

CEP HTML engine is based on Chromium Embedded Framework version 3 (CEF3). You can find more information about CEF here. Here are the versions used in CEP:

Component

CEP 6.1 and CEP 7.0

CEP 8.0

CEP 9.0

CEF 3

CEF 3 release branch 2272
Commit e8e1f98ee026a62778eb2269c8e883426db645ea

CEF 3 release branch 2987

CEF 3 release branch 3163

Chromium

41.0.2272.104

57.0.2987.74

61.0.3163.91

Node.js

IO.js 1.2.0

Node.js 7.7.4

Node.js 8.6.0

CEF/Node integration

Node-WebKit 0.12.1 (nw.js)

Node-Webkit 0.21.5

Node-Webkit 0.25

v8

-

-

6.3.292.49

Browser Features supported by CEP

HTTP Cookie

CEP supports two kinds of cookies:

• Session Cookies - Temporary in-memory cookie which will expire and disappear when user closes extension
• Persistent Cookies - No expiry date or validity interval, stored in user’s file system

Persistent Cookies location:

• CEP 4.x
  • Windows: C:Users<USERNAME>AppDataLocalTempcep_cookies
  • macOS: /Users/<USERNAME>/Library/Logs/CSXS/cep_cookies/
• CEP 5.x
  • Windows: C:Users<USERNAME>AppDataLocalTempcep_cache
  • macOS: /Users/<USERNAME>/Library/Logs/CSXS/cep_cache/
• CEP 6.x and later releases
  • Windows: C:Users<USERNAME>AppDataLocalTempcep_cache
  • macOS: /Users/<USERNAME>/Library/Caches/CSXS/cep_cache/

Each persistent cookie is a file. File name is HostID_HostVersion_ExtensionName, such as PHXS_15.0.0_com.adobe.extension1.

Development and Debugging

Migration from CEP 8 to CEP 9

There is no migration required for the extensions working in CEP 8. Extensions running on CEP 8 should run on CEP 9 out of the box. 

Note: <Size> element in manifest file is mandatory as per the documentation but it used to work by taking max or min size provided in the manifest till CEP 8, this bug has been fixed in CEP 9. Please ensure to define <Size> element in your manifest.

Migration from CEP 7 or lower to CEP 9

Please follow [Guide for migrating from CEP 7 to CEP 8](https://github.com/Adobe-CEP/CEP-Resources/blob/master/CEP_9.x/Documentation/CEP%209.0%20HTML%20Extension%20Cookbook.md#guide-for-migrating-from-cep-7-to-cep-8)

Guide for migrating from CEP 7 to CEP 8

Changes for Extensions Developers**

Please be aware that, we are moving to chromium version 57.0.2987.74 from 41.0.2272.104. Similarly for nodejs, we are moving to 7.7.4 from iojs 1.2.0. This migration guide is written based on CEP team’s testing and if you find any new issues, please document or share with CEP team.

Chromium

Following Chromium APIs have been removed:

• MediaStream.label, MediaStream.ended and MediaStream.stop()
• Remove getUserMedia() from Insecure Contexts
• SVG hasExtension() methods
• SVGSVGElement.pixelUnitToMillimeterX and friends
• Fetch API: Deprecate and remove Request.context
• Document.charset setter
• NPAPI plug-in support Range.compareNode() and Range.expand()
• WebAudio: Disallow setting AudioBufferSourceNode.buffer more than once
• Deprecate and remove SVGViewElement.viewTarget attribute
• Deprecate SVGSVGElement.viewport attribute
• Remove FileError interface
• Deprecate and remove: WebKit legacy window.postMessage() overload
• Deprecate and remove: ‘results’ attribute for

NodeJS

Below listed changes are applicable when --enable-nodejs is passed as CEFCommandline parameter.

New Symbols in the global context

CEP 8 and later versions introduces additional symbol: cep_node in the global context when nodejs is enabled. cep_node will hold following node specific symbols:

cep_node members Buffer, global, process and require

Accessing nodejs APIs in iframe

nodejs symbols will not be available in iframe’s global context, only way you can access nodejs APIs within iframe’s context is through cep_node. When --mixed-context is enabled, global node symbols and cep_node is available within iframe’s global context as browser and node gets executed at the same context. It is also important to note that, if you have existing code to check or use nodejs symbols in iframe’s global context, it used to work till last release and in the current release, it breaks in separate context mode.

JS Lib Break due to node symbols (possible for many other libraries)

Newly integrated nodejs adds “module” and “exports” symbols to the global context. Many libraries such as JQuery relies on its booting based on the availability of “module” symbol in the global scope. For ex, JQuery has following code while booting:

JQuery startup code

if ( typeof module === “object” && typeof module.exports === “object” ) {
// set jQuery in `module`
} else {
// set jQuery in `window`
}

When this code is executed in CEP’s browser with nodejs enabled, it will make JQuery to load in module context instead of Browser context. This would cause issues to extension’s startup. Please use below code to handle such scenarios:

global symbols handling

<script>if (typeof module === ‘object’) {window.module = module; module = undefined;}</script>
<script>if (typeof exports === ‘object’) {window.exports = exports; exports = undefined;}</script>