in dotcom-rendering/src/components/Liveness.importable.tsx [31:78]
function insert(
html: string,
enhanceTweetsSwitch: boolean,
topOfBlog: Element,
) {
// Create
// ------
const template = document.createElement('template');
template.innerHTML =
html + `<!-- inserted at ${new Date().toDateString()} -->`;
const fragment = template.content;
// Remove duplicates
// -----------------
for (const article of fragment.querySelectorAll('article')) {
if (document.getElementById(article.id)) article.remove();
}
// Hydrate
// -------
const islands = fragment.querySelectorAll<HTMLElement>('gu-island');
void Promise.all(
[...islands].map((island) => initHydration(island, getEmotionCache())),
);
// Insert
// ------
// Shouldn't we sanitise this html?
// We're being sent this string by our own backend, not reader input, so we
// trust that the tags and attributes it contains are safe and intentional
const blogBody = document.querySelector<HTMLElement>('#liveblog-body');
if (!blogBody) return;
// nextSibling? See: https://developer.mozilla.org/en-US/docs/Web/API/Node/insertBefore#example_2
blogBody.insertBefore(fragment, topOfBlog.nextSibling);
// Enhance
// -----------
if (enhanceTweetsSwitch) {
const pendingBlocks =
blogBody.querySelectorAll<HTMLElement>('.pending.block');
// https://developer.twitter.com/en/docs/twitter-for-websites/javascript-api/guides/scripting-loading-and-initialization
if (typeof twttr !== 'undefined') {
twttr.ready((twitter) => {
twitter.widgets.load(Array.from(pendingBlocks));
});
}
}
}