test(wtr): shift logic out of wrapper into static test runner file

we want to keep the generated wrappers as thin as possible

and use regular js files as much as possible

Author: wjhsf

packages/@lwc/integration-not-karma/configs/plugins/serve-hydration.js

@@ -178,16 +178,14 @@ async function wrapHydrationTest(filePath) {
             : await getCompiledModule(suiteDir, true);
         const ssrOutput = await getSsrCode(componentDefSSR, filePath, expectedSSRConsoleCalls);
 
-        // FIXME: can we turn these IIFEs into ESM imports?
         return `
         import { runTest } from '/helpers/test-hydrate.js';
-        import config from '/${filePath}?original=1';
-        import Component from '/${componentEntrypoint}';
-
-        ${onlyFileExists ? 'it.only' : 'it'}('${filePath}', async () => {
-            const ssrRendered = ${JSON.stringify(ssrOutput) /* escape quotes */};
-            return await runTest(ssrRendered, Component, config);
-        });
+        runTest(
+            '/${filePath}?original=1',
+            '/${componentEntrypoint}',
+            ${JSON.stringify(ssrOutput) /* escape quotes */},
+            ${onlyFileExists}
+        );
         `;
     } finally {
         requiredFeatureFlags?.forEach((featureFlag) => {

packages/@lwc/integration-not-karma/helpers/test-hydrate.js

@@ -22,39 +22,42 @@ function setFeatureFlags(requiredFeatureFlags, value) {
     });
 }
 
-async function runTest(ssrRendered, Component, testConfig) {
-    const container = appendTestTarget(ssrRendered);
-    const selector = container.firstChild.tagName.toLowerCase();
-    let target = container.querySelector(selector);
-
-    let testResult;
-    const consoleSpy = spyConsole();
-    setFeatureFlags(testConfig.requiredFeatureFlags, true);
-
-    if (testConfig.test) {
-        const snapshot = testConfig.snapshot ? testConfig.snapshot(target) : {};
-
-        const props = testConfig.props || {};
-        const clientProps = testConfig.clientProps || props;
-
-        LWC.hydrateComponent(target, Component, clientProps);
-
-        // let's select again the target, it should be the same elements as in the snapshot
-        target = container.querySelector(selector);
-        testResult = await testConfig.test(target, snapshot, consoleSpy.calls);
-    } else if (testConfig.advancedTest) {
-        testResult = await testConfig.advancedTest(target, {
-            Component,
-            hydrateComponent: LWC.hydrateComponent.bind(LWC),
-            consoleSpy,
-            container,
-            selector,
-        });
-    }
-
-    consoleSpy.reset();
-
-    return testResult;
+export function runTest(configPath, componentPath, ssrRendered, focused) {
+    const test = focused ? it.only : it;
+    test(configPath, async () => {
+        const testConfig = await import(configPath);
+        const Component = await import(componentPath);
+        const container = appendTestTarget(ssrRendered);
+        const selector = container.firstChild.tagName.toLowerCase();
+        let target = container.querySelector(selector);
+
+        let testResult;
+        const consoleSpy = spyConsole();
+        setFeatureFlags(testConfig.requiredFeatureFlags, true);
+
+        if (testConfig.test) {
+            const snapshot = testConfig.snapshot ? testConfig.snapshot(target) : {};
+
+            const props = testConfig.props || {};
+            const clientProps = testConfig.clientProps || props;
+
+            LWC.hydrateComponent(target, Component, clientProps);
+
+            // let's select again the target, it should be the same elements as in the snapshot
+            target = container.querySelector(selector);
+            testResult = await testConfig.test(target, snapshot, consoleSpy.calls);
+        } else if (testConfig.advancedTest) {
+            testResult = await testConfig.advancedTest(target, {
+                Component,
+                hydrateComponent: LWC.hydrateComponent.bind(LWC),
+                consoleSpy,
+                container,
+                selector,
+            });
+        }
+
+        consoleSpy.reset();
+
+        return testResult;
+    });
 }
-
-export { runTest };