Hotkey Hacks in Adobe CEP Panels

The Problem

Adding hotkeys or keyboard shortcuts to your Adobe CEP Extensions can be tricky. You can’t use a lot of keystrokes out-of-the-box like you would with a website, because the default behavior is sending shortcuts to your host app (AE, PPRO, etc) first and then sending them to your CEP panel if the host app doesn’t use them. To remedy this, Adobe has provided a way to “register” an interest in certain key combinations you would like to reserve for use in your app by passing a JSON string with your desired keyboard shortcuts detailed out.

The Solution

As you can imagine, this can get extremely cumbersome over time, especially if your wanting to use a lot of keyboard shortcuts in your panel. I came up with an override method with a little bit shifting jujutsu to create entries for every possible keyboard shortcut for your platform, and then register those so you can use any possible keyboard shortcut you like in development.

This is the massive JSON that’s generated and passed to the host, that you never need to worry about! 🔮

CAVEATS

Note that some keyboard shortcuts simply aren’t possible to use in a CEP panel even with this method, most of these are on Mac including the command/meta key, but this will cover the rest.