chore: remove compat support (BREAKING CHANGE) (#3586)

salesforce · Jun 27, 2023 · 5495668 · 5495668
1 parent 0d85c64
commit 5495668
Show file tree

Hide file tree

Showing 27 changed files with 366 additions and 1,673 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -326,19 +326,6 @@ jobs:
           working_directory: packages/@lwc/integration-tests
 
 
-  test_integration_compat:
-    executor: node
-    environment:
-      SAUCE_TUNNEL_ID: lwc_<< pipeline.id	>>_test_integration_compat
-    steps:
-      - load_workspace
-      - start_sauce_connect
-      - retry_command:
-          command_name: Run integration test - IE11 SauceLabs
-          command: yarn sauce:prod_compat --browsers ie11
-          working_directory: packages/@lwc/integration-tests
-
-
 # Workflows definition
 workflows:
   version: 2
@@ -372,12 +359,6 @@ workflows:
           requires:
             - test_unit
 
-      - test_integration_compat:
-          filters:
-            <<: *ignore_forks
-          requires:
-            - test_unit
-
       - test_benchmark_smoke:
           filters:
             <<: *ignore_forks
@@ -427,11 +408,3 @@ workflows:
           requires:
             - test_unit
             - test_karma
-
-      - test_integration_compat:
-          context: lwc-sauce-labs
-          filters:
-            <<: *only_forks
-          requires:
-            - test_unit
-            - test_karma
diff --git a/package.json b/package.json
@@ -26,13 +26,7 @@
         "test:performance:best:ci": "nx test:best:ci @lwc/perf-benchmarks",
         "release:version": "./scripts/release/version.js"
     },
-    "//": {
-        "@babel/helper-explode-assignable-expression": "required for rollup-plugin-compat"
-    },
     "devDependencies": {
-        "@babel/core": "^7.22.5",
-        "@babel/helper-explode-assignable-expression": "^7.18.6",
-        "@babel/preset-env": "^7.22.5",
         "@commitlint/cli": "^17.6.5",
         "@lwc/eslint-plugin-lwc-internal": "link:./scripts/eslint-plugin",
         "@lwc/jest-utils-lwc-internals": "link:./scripts/jest/utils",
@@ -48,7 +42,6 @@
         "@typescript-eslint/parser": "^5.59.11",
         "bytes": "^3.1.2",
         "es-module-lexer": "^1.3.0",
-        "es5-proxy-compat": "^0.22.4",
         "eslint": "^8.42.0",
         "eslint-plugin-import": "^2.27.5",
         "eslint-plugin-jest": "^27.1.7",
@@ -64,7 +57,6 @@
         "nx": "16.3.2",
         "prettier": "^2.8.8",
         "rollup": "^3.25.1",
-        "rollup-plugin-compat": "^0.22.4",
         "terser": "^5.18.0",
         "ts-jest": "^29.1.0",
         "tslib": "^2.5.3",

diff --git a/packages/@lwc/integration-karma/package.json b/packages/@lwc/integration-karma/package.json
@@ -30,7 +30,6 @@
         "karma-coverage": "^2.2.0",
         "karma-jasmine": "^4.0.2",
         "karma-sauce-launcher": "^4.3.6",
-        "magic-string": "^0.30.0",
-        "whatwg-fetch": "^3.6.2"
+        "magic-string": "^0.30.0"
     }
 }
diff --git a/packages/@lwc/integration-karma/scripts/karma-configs/hydration/base.js b/packages/@lwc/integration-karma/scripts/karma-configs/hydration/base.js
@@ -8,18 +8,17 @@
 'use strict';
 
 const path = require('path');
-const { getModulePath } = require('lwc');
 
 const karmaPluginHydrationTests = require('../../karma-plugins/hydration-tests');
 const karmaPluginEnv = require('../../karma-plugins/env');
-const karmaPluginNodeEnv = require('../../karma-plugins/node-env');
+const karmaPluginTransformFramework = require('../../karma-plugins/transform-framework.js');
 const { GREP, COVERAGE } = require('../../shared/options');
 const { createPattern } = require('../utils');
 
 const BASE_DIR = path.resolve(__dirname, '../../../test-hydration');
 const COVERAGE_DIR = path.resolve(__dirname, '../../../coverage');
 
-const LWC_ENGINE = getModulePath('engine-dom', 'iife', 'es2017', 'dev');
+const LWC_ENGINE = require.resolve('@lwc/engine-dom/dist/index.js');
 
 const TEST_UTILS = require.resolve('../../../helpers/test-utils');
 const TEST_SETUP = require.resolve('../../../helpers/test-setup');
@@ -53,16 +52,21 @@ module.exports = (config) => {
         // Transform all the spec files with the hydration-tests karma plugin.
         preprocessors: {
             '**/*.spec.js': ['hydration-tests'],
-            // Transform all framework files with the node-env plugin
-            [LWC_ENGINE]: ['node-env'],
+            // Transform all framework files with the transform-framework plugin
+            [LWC_ENGINE]: ['transform-framework'],
         },
 
         // Use the env plugin to inject the right environment variables into the app
         // Use jasmine as test framework for the suite.
         frameworks: ['env', 'jasmine'],
 
         // Specify what plugin should be registered by Karma.
-        plugins: ['karma-jasmine', karmaPluginHydrationTests, karmaPluginEnv, karmaPluginNodeEnv],
+        plugins: [
+            'karma-jasmine',
+            karmaPluginHydrationTests,
+            karmaPluginEnv,
+            karmaPluginTransformFramework,
+        ],
 
         // Leave the reporter empty on purpose. Extending configuration need to pick the right reporter they want
         // to use.

diff --git a/packages/@lwc/integration-karma/scripts/karma-configs/test/base.js b/packages/@lwc/integration-karma/scripts/karma-configs/test/base.js
@@ -8,39 +8,26 @@
 'use strict';
 
 const path = require('path');
-const { getModulePath } = require('lwc');
 
 const karmaPluginLwc = require('../../karma-plugins/lwc');
 const karmaPluginEnv = require('../../karma-plugins/env');
-const karmaPluginNodeEnv = require('../../karma-plugins/node-env');
-const { COMPAT, SYNTHETIC_SHADOW_ENABLED, GREP, COVERAGE } = require('../../shared/options');
+const karmaPluginTransformFramework = require('../../karma-plugins/transform-framework.js');
+const { SYNTHETIC_SHADOW_ENABLED, GREP, COVERAGE } = require('../../shared/options');
 const { createPattern } = require('../utils');
 const TAGS = require('./tags');
 
 const BASE_DIR = path.resolve(__dirname, '../../../test');
 const COVERAGE_DIR = path.resolve(__dirname, '../../../coverage');
 
-const SYNTHETIC_SHADOW = getModulePath('synthetic-shadow', 'iife', 'es2017', 'dev');
-const SYNTHETIC_SHADOW_COMPAT = getModulePath('synthetic-shadow', 'iife', 'es5', 'dev');
-const LWC_ENGINE = getModulePath('engine-dom', 'iife', 'es2017', 'dev');
-const LWC_ENGINE_COMPAT = getModulePath('engine-dom', 'iife', 'es5', 'dev');
-const WIRE_SERVICE = getModulePath('wire-service', 'iife', 'es2017', 'dev');
-const WIRE_SERVICE_COMPAT = getModulePath('wire-service', 'iife', 'es5', 'dev');
+const SYNTHETIC_SHADOW = require.resolve('@lwc/synthetic-shadow/dist/index.js');
+const LWC_ENGINE = require.resolve('@lwc/engine-dom/dist/index.js');
+const WIRE_SERVICE = require.resolve('@lwc/wire-service/dist/index.js');
 
-const POLYFILL_COMPAT = require.resolve('es5-proxy-compat/polyfills.js');
-const FETCH_COMPAT = require.resolve('whatwg-fetch'); // not included in es5-proxy-compat polyfills
 const TEST_UTILS = require.resolve('../../../helpers/test-utils');
 const WIRE_SETUP = require.resolve('../../../helpers/wire-setup');
 const TEST_SETUP = require.resolve('../../../helpers/test-setup');
 
-const ALL_FRAMEWORK_FILES = [
-    SYNTHETIC_SHADOW,
-    SYNTHETIC_SHADOW_COMPAT,
-    LWC_ENGINE,
-    LWC_ENGINE_COMPAT,
-    WIRE_SERVICE,
-    WIRE_SERVICE_COMPAT,
-];
+const ALL_FRAMEWORK_FILES = [SYNTHETIC_SHADOW, LWC_ENGINE, WIRE_SERVICE];
 
 // Fix Node warning about >10 event listeners ("Possible EventEmitter memory leak detected").
 // This is due to the fact that we are running so many simultaneous rollup commands
@@ -51,19 +38,11 @@ process.setMaxListeners(1000);
 function getFiles() {
     const frameworkFiles = [];
 
-    if (COMPAT) {
-        frameworkFiles.push(createPattern(POLYFILL_COMPAT));
-        frameworkFiles.push(createPattern(FETCH_COMPAT));
-        frameworkFiles.push(createPattern(SYNTHETIC_SHADOW_COMPAT));
-        frameworkFiles.push(createPattern(LWC_ENGINE_COMPAT));
-        frameworkFiles.push(createPattern(WIRE_SERVICE_COMPAT));
-    } else {
-        if (SYNTHETIC_SHADOW_ENABLED) {
-            frameworkFiles.push(createPattern(SYNTHETIC_SHADOW));
-        }
-        frameworkFiles.push(createPattern(LWC_ENGINE));
-        frameworkFiles.push(createPattern(WIRE_SERVICE));
+    if (SYNTHETIC_SHADOW_ENABLED) {
+        frameworkFiles.push(createPattern(SYNTHETIC_SHADOW));
     }
+    frameworkFiles.push(createPattern(LWC_ENGINE));
+    frameworkFiles.push(createPattern(WIRE_SERVICE));
     frameworkFiles.push(createPattern(WIRE_SETUP));
     frameworkFiles.push(createPattern(TEST_SETUP));
 
@@ -86,16 +65,18 @@ module.exports = (config) => {
         preprocessors: {
             // Transform all the spec files with the lwc karma plugin.
             '**/*.spec.js': ['lwc'],
-            // Transform all framework files with the node-env plugin
-            ...Object.fromEntries(ALL_FRAMEWORK_FILES.map((file) => [file, ['node-env']])),
+            // Transform all framework files
+            ...Object.fromEntries(
+                ALL_FRAMEWORK_FILES.map((file) => [file, ['transform-framework']])
+            ),
         },
 
         // Use the env plugin to inject the right environment variables into the app
         // Use jasmine as test framework for the suite.
         frameworks: ['env', 'jasmine'],
 
         // Specify what plugin should be registered by Karma.
-        plugins: ['karma-jasmine', karmaPluginLwc, karmaPluginEnv, karmaPluginNodeEnv],
+        plugins: ['karma-jasmine', karmaPluginLwc, karmaPluginEnv, karmaPluginTransformFramework],
 
         // Leave the reporter empty on purpose. Extending configuration need to pick the right reporter they want
         // to use.
@@ -111,9 +92,9 @@ module.exports = (config) => {
     // The code coverage is only enabled when the flag is passed since it makes debugging the engine code harder.
     if (COVERAGE) {
         // Indicate to Karma to instrument the code to gather code coverage.
-        config.preprocessors[COMPAT ? LWC_ENGINE_COMPAT : LWC_ENGINE].push('coverage');
-        config.preprocessors[COMPAT ? WIRE_SERVICE_COMPAT : WIRE_SERVICE].push('coverage');
-        config.preprocessors[COMPAT ? SYNTHETIC_SHADOW_COMPAT : SYNTHETIC_SHADOW].push('coverage');
+        config.preprocessors[LWC_ENGINE].push('coverage');
+        config.preprocessors[WIRE_SERVICE].push('coverage');
+        config.preprocessors[SYNTHETIC_SHADOW].push('coverage');
 
         config.reporters.push('coverage');
         config.plugins.push('karma-coverage');

diff --git a/packages/@lwc/integration-karma/scripts/karma-configs/test/sauce.js b/packages/@lwc/integration-karma/scripts/karma-configs/test/sauce.js
@@ -51,26 +51,25 @@ const SAUCE_BROWSERS = [
 
     // Compat browsers
     {
-        label: 'sl_ie11',
-        browserName: 'internet explorer',
-        version: '11',
+        label: 'sl_edge_compat',
+        browserName: 'MicrosoftEdge',
+        version: '18',
         compat: true,
         nativeShadowCompatible: false,
     },
     {
         label: 'sl_chrome_compat',
         browserName: 'chrome',
-        version: '59',
+        version: 'latest-2',
         compat: true,
-        nativeShadowCompatible: false,
+        nativeShadowCompatible: true,
     },
     {
         label: 'sl_safari_compat',
         browserName: 'safari',
-        version: '10',
-        platform: 'OS X 10.11',
+        version: '13',
         compat: true,
-        nativeShadowCompatible: false,
+        nativeShadowCompatible: true,
     },
 ].filter((browser) => {
     return (

diff --git a/packages/@lwc/integration-karma/scripts/karma-plugins/lwc.js b/packages/@lwc/integration-karma/scripts/karma-plugins/lwc.js
@@ -15,9 +15,8 @@ const path = require('path');
 
 const { rollup } = require('rollup');
 const lwcRollupPlugin = require('@lwc/rollup-plugin');
-const compatRollupPlugin = require('rollup-plugin-compat');
 
-const { COMPAT, DISABLE_SYNTHETIC_SHADOW_SUPPORT_IN_COMPILER } = require('../shared/options');
+const { DISABLE_SYNTHETIC_SHADOW_SUPPORT_IN_COMPILER } = require('../shared/options');
 const Watcher = require('./Watcher');
 
 function createPreprocessor(config, emitter, logger) {
@@ -57,16 +56,6 @@ function createPreprocessor(config, emitter, logger) {
             }),
         ];
 
-        if (COMPAT) {
-            plugins.push(
-                compatRollupPlugin({
-                    // The compat polyfills are injected at runtime by Karma, polyfills can be shared between all the
-                    // suites.
-                    polyfills: false,
-                })
-            );
-        }
-
         try {
             const bundle = await rollup({
                 input,

diff --git a/packages/@lwc/integration-karma/scripts/karma-plugins/node-env.js b/packages/@lwc/integration-karma/scripts/karma-plugins/node-env.js