Only import sf debug tools if sfdebug url param is present (#1415)

* Only import sf debug tools if sfdebug url param is present

* Changeset

* Fix typescript error

.changeset/loud-cameras-learn.md

@@ -0,0 +1,5 @@
+---
+'@guardian/commercial': minor
+---
+
+Only import spacefinder debug tools when the sfdebug url param is present

src/insert/spacefinder/spacefinder-debug-tools.ts

@@ -1,5 +1,4 @@
 import { log } from '@guardian/libs';
-import { getUrlVars } from 'utils/url';
 import type {
 	SpacefinderExclusions,
 	SpacefinderItem,
@@ -8,8 +7,6 @@ import type {
 } from './spacefinder';
 import logo from './spacefinder-logo.svg';
 
-const enableDebug = !!getUrlVars().sfdebug;
-
 const isCurrentPass = (pass: SpacefinderPass) => {
 	const sfdebugPass = document.querySelector<HTMLInputElement>(
 		'input[name="sfdebug-pass"]:checked',
@@ -418,8 +415,6 @@ const init = (
 	rules: SpacefinderRules,
 	pass: SpacefinderPass,
 ): void => {
-	if (!enableDebug) return;
-
 	addDebugPanel();
 	annotate(exclusions, winners, rules, pass);
 	addPassToDebugPanel(pass);

src/insert/spacefinder/spacefinder.ts

@@ -3,7 +3,7 @@
 import { log } from '@guardian/libs';
 import { memoize } from 'lodash-es';
 import fastdom from 'utils/fastdom-promise';
-import { init as initSpacefinderDebugger } from './spacefinder-debug-tools';
+import { getUrlVars } from 'utils/url';
 
 type RuleSpacing = {
 	/**
@@ -591,7 +591,14 @@ const findSpace = async (
 	const measurements = await getMeasurements(rules, candidates);
 	const winners = enforceRules(measurements, rules, exclusions);
 
-	initSpacefinderDebugger(exclusions, winners, rules, options.pass);
+	const enableDebug = !!getUrlVars().sfdebug;
+
+	if (enableDebug) {
+		const pass = options.pass;
+		void import('./spacefinder-debug-tools').then(({ init }) => {
+			init(exclusions, winners, rules, pass);
+		});
+	}
 
 	window.performance.mark('commercial:spacefinder:findSpace:end');