Commit 458f4728 authored by Thomas Parisot's avatar Thomas Parisot

feat(polyfill): add a 'handlers' property to PagedConfig global object

Also, export the polyfill initializer to mesure side effects
parent f2fe80d2
Pipeline #268 failed with stage
in 3 minutes and 54 seconds
......@@ -47,6 +47,13 @@ However, you can add an async `before` function or return a Promise to delay the
}
},
after: (flow) => { console.log("after", flow) },
handlers: [
{
afterPageLayout(pageFragment, page) {
console.log(pageFragment);
}
}
]
};
</script>
```
......@@ -95,16 +102,15 @@ New handlers can be registered from `import { registerHandlers } from 'pagedjs'`
```html
<script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>
<script>
class MyHandler extends Paged.Handler {
constructor(chunker, polisher, caller) {
super(chunker, polisher, caller);
}
afterPageLayout(pageFragment, page) {
console.log(pageFragment);
}
window.PagedConfig = {
handlers: [
{
afterPageLayout(pageFragment, page) {
console.log(pageFragment);
}
}
]
}
Paged.registerHandlers(MyHandler);
</script>
```
......@@ -221,7 +227,7 @@ A `pagedmedia/pagedjs` docker image contains all the dependencies needed to run
To build the image run
```bash
docker build -t pagedmedia/pagedjs .
docker build -t pagedmedia/pagedjs .
```
By default the container will run the development server with `npm start`
......
......@@ -16,31 +16,46 @@ let ready = new Promise(function(resolve, reject){
};
});
let config = window.PagedConfig || {
auto: true,
before: undefined,
after: undefined,
content: undefined,
stylesheets: undefined,
renderTo: undefined
export let initialize = ({previewer}) => {
let config;
return Promise.resolve(global.PagedConfig)
.then((initialConfig) => {
// we defer the creation of the config object to when the page is loaded
// so as we can create a config object after loading the polyfill
config = Object.assign({
auto: true,
before: undefined,
after: undefined,
handlers: [],
content: undefined,
stylesheets: undefined,
renderTo: undefined
}, initialConfig)
})
.then(() => {
if (Array.isArray(config.handlers)) {
return previewer.registerHandlers(...config.handlers)
}
})
.then(() => {
if (config.before) {
return config.before();
}
})
.then(() => {
if(config.auto !== false) {
return previewer.preview(config.content, config.stylesheets, config.renderTo);
}
})
.then((previewResult) => {
if (config.after) {
return config.after(previewResult);
}
});
};
let previewer = new Previewer();
ready.then(async function () {
let done;
if (config.before) {
await config.before();
}
if(config.auto !== false) {
done = await previewer.preview(config.content, config.stylesheets, config.renderTo);
}
if (config.after) {
await config.after(done);
}
});
ready.then(() => initialize({previewer}));
export default previewer;
import Polyfill, { initialize } from "./polyfill.js";
import Handler from "../modules/handler.js";
import {Handlers, registeredHandlers} from "../utils/handlers.js";
describe("Polyfill", () => {
class TestHandler extends Handler {
afterPageLayout(pageFragment, page) {
console.log(pageFragment);
}
}
afterEach(() => {
delete global.PagedConfig;
});
it("should construct with default options", () => {
expect(Polyfill.handlers).toBeInstanceOf(Handlers);
expect(Polyfill).toHaveProperty("hooks", {});
expect(registeredHandlers).not.toContain(TestHandler);
});
it("should register Handler-based handlers on DOMContentReady", async () => {
window.PagedConfig = {
handlers: [TestHandler]
};
await initialize({ previewer: Polyfill });
expect(registeredHandlers).toContain(TestHandler);
});
it("should register bare object handlers on DOMContentReady", async () => {
const afterPageLayout = jest.fn();
window.PagedConfig = {
handlers: [{ afterPageLayout }]
};
await initialize({ previewer: Polyfill });
expect(registeredHandlers).toContainEqual({ afterPageLayout });
});
});
......@@ -18,6 +18,9 @@ class Previewer {
// Hooks
this.hooks = {};
// Handlers
this.handlers = this.initializeHandlers();
// default size
this.size = {
width: {
......@@ -126,8 +129,6 @@ class Previewer {
this.polisher.setup();
this.handlers = this.initializeHandlers();
await this.polisher.add(...stylesheets);
let startTime = performance.now();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment