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 ...@@ -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) }, after: (flow) => { console.log("after", flow) },
handlers: [
{
afterPageLayout(pageFragment, page) {
console.log(pageFragment);
}
}
]
}; };
</script> </script>
``` ```
...@@ -95,16 +102,15 @@ New handlers can be registered from `import { registerHandlers } from 'pagedjs'` ...@@ -95,16 +102,15 @@ New handlers can be registered from `import { registerHandlers } from 'pagedjs'`
```html ```html
<script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script> <script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>
<script> <script>
class MyHandler extends Paged.Handler { window.PagedConfig = {
constructor(chunker, polisher, caller) { handlers: [
super(chunker, polisher, caller); {
} afterPageLayout(pageFragment, page) {
console.log(pageFragment);
afterPageLayout(pageFragment, page) { }
console.log(pageFragment); }
} ]
} }
Paged.registerHandlers(MyHandler);
</script> </script>
``` ```
...@@ -221,7 +227,7 @@ A `pagedmedia/pagedjs` docker image contains all the dependencies needed to run ...@@ -221,7 +227,7 @@ A `pagedmedia/pagedjs` docker image contains all the dependencies needed to run
To build the image run To build the image run
```bash ```bash
docker build -t pagedmedia/pagedjs . docker build -t pagedmedia/pagedjs .
``` ```
By default the container will run the development server with `npm start` By default the container will run the development server with `npm start`
......
...@@ -16,31 +16,46 @@ let ready = new Promise(function(resolve, reject){ ...@@ -16,31 +16,46 @@ let ready = new Promise(function(resolve, reject){
}; };
}); });
let config = window.PagedConfig || { export let initialize = ({previewer}) => {
auto: true, let config;
before: undefined,
after: undefined, return Promise.resolve(global.PagedConfig)
content: undefined, .then((initialConfig) => {
stylesheets: undefined, // we defer the creation of the config object to when the page is loaded
renderTo: undefined // 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(); let previewer = new Previewer();
ready.then(() => initialize({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);
}
});
export default 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 { ...@@ -18,6 +18,9 @@ class Previewer {
// Hooks // Hooks
this.hooks = {}; this.hooks = {};
// Handlers
this.handlers = this.initializeHandlers();
// default size // default size
this.size = { this.size = {
width: { width: {
...@@ -126,8 +129,6 @@ class Previewer { ...@@ -126,8 +129,6 @@ class Previewer {
this.polisher.setup(); this.polisher.setup();
this.handlers = this.initializeHandlers();
await this.polisher.add(...stylesheets); await this.polisher.add(...stylesheets);
let startTime = performance.now(); 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