diff --git a/client/src/templates/Challenges/rechallenge/builders.ts b/client/src/templates/Challenges/rechallenge/builders.ts
index f174c79acb9..cc2a5a97067 100644
--- a/client/src/templates/Challenges/rechallenge/builders.ts
+++ b/client/src/templates/Challenges/rechallenge/builders.ts
@@ -1,15 +1,17 @@
import { template as _template } from 'lodash-es';
interface ConcatHTMLOptions {
- required: { src: string; link?: string }[];
+ required?: { src: string; link?: string }[];
template?: string;
contents?: string;
+ testRunner?: string;
}
export function concatHtml({
required = [],
template,
- contents
+ contents,
+ testRunner
}: ConcatHTMLOptions): string {
const embedSource = template
? _template(template)
@@ -31,5 +33,12 @@ A required file can not have both a src and a link: src = ${src}, link = ${link}
})
.join('\n');
- return `
${head}${embedSource({ source: contents }) || ''}`;
+ // The script has an id so that tests can look for it, if needed.
+ const testRunnerScript = testRunner
+ ? ``
+ : '';
+
+ return `${head}${
+ embedSource({ source: contents }) || ''
+ }${testRunnerScript}`;
}
diff --git a/client/src/templates/Challenges/utils/build.ts b/client/src/templates/Challenges/utils/build.ts
index 3e1a70091c1..c0506438627 100644
--- a/client/src/templates/Challenges/utils/build.ts
+++ b/client/src/templates/Challenges/utils/build.ts
@@ -44,11 +44,7 @@ interface BuildOptions {
const { filename: runner } = frameRunnerData;
const { filename: testEvaluator } = testEvaluatorData;
-const frameRunner = [
- {
- src: `/js/${runner}.js`
- }
-];
+const frameRunnerSrc = `/js/${runner}.js`;
type ApplyFunctionProps = (file: ChallengeFile) => Promise;
@@ -200,9 +196,6 @@ export function buildDOMChallenge(
{ challengeFiles, required = [], template = '' }: BuildChallengeData,
{ usesTestRunner } = { usesTestRunner: false }
): Promise | undefined {
- const finalRequires = [...required];
- if (usesTestRunner) finalRequires.push(...frameRunner);
-
const loadEnzyme = challengeFiles?.some(
challengeFile => challengeFile.ext === 'jsx'
);
@@ -222,9 +215,10 @@ export function buildDOMChallenge(
challengeType:
challengeTypes.html || challengeTypes.multifileCertProject,
build: concatHtml({
- required: finalRequires,
+ required,
template,
- contents
+ contents,
+ ...(usesTestRunner && { testRunner: frameRunnerSrc })
}),
sources: buildSourceMap(challengeFiles),
loadEnzyme
@@ -264,7 +258,7 @@ export function buildJSChallenge(
function buildBackendChallenge({ url }: BuildChallengeData) {
return {
challengeType: challengeTypes.backend,
- build: concatHtml({ required: frameRunner }),
+ build: concatHtml({ testRunner: frameRunnerSrc }),
sources: { url }
};
}
diff --git a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-javascript-by-building-a-role-playing-game/62b46e3a8d4be31be5af793d.md b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-javascript-by-building-a-role-playing-game/62b46e3a8d4be31be5af793d.md
index d98f9e81298..4e8f3312801 100644
--- a/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-javascript-by-building-a-role-playing-game/62b46e3a8d4be31be5af793d.md
+++ b/curriculum/challenges/english/15-javascript-algorithms-and-data-structures-22/learn-basic-javascript-by-building-a-role-playing-game/62b46e3a8d4be31be5af793d.md
@@ -25,7 +25,10 @@ Your `script` element should come at the end of your `body` element.
```js
const script = document.querySelector('script[data-src$="script.js"]');
assert.equal(script.previousElementSibling.tagName, "DIV");
-assert.isNull(script.nextElementSibling);
+// When building the test frame, the runner script is always inserted after user
+// code. This means the learner's script should be the penultimate element in
+// the body.
+assert.equal(script.nextElementSibling.id, "fcc-test-runner");
assert.equal(script.parentElement.tagName, "BODY");
```