enable hydration for SSR v2 (#5226)

* wip: wip * build(deps-dev): bump prettier from 3.4.2 to 3.5.0 in the prettier group (#5204) Bumps the prettier group with 1 update: [prettier](https://github.com/prettier/prettier). Updates `prettier` from 3.4.2 to 3.5.0 - [Release notes](https://github.com/prettier/prettier/releases) - [Changelog](https://github.com/prettier/prettier/blob/main/CHANGELOG.md) - [Commits](prettier/prettier@3.4.2...3.5.0) --- updated-dependencies: - dependency-name: prettier dependency-type: direct:development update-type: version-update:semver-minor dependency-group: prettier ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * build(deps): bump the theoretically-non-breaking group with 20 updates (#5205) * build(deps): bump the theoretically-non-breaking group with 20 updates Bumps the theoretically-non-breaking group with 20 updates: | Package | From | To | | --- | --- | --- | | [@eslint/js](https://github.com/eslint/eslint/tree/HEAD/packages/js) | `9.19.0` | `9.20.0` | | [@nx/js](https://github.com/nrwl/nx/tree/HEAD/packages/js) | `20.3.3` | `20.4.2` | | [@swc/core](https://github.com/swc-project/swc) | `1.10.12` | `1.10.15` | | [@types/node](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/node) | `22.13.0` | `22.13.1` | | [@vitest/eslint-plugin](https://github.com/vitest-dev/eslint-plugin-vitest) | `1.1.25` | `1.1.27` | | [eslint](https://github.com/eslint/eslint) | `9.19.0` | `9.20.0` | | [nx](https://github.com/nrwl/nx/tree/HEAD/packages/nx) | `20.3.3` | `20.4.2` | | [rollup](https://github.com/rollup/rollup) | `4.34.1` | `4.34.6` | | [terser](https://github.com/terser/terser) | `5.37.0` | `5.38.1` | | [typescript-eslint](https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/typescript-eslint) | `8.22.0` | `8.23.0` | | [@babel/core](https://github.com/babel/babel/tree/HEAD/packages/babel-core) | `7.26.7` | `7.26.8` | | [@babel/plugin-transform-async-generator-functions](https://github.com/babel/babel/tree/HEAD/packages/babel-plugin-transform-async-generator-functions) | `7.25.9` | `7.26.8` | | [@wdio/cli](https://github.com/webdriverio/webdriverio/tree/HEAD/packages/wdio-cli) | `9.7.2` | `9.8.0` | | [@wdio/local-runner](https://github.com/webdriverio/webdriverio/tree/HEAD/packages/wdio-local-runner) | `9.7.2` | `9.8.0` | | [@wdio/mocha-framework](https://github.com/webdriverio/webdriverio/tree/HEAD/packages/wdio-mocha-framework) | `9.7.2` | `9.7.3` | | [@wdio/sauce-service](https://github.com/webdriverio/webdriverio/tree/HEAD/packages/wdio-sauce-service) | `9.7.2` | `9.8.0` | | [@wdio/spec-reporter](https://github.com/webdriverio/webdriverio/tree/HEAD/packages/wdio-spec-reporter) | `9.6.3` | `9.8.0` | | [webdriverio](https://github.com/webdriverio/webdriverio/tree/HEAD/packages/webdriverio) | `9.7.2` | `9.8.0` | | [@babel/types](https://github.com/babel/babel/tree/HEAD/packages/babel-types) | `7.26.7` | `7.26.8` | | [postcss-selector-parser](https://github.com/postcss/postcss-selector-parser) | `7.0.0` | `7.1.0` | Updates `@eslint/js` from 9.19.0 to 9.20.0 - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md) - [Commits](https://github.com/eslint/eslint/commits/v9.20.0/packages/js) Updates `@nx/js` from 20.3.3 to 20.4.2 - [Release notes](https://github.com/nrwl/nx/releases) - [Commits](https://github.com/nrwl/nx/commits/20.4.2/packages/js) Updates `@swc/core` from 1.10.12 to 1.10.15 - [Release notes](https://github.com/swc-project/swc/releases) - [Changelog](https://github.com/swc-project/swc/blob/main/CHANGELOG.md) - [Commits](swc-project/swc@v1.10.12...v1.10.15) Updates `@types/node` from 22.13.0 to 22.13.1 - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/node) Updates `@vitest/eslint-plugin` from 1.1.25 to 1.1.27 - [Release notes](https://github.com/vitest-dev/eslint-plugin-vitest/releases) - [Commits](vitest-dev/eslint-plugin-vitest@v1.1.25...v1.1.27) Updates `eslint` from 9.19.0 to 9.20.0 - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md) - [Commits](eslint/eslint@v9.19.0...v9.20.0) Updates `nx` from 20.3.3 to 20.4.2 - [Release notes](https://github.com/nrwl/nx/releases) - [Commits](https://github.com/nrwl/nx/commits/20.4.2/packages/nx) Updates `rollup` from 4.34.1 to 4.34.6 - [Release notes](https://github.com/rollup/rollup/releases) - [Changelog](https://github.com/rollup/rollup/blob/master/CHANGELOG.md) - [Commits](rollup/rollup@v4.34.1...v4.34.6) Updates `terser` from 5.37.0 to 5.38.1 - [Changelog](https://github.com/terser/terser/blob/master/CHANGELOG.md) - [Commits](terser/terser@v5.37.0...v5.38.1) Updates `typescript-eslint` from 8.22.0 to 8.23.0 - [Release notes](https://github.com/typescript-eslint/typescript-eslint/releases) - [Changelog](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/typescript-eslint/CHANGELOG.md) - [Commits](https://github.com/typescript-eslint/typescript-eslint/commits/v8.23.0/packages/typescript-eslint) Updates `@babel/core` from 7.26.7 to 7.26.8 - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.26.8/packages/babel-core) Updates `@babel/plugin-transform-async-generator-functions` from 7.25.9 to 7.26.8 - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.26.8/packages/babel-plugin-transform-async-generator-functions) Updates `@wdio/cli` from 9.7.2 to 9.8.0 - [Release notes](https://github.com/webdriverio/webdriverio/releases) - [Changelog](https://github.com/webdriverio/webdriverio/blob/main/CHANGELOG.md) - [Commits](https://github.com/webdriverio/webdriverio/commits/v9.8.0/packages/wdio-cli) Updates `@wdio/local-runner` from 9.7.2 to 9.8.0 - [Release notes](https://github.com/webdriverio/webdriverio/releases) - [Changelog](https://github.com/webdriverio/webdriverio/blob/main/CHANGELOG.md) - [Commits](https://github.com/webdriverio/webdriverio/commits/v9.8.0/packages/wdio-local-runner) Updates `@wdio/mocha-framework` from 9.7.2 to 9.7.3 - [Release notes](https://github.com/webdriverio/webdriverio/releases) - [Changelog](https://github.com/webdriverio/webdriverio/blob/main/CHANGELOG.md) - [Commits](https://github.com/webdriverio/webdriverio/commits/v9.7.3/packages/wdio-mocha-framework) Updates `@wdio/sauce-service` from 9.7.2 to 9.8.0 - [Release notes](https://github.com/webdriverio/webdriverio/releases) - [Changelog](https://github.com/webdriverio/webdriverio/blob/main/CHANGELOG.md) - [Commits](https://github.com/webdriverio/webdriverio/commits/v9.8.0/packages/wdio-sauce-service) Updates `@wdio/spec-reporter` from 9.6.3 to 9.8.0 - [Release notes](https://github.com/webdriverio/webdriverio/releases) - [Changelog](https://github.com/webdriverio/webdriverio/blob/main/CHANGELOG.md) - [Commits](https://github.com/webdriverio/webdriverio/commits/v9.8.0/packages/wdio-spec-reporter) Updates `webdriverio` from 9.7.2 to 9.8.0 - [Release notes](https://github.com/webdriverio/webdriverio/releases) - [Changelog](https://github.com/webdriverio/webdriverio/blob/main/CHANGELOG.md) - [Commits](https://github.com/webdriverio/webdriverio/commits/v9.8.0/packages/webdriverio) Updates `@babel/types` from 7.26.7 to 7.26.8 - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.26.8/packages/babel-types) Updates `postcss-selector-parser` from 7.0.0 to 7.1.0 - [Release notes](https://github.com/postcss/postcss-selector-parser/releases) - [Changelog](https://github.com/postcss/postcss-selector-parser/blob/master/CHANGELOG.md) - [Commits](postcss/postcss-selector-parser@v7.0.0...v7.1.0) --- updated-dependencies: - dependency-name: "@eslint/js" dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: "@nx/js" dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: "@swc/core" dependency-type: direct:development update-type: version-update:semver-patch dependency-group: theoretically-non-breaking - dependency-name: "@types/node" dependency-type: direct:development update-type: version-update:semver-patch dependency-group: theoretically-non-breaking - dependency-name: "@vitest/eslint-plugin" dependency-type: direct:development update-type: version-update:semver-patch dependency-group: theoretically-non-breaking - dependency-name: eslint dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: nx dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: rollup dependency-type: direct:development update-type: version-update:semver-patch dependency-group: theoretically-non-breaking - dependency-name: terser dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: typescript-eslint dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: "@babel/core" dependency-type: direct:production update-type: version-update:semver-patch dependency-group: theoretically-non-breaking - dependency-name: "@babel/plugin-transform-async-generator-functions" dependency-type: direct:production update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: "@wdio/cli" dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: "@wdio/local-runner" dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: "@wdio/mocha-framework" dependency-type: direct:development update-type: version-update:semver-patch dependency-group: theoretically-non-breaking - dependency-name: "@wdio/sauce-service" dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: "@wdio/spec-reporter" dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: webdriverio dependency-type: direct:development update-type: version-update:semver-minor dependency-group: theoretically-non-breaking - dependency-name: "@babel/types" dependency-type: direct:production update-type: version-update:semver-patch dependency-group: theoretically-non-breaking - dependency-name: postcss-selector-parser dependency-type: direct:production update-type: version-update:semver-minor dependency-group: theoretically-non-breaking ... Signed-off-by: dependabot[bot] <[email protected]> * chore: downgrade nx --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Will Harney <[email protected]> * chore: bump nx (#5207) * chore: bump nx last time dependabot tried, nx caused issues * chore(nx): downgrade to 20.4.0 * chore: add logging to see why tree shaking is weird on CI * chore: un-exclude LWC it doesn't have build/dev scripts, so won't get picked up and recent bug in NX causes --exclude=lwc to exclude all packages * chore: revert test change to scripts * fix(ssr): make internals non-configurable (#5208) * fix(ssr): make internals non-configurable * test(ssr): add check that internals are safe * chore: remove rogue file * chore: use correct file extension for test output * fix: provide template prop on LightningElement in SSRv2 (#5212) * chore: release v8.13.2 (#5213) * fix(rollup-plugin): remove default modules (#5203) * build(deps): bump koa from 2.15.3 to 2.15.4 (#5220) Bumps [koa](https://github.com/koajs/koa) from 2.15.3 to 2.15.4. - [Release notes](https://github.com/koajs/koa/releases) - [Changelog](https://github.com/koajs/koa/blob/2.15.4/History.md) - [Commits](koajs/koa@2.15.3...2.15.4) --- updated-dependencies: - dependency-name: koa dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * feat(ssr): add LWC version comment to end of compiled template (#5218) * chore: rename ephemeral placeholder variable (#5210) * chore: don't use custom test timeout for fixtures (#5221) * test(engine-server): clean up fixture tests (#5219) * test(engine-server): remove `feature` feature it's unused * chore: remove feature from types * chore(tests): remove unused exports from tests * chore: rename x/test modules to x/static * chore: use static x-test for root fixture component tag name (x-test) may not match directory name of root component * chore: remove tag name that is no longer used * refactor(test): destructure! * chore: `fixture-test` feels better than `x-test` to make it more clear it's special * chore: reintroduce locker logic (#5217) * chore: reintroduce locker logic * Update packages/@lwc/integration-karma/test/component/LightningElement/index.spec.js Co-authored-by: Will Harney <[email protected]> * Update packages/@lwc/engine-core/src/framework/invoker.ts Co-authored-by: Will Harney <[email protected]> --------- Co-authored-by: Will Harney <[email protected]> * test(fixtures): eradicate `index.js` (#5222) * refactor: create rollup plugin for virtual modules * test(fixtures): refactor fixture config defs to individual files they're not actually shared * test(fixtures): update to use config.json instead of index.js * chore: eradicate index.js * chore: fix file extension * chore: oops forgot this part * chore: release v8.13.3 (#5223) * chore: release v8.13.4 * chore: release v8.13.3 * fix: corrections, v1/2 pathing, expected failures * chore: variable rename --------- Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: Dale Bustad <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Will Harney <[email protected]> Co-authored-by: Will Harney <[email protected]> Co-authored-by: Matheus Cardoso <[email protected]>
salesforce · Feb 18, 2025 · 34c7522 · 34c7522
1 parent d1202eb
commit 34c7522
Show file tree

Hide file tree

Showing 3 changed files with 79 additions and 22 deletions.
diff --git a/.github/workflows/karma.yml b/.github/workflows/karma.yml
@@ -178,6 +178,11 @@ jobs:
             - run: DISABLE_STATIC_CONTENT_OPTIMIZATION=1 DISABLE_SYNTHETIC=1 yarn sauce:ci
             - run: NODE_ENV_FOR_TEST=production yarn sauce:ci
             - run: NODE_ENV_FOR_TEST=production DISABLE_SYNTHETIC=1 yarn sauce:ci
+            - run: yarn hydration:sauce:ci:engine-server
+            - run: ENABLE_SYNTHETIC_SHADOW_IN_HYDRATION=1 yarn hydration:sauce:ci:engine-server
+            - run: NODE_ENV_FOR_TEST=production yarn hydration:sauce:ci:engine-server
+            - run: DISABLE_NATIVE_CUSTOM_ELEMENT_LIFECYCLE=1 yarn hydration:sauce:ci:engine-server
+            - run: DISABLE_STATIC_CONTENT_OPTIMIZATION=1 yarn hydration:sauce:ci:engine-server
             - run: yarn hydration:sauce:ci
             - run: ENABLE_SYNTHETIC_SHADOW_IN_HYDRATION=1 yarn hydration:sauce:ci
             - run: NODE_ENV_FOR_TEST=production yarn hydration:sauce:ci

diff --git a/packages/@lwc/integration-karma/package.json b/packages/@lwc/integration-karma/package.json
@@ -5,6 +5,10 @@
     "scripts": {
         "start": "KARMA_MODE=watch karma start ./scripts/karma-configs/test/local.js",
         "test": "karma start ./scripts/karma-configs/test/local.js --single-run --browsers ChromeHeadless",
+        "hydration:start:engine-server": "ENGINE_SERVER=true KARMA_MODE=watch karma start ./scripts/karma-configs/hydration/local.js",
+        "hydration:test:engine-server": "ENGINE_SERVER=true karma start ./scripts/karma-configs/hydration/local.js --single-run --browsers ChromeHeadless",
+        "hydration:sauce:engine-server": "ENGINE_SERVER=true karma start ./scripts/karma-configs/hydration/sauce.js --single-run",
+        "hydration:sauce:ci:engine-server": "ENGINE_SERVER=true ../../../scripts/ci/retry.sh karma start ./scripts/karma-configs/hydration/sauce.js --single-run",
         "hydration:start": "KARMA_MODE=watch karma start ./scripts/karma-configs/hydration/local.js",
         "hydration:test": "karma start ./scripts/karma-configs/hydration/local.js --single-run --browsers ChromeHeadless",
         "hydration:sauce": "karma start ./scripts/karma-configs/hydration/sauce.js --single-run",

diff --git a/packages/@lwc/integration-karma/scripts/karma-plugins/hydration-tests.js b/packages/@lwc/integration-karma/scripts/karma-plugins/hydration-tests.js
@@ -4,16 +4,29 @@
  * SPDX-License-Identifier: MIT
  * For full license text, see the LICENSE file in the repo root or https://opensource.org/licenses/MIT
  */
+const ENGINE_SERVER = process.env.ENGINE_SERVER;
 const path = require('node:path');
 const vm = require('node:vm');
 const fs = require('node:fs/promises');
 const { format } = require('node:util');
 const { rollup } = require('rollup');
 const lwcRollupPlugin = require('@lwc/rollup-plugin');
-const ssr = require('@lwc/engine-server');
+const ssr = ENGINE_SERVER ? require('@lwc/engine-server') : require('@lwc/ssr-runtime');
 const { DISABLE_STATIC_CONTENT_OPTIMIZATION } = require('../shared/options');
 const Watcher = require('./Watcher');
 
+/*
+ * These are hydration tests that currently fail in ssr-compiler (V2)
+ * They need to be removed from this list and then fixed. There are only 4
+ * so kept here for now.
+ */
+const EXPECTED_V2_FAILURES = [
+    'mismatches/host-mutation-in-connected-callback/class-mutated-attr-mismatch',
+    'mismatches/host-mutation-in-connected-callback/class',
+    'directives/lwc-dynamic',
+    'inner-outer-html',
+];
+
 const context = {
     LWC: ssr,
     moduleOutput: null,
@@ -54,13 +67,12 @@ async function exists(path) {
     }
 }
 
-let cache;
-
-async function getCompiledModule(dirName) {
+async function getCompiledModule(dirName, compileForSSR) {
     const bundle = await rollup({
         input: path.join(dirName, 'x', COMPONENT_UNDER_TEST, `${COMPONENT_UNDER_TEST}.js`),
         plugins: [
             lwcRollupPlugin({
+                targetSSR: !!compileForSSR,
                 modules: [
                     {
                         dir: dirName,
@@ -74,9 +86,8 @@ async function getCompiledModule(dirName) {
                 enableStaticContentOptimization: !DISABLE_STATIC_CONTENT_OPTIMIZATION,
             }),
         ],
-        cache,
 
-        external: ['lwc', 'test-utils', '@test/loader'], // @todo: add ssr modules for test-utils and @test/loader
+        external: ['lwc', '@lwc/ssr-runtime', 'test-utils', '@test/loader'], // @todo: add ssr modules for test-utils and @test/loader
 
         onwarn(warning, warn) {
             // Ignore warnings from our own Rollup plugin
@@ -87,13 +98,13 @@ async function getCompiledModule(dirName) {
     });
 
     const { watchFiles } = bundle;
-    cache = bundle.cache;
 
     const { output } = await bundle.generate({
         format: 'iife',
         name: 'Main',
         globals: {
             lwc: 'LWC',
+            '@lwc/ssr-runtime': 'LWC',
             'test-utils': 'TestUtils',
         },
     });
@@ -131,25 +142,30 @@ function throwOnUnexpectedConsoleCalls(runnable) {
 }
 
 /**
- * @param {string} moduleCode
- * @param {string} testConfig
- * @param {string} filename
+ * This is the function that takes SSR bundle code and test config, constructs a script that will
+ * run in a separate JS runtime environment with its own global scope. The `context` object
+ * (defined at the top of this file) is passed in as the global scope for that script. The script
+ * runs, utilizing the `LWC` object that we've attached to the global scope, it sets a
+ * new value (the rendered markup) to the globalThis.moduleOutput, which correspond to
+ * context.moduleOutput in the hydration-test.js module scope.
+ *
+ * So, script runs, generates markup, & we get that markup out and return it to Karma for use
+ * in client-side tests.
  */
-function getSsrCode(moduleCode, testConfig, filename) {
+async function getSsrCode(moduleCode, testConfig, filename) {
     const script = new vm.Script(
         `
         ${testConfig};
         config = config || {};
         ${moduleCode};
-        moduleOutput = LWC.renderComponent('x-${COMPONENT_UNDER_TEST}-${guid++}', Main, config.props || {});`,
+        moduleOutput = LWC.renderComponent('x-${COMPONENT_UNDER_TEST}-${guid++}', Main, config.props || {}, 'sync');`,
         { filename }
     );
 
     throwOnUnexpectedConsoleCalls(() => {
         vm.createContext(context);
         script.runInContext(context);
     });
-
     return context.moduleOutput;
 }
 
@@ -160,7 +176,6 @@ async function getTestModuleCode(input) {
     });
 
     const { watchFiles } = bundle;
-    cache = bundle.cache;
 
     const { output } = await bundle.generate({
         format: 'iife',
@@ -194,33 +209,66 @@ function createHCONFIG2JSPreprocessor(config, logger, emitter) {
     return async (_content, file, done) => {
         const filePath = file.path;
         const suiteDir = path.dirname(filePath);
+
         // Wrap all the tests into a describe block with the file stricture name
         const describeTitle = path.relative(basePath, suiteDir).split(path.sep).join(' ');
 
         try {
             const { code: testCode, watchFiles: testWatchFiles } =
                 await getTestModuleCode(filePath);
-            const { code: componentDef, watchFiles: componentWatchFiles } =
-                await getCompiledModule(suiteDir);
+
             // You can add an `.only` file alongside an `index.spec.js` file to make it `fdescribe()`
             const onlyFileExists = await existsUp(suiteDir, '.only');
+            // If V2 failure is expected, skip it.
+            const v2FailureExpected =
+                !ENGINE_SERVER && EXPECTED_V2_FAILURES.some((dir) => suiteDir.includes(dir));
+
+            let describe = onlyFileExists ? 'fdescribe' : 'describe';
+
+            const { code: componentDefCSR, watchFiles: componentWatchFilesCSR } =
+                await getCompiledModule(suiteDir, false);
+
+            let ssrOutput;
+            /* eslint-disable vitest/no-conditional-tests */
+            if (ENGINE_SERVER) {
+                // engine-server uses the same def as the client
+                watcher.watchSuite(filePath, testWatchFiles.concat(componentWatchFilesCSR));
+                ssrOutput = await getSsrCode(
+                    componentDefCSR,
+                    testCode,
+                    path.join(suiteDir, 'ssr.js')
+                );
+            } else if (!v2FailureExpected) {
+                // ssr-compiler has it's own def
+                const { code: componentDefSSR, watchFiles: componentWatchFilesSSR } =
+                    await getCompiledModule(suiteDir, true);
+                watcher.watchSuite(
+                    filePath,
+                    testWatchFiles.concat(componentWatchFilesCSR).concat(componentWatchFilesSSR)
+                );
+                ssrOutput = await getSsrCode(
+                    componentDefSSR.replace(`process.env.NODE_ENV === 'test-karma-lwc'`, 'true'),
+                    testCode,
+                    path.join(suiteDir, 'ssr.js')
+                );
+            } else {
+                console.log(`Expected failure for ${suiteDir}, skipping`);
+                describe = 'xdescribe';
+            }
+            /* eslint-enable vitest/no-conditional-tests */
 
-            const ssrOutput = getSsrCode(componentDef, testCode, path.join(suiteDir, 'ssr.js'));
-
-            watcher.watchSuite(filePath, testWatchFiles.concat(componentWatchFiles));
             const newContent = format(
                 TEMPLATE,
                 JSON.stringify(ssrOutput),
-                componentDef,
+                componentDefCSR,
                 testCode,
-                onlyFileExists ? 'fdescribe' : 'describe',
+                describe,
                 JSON.stringify(describeTitle)
             );
             done(null, newContent);
         } catch (error) {
             const location = path.relative(basePath, filePath);
             log.error('Error processing “%s”\n\n%s\n', location, error.stack || error.message);
-
             done(error, null);
         }
     };