@alex.garcia/observable-prerender
Version:
Pre-render and programmatically control Observable notebooks with Puppeteer!
139 lines (133 loc) • 4.17 kB
HTML
<meta charset="utf-8" />
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link
rel="stylesheet"
type="text/css"
href="https://cdn.jsdelivr.net/npm/@observablehq/inspector@3/dist/inspector.css"
/>
<title>observable-prerender</title>
</head>
<body>
<script>
window.redefine = null;
window.notebookModule = null;
function serializeCellName(cell) {
return cell.replace(/ /g, "_");
}
</script>
<script type="module">
import {
Runtime,
RuntimeError,
Inspector,
} from "https://cdn.jsdelivr.net/npm/@observablehq/runtime@4/dist/runtime.js";
Object.assign(window, { Runtime, RuntimeError, Inspector });
function run(params = {}) {
const { notebook, targets, benchmark, OBSERVABLEHQ_API_KEY } = params;
let observer;
document.title = `${notebook} / ${document.title}`;
if (benchmark) {
observer = (name) => {
if (!name) return null;
const node = document.createElement("div");
node.setAttribute("id", `notebook-${serializeCellName(name)}`);
const i = new Inspector(document.body.appendChild(node));
return {
pending() {
window.__OBSERVABLE_PRERENDER_BENCHMARK(
name,
"pending",
Date.now()
);
i.pending();
},
fulfilled(value) {
window.__OBSERVABLE_PRERENDER_BENCHMARK(
name,
"fulfilled",
Date.now()
);
i.fulfilled(value);
},
rejected(error) {
window.__OBSERVABLE_PRERENDER_BENCHMARK(
name,
"rejected",
Date.now()
);
i.rejected(error);
},
};
};
} else if (targets.length > 0) {
const targetSet = new Set(targets);
observer = (name) => {
if (!targetSet.has(name)) return null;
const node = document.createElement("div");
node.setAttribute("id", `notebook-${serializeCellName(name)}`);
const i = new Inspector(document.body.appendChild(node));
return {
pending() {
if (benchmark)
window.__OBSERVABLE_PRERENDER_BENCHMARK(
name,
"pending",
Date.now()
);
i.pending();
},
fulfilled(value) {
if (benchmark)
window.__OBSERVABLE_PRERENDER_BENCHMARK(
name,
"fulfilled",
Date.now()
);
i.fulfilled(value);
},
rejected(error) {
if (benchmark)
window.__OBSERVABLE_PRERENDER_BENCHMARK(
name,
"rejected",
Date.now()
);
i.rejected(error);
},
};
};
}
// embed entire notebook, no regard
else {
observer = Inspector.into(document.body);
}
const notebookLink = `https://api.observablehq.com/${notebook}.js?v=3${
OBSERVABLEHQ_API_KEY ? `&api_key=${OBSERVABLEHQ_API_KEY}` : ""
}`;
return import(notebookLink)
.then(async ({ default: define }) => {
window.rt = new Runtime();
const o = observer;
const m = window.rt.module(define, o);
window.notebookModule = m;
window.redefine = (redefine) => {
for (let cell in redefine) {
m.redefine(cell, redefine[cell]);
}
};
window.redefineFileAttachments = (files) => {
const fa = new Map(files);
window.notebookModule.redefine("FileAttachment", [], () =>
window.rt.fileAttachments((name) => fa.get(name))
);
};
return null;
})
.catch((error) => error);
}
window.run = run;
</script>
</body>