From 87f3d320cecc0ba9120830433d59e78e91eece1a Mon Sep 17 00:00:00 2001 From: Oliver Eyton-Williams Date: Sat, 19 Feb 2022 00:02:40 +0100 Subject: [PATCH] refactor(client): explain transform's signature (#45166) It's important to not pass frame to transform when using transformWithFrame. Instead we need to pass either frame.contentDocument or frame.contentDocument.documentElement --- .../src/templates/Challenges/rechallenge/transformers.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/client/src/templates/Challenges/rechallenge/transformers.js b/client/src/templates/Challenges/rechallenge/transformers.js index e0dd4c0d45..cec39bc9d6 100644 --- a/client/src/templates/Challenges/rechallenge/transformers.js +++ b/client/src/templates/Challenges/rechallenge/transformers.js @@ -211,8 +211,7 @@ async function transformScript(documentElement) { // exist on the site, only in the editor const addImportedFiles = async function (fileP) { const file = await fileP; - const transform = frame => { - const documentElement = frame; + const transform = documentElement => { const link = documentElement.querySelector('link[href="styles.css"]') ?? documentElement.querySelector('link[href="./styles.css"]'); @@ -259,6 +258,10 @@ const transformWithFrame = async function (transform, contents) { frame.contentDocument.documentElement.innerHTML = contents; // grab the contents now, in case the transformation fails out = { contents: frame.contentDocument.documentElement.innerHTML }; + // it's important to pass around the documentElement and NOT the frame + // itself. It appears that the frame's documentElement can get replaced by a + // blank documentElement without the contents. This seems only to happen on + // Firefox. out = await transform(frame.contentDocument.documentElement); } finally { document.body.removeChild(frame);