npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

adobe-cep-polyfill

v0.1.0

Published

Polyfills the CEPEngine global variables―allowing your plugin to run in the browser

Downloads

7

Readme

adobe-cep-polyfill

Polyfills the CEPEngine global variables―allowing your plugin to run in the browser.

Installation

Available on NPM as adobe-cep-polyfill:

npm i adobe-cep-polyfill

Usage

import polyfill from "adobe-cep-polyfill";

polyfill();

Usage Details

adobe-cep-polyfill exports a function that when executed will polyfill window.__adobe_cep__ and window.cep, if it's not defined. This means it is safe to call inside of your plugin without conflict―When executed within a CEP context, it will do nothing.

Note: The polyfill function should be executed before you instantiate CSInterface.

Mocking ExtendScript / evalScript

Running this polyfill allows most of CSInterace methods to be called without an error. But, if your plugin is reliant on data returned from an evalScript call it may be stuck in some bad state.

To get around that, the polyfill'd evalScript will check the window for a key matching your evalScript.

This allows you to write functions that mock your host scripts. The functions should return JSON.stringified objects.

Basic Example
import polyfill from "adobe-cep-polyfill";

polyfill();

const cs = new CSInterface();


// you can load this in a separate script file, and/or before instantiating CSInterface
// or however you please―as long as it is called before the cs.evalScript is called.
window.addTwoNumbers = (x, y) => {
  // needs to be a JSON stringifiedresult
  return JSON.stringify({ result: x + y  });
};

// ... some time later

cs.evalScript("addTwoNumbers(2, 3)", (response) => {
  const result = JSON.parse(response); // 5
});
Real World Example

You can view a real example here: @Fuse Fonts/plugin.host-scripts.mjs.

Context: The Fuse Fonts plugin loads the list of fonts available on the device. So, the mock function loads a list of fonts from Google Web Fonts instead.

Which powers this demo page: Fuse Fonts Web Demo

Advanced Usage

This polyfill is fairly approachable, and isn't doing anything complex. You can view the source and get an idea of everything it's doing pretty quickly: index.js

Contributing

Tests

The tests focus is on being able to instantiate CSInterface, as well as call any methods.

Tests setup

Before running tests we need to:

These are both accomplished for you via:

npm run test:setup

Running Tests

Run tests the standard npm package way:

npm run test