fix: merge master

Author: jhefferman-sfdc

packages/@lwc/integration-not-karma/configs/base.js

@@ -29,6 +29,7 @@ export default {
     // time out before they receive focus. But it also makes the full suite take 3x longer to run...
     // Potential workaround: https://github.com/modernweb-dev/web/issues/2588
     concurrency: 1,
+    browserLogs: false,
     nodeResolve: true,
     rootDir: join(import.meta.dirname, '..'),
     plugins: [

packages/@lwc/integration-not-karma/configs/integration.js

@@ -5,16 +5,7 @@ import testPlugin from './plugins/serve-integration.js';
 /** @type {import("@web/test-runner").TestRunnerConfig} */
 export default {
     ...baseConfig,
-    files: [
-        // FIXME: These tests are just symlinks to integration-karma for now so the git diff smaller
-        'test/**/*.spec.js',
-
-        // Logging mismatches
-        '!test/component/LightningElement.addEventListener/index.spec.js',
-
-        // Implement objectContaining / arrayWithExactContents
-        '!test/profiler/mutation-logging/index.spec.js',
-    ],
+    files: ['test/**/*.spec.js'],
     plugins: [
         ...baseConfig.plugins,
         importMapsPlugin({ inject: { importMap: { imports: { lwc: './mocks/lwc.js' } } } }),

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

@@ -1,6 +1,5 @@
 import path from 'node:path';
 import vm from 'node:vm';
-import fs from 'node:fs/promises';
 import { fileURLToPath } from 'node:url';
 import { rollup } from 'rollup';
 import lwcRollupPlugin from '@lwc/rollup-plugin';
@@ -21,16 +20,6 @@ const ROOT_DIR = path.join(import.meta.dirname, '../..');
 const COMPONENT_NAME = 'x-main';
 const COMPONENT_ENTRYPOINT = 'x/main/main.js';
 
-// Like `fs.existsSync` but async
-async function exists(path) {
-    try {
-        await fs.access(path);
-        return true;
-    } catch (_err) {
-        return false;
-    }
-}
-
 async function compileModule(input, targetSSR, format) {
     const modulesDir = path.join(ROOT_DIR, input.slice(0, -COMPONENT_ENTRYPOINT.length));
     const bundle = await rollup({
@@ -106,15 +95,6 @@ async function getSsrMarkup(componentEntrypoint, configPath) {
     return await script.runInContext(vm.createContext({ LWC: lwcSsr }));
 }
 
-async function existsUp(dir, file) {
-    while (true) {
-        if (await exists(path.join(dir, file))) return true;
-        dir = path.join(dir, '..');
-        const basename = path.basename(dir);
-        if (basename === '.') return false;
-    }
-}
-
 /**
  * Hydration test `index.spec.js` files are actually config files, not spec files.
  * This function wraps those configs in the test code to be executed.
@@ -129,8 +109,6 @@ async function wrapHydrationTest(configPath) {
 
         const suiteDir = path.dirname(configPath);
         const componentEntrypoint = path.join(suiteDir, COMPONENT_ENTRYPOINT);
-        // You can add an `.only` file alongside an `index.spec.js` file to make the test focused
-        const onlyFileExists = await existsUp(suiteDir, '.only');
         const ssrOutput = await getSsrMarkup(componentEntrypoint, configPath);
 
         return `
@@ -139,8 +117,7 @@ async function wrapHydrationTest(configPath) {
         runTest(
             '/${configPath}?original=1',
             '/${componentEntrypoint}',
-            ${JSON.stringify(ssrOutput) /* escape quotes */},
-            ${onlyFileExists}
+            ${JSON.stringify(ssrOutput) /* escape quotes */}
         );
         `;
     } finally {

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

@@ -32,12 +32,8 @@ const createRollupPlugin = (input, options) => {
         enableStaticContentOptimization: !DISABLE_STATIC_CONTENT_OPTIMIZATION,
         disableSyntheticShadowSupport: DISABLE_SYNTHETIC_SHADOW_SUPPORT_IN_COMPILER,
         apiVersion: API_VERSION,
-        modules: [
-            {
-                // Assume `ctx.path` is a component file, e.g. modules/x/foo/foo.js
-                dir: path.resolve(input, '../../..'),
-            },
-        ],
+        // Assume `ctx.path` is a component file, e.g. modules/x/foo/foo.js
+        modules: [{ dir: path.resolve(input, '../../..') }],
         ...options,
     });
 };
@@ -85,6 +81,8 @@ const transform = async (ctx) => {
         plugins: [customLwcRollupPlugin],
 
         external: [
+            '@vitest/expect',
+            '@vitest/spy',
             'lwc',
             'wire-service',
             // Some helper files export functions that mutate a global state. The setup file calls
@@ -120,6 +118,11 @@ export default {
     async serve(ctx) {
         if (ctx.path.endsWith('.spec.js')) {
             return await transform(ctx);
+        } else if (ctx.path === '/test_api_sanitizeAttribute') {
+            // The test in /test/api/sanitizeAttribute makes network requests
+            // The returned value doesn't matter; this is just to avoid
+            // unnecessary logging output
+            return '';
         }
     },
 };

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

@@ -1,5 +1,5 @@
+import { spyOn } from '@vitest/spy';
 import * as LWC from 'lwc';
-import { spyConsole } from '../../helpers/console';
 import { setHooks } from '../../helpers/hooks';
 
 setHooks({ sanitizeHtmlContent: (content) => content });
@@ -8,6 +8,28 @@ function parseStringToDom(html) {
     return Document.parseHTMLUnsafe(html).body.firstChild;
 }
 
+/**
+ * A much simplified version of the spies originally used for Karma.
+ * Should probably be eventually replaced with individual spies.
+ */
+export function spyConsole() {
+    const log = spyOn(console, 'log');
+    const warn = spyOn(console, 'warn');
+    const error = spyOn(console, 'error');
+    return {
+        calls: {
+            log: log.mock.calls,
+            warn: warn.mock.calls,
+            error: error.mock.calls,
+        },
+        reset() {
+            log.mockRestore();
+            warn.mockRestore();
+            error.mockRestore();
+        },
+    };
+}
+
 function appendTestTarget(ssrText) {
     const div = document.createElement('div');
     const testTarget = parseStringToDom(ssrText);
@@ -23,8 +45,7 @@ function setFeatureFlags(requiredFeatureFlags, value) {
 }
 
 // Must be sync to properly register tests; async behavior can happen in before/after blocks
-export function runTest(configPath, componentPath, ssrRendered, focused) {
-    const test = focused ? it.only : it;
+export function runTest(configPath, componentPath, ssrRendered) {
     const description = new URL(configPath, location.href).pathname;
     let consoleSpy;
     let testConfig;
@@ -48,7 +69,7 @@ export function runTest(configPath, componentPath, ssrRendered, focused) {
         setFeatureFlags(testConfig.requiredFeatureFlags, false);
     });
 
-    test(description, async () => {
+    it(description, async () => {
         const container = appendTestTarget(ssrRendered);
         const selector = container.firstChild.tagName.toLowerCase();
         let target = container.querySelector(selector);

packages/@lwc/integration-not-karma/helpers/console.js

@@ -36,7 +36,7 @@ function windowErrorListener(callback) {
 // 2) We're using native lifecycle callbacks, so the error is thrown asynchronously and can
 //    only be caught with window.addEventListener('error')
 //      - Note native lifecycle callbacks are all thrown asynchronously.
-function customElementCallbackReactionErrorListener(callback) {
+export function customElementCallbackReactionErrorListener(callback) {
     return lwcRuntimeFlags.DISABLE_NATIVE_CUSTOM_ELEMENT_LIFECYCLE
         ? directErrorListener(callback)
         : windowErrorListener(callback);

packages/@lwc/integration-not-karma/helpers/matchers/errors.js

@@ -19,11 +19,6 @@ export const registerJasmineMatchers = (chai, utils) => {
             // eslint-disable-next-line @typescript-eslint/no-unused-expressions
             chai.expect(value).to.be.true;
         },
-        toHaveBeenCalledOnceWith(...args) {
-            const spy = utils.flag(this, 'object');
-            chai.expect(spy.calls).to.have.length(1);
-            chai.expect(spy.calls[0]).to.deep.equal(args);
-        },
     };
 
     for (const [name, impl] of Object.entries(matchers)) {

packages/@lwc/integration-not-karma/helpers/matchers/jasmine.js

@@ -2,50 +2,6 @@
  * An as yet uncategorized mishmash of helpers, relics of Karma
  */
 
-// Listen for errors thrown directly by the callback
-function directErrorListener(callback) {
-    try {
-        callback();
-    } catch (error) {
-        return error;
-    }
-}
-
-// Listen for errors using window.addEventListener('error')
-function windowErrorListener(callback) {
-    let error;
-    function onError(event) {
-        event.preventDefault(); // don't log the error
-        error = event.error;
-    }
-
-    // Prevent jasmine from handling the global error. There doesn't seem to be another
-    // way to disable this behavior: https://github.com/jasmine/jasmine/pull/1860
-    const originalOnError = window.onerror;
-    window.onerror = null;
-    window.addEventListener('error', onError);
-
-    try {
-        callback();
-    } finally {
-        window.onerror = originalOnError;
-        window.removeEventListener('error', onError);
-    }
-    return error;
-}
-
-// For errors we expect to be thrown in the connectedCallback() phase
-// of a custom element, there are two possibilities:
-// 1) We're using non-native lifecycle callbacks, so the error is thrown synchronously
-// 2) We're using native lifecycle callbacks, so the error is thrown asynchronously and can
-//    only be caught with window.addEventListener('error')
-//      - Note native lifecycle callbacks are all thrown asynchronously.
-export function customElementCallbackReactionErrorListener(callback) {
-    return lwcRuntimeFlags.DISABLE_NATIVE_CUSTOM_ELEMENT_LIFECYCLE
-        ? directErrorListener(callback)
-        : windowErrorListener(callback);
-}
-
 export function extractDataIds(root) {
     const nodes = {};
 

packages/@lwc/integration-not-karma/helpers/utils.js

@@ -16,6 +16,7 @@
         "@lwc/synthetic-shadow": "8.22.3",
         "@types/chai": "^5.2.2",
         "@types/jasmine": "^5.1.9",
+        "@vitest/expect": "^3.2.4",
         "@vitest/spy": "^3.2.4",
         "@web/dev-server-import-maps": "^0.2.1",
         "@web/dev-server-rollup": "^0.6.4",