test(karma): fix karma tests

test/karma/package.json

@@ -5,7 +5,7 @@
   "types": "test-dist/types/components.d.ts",
   "collection": "test-dist/collection/collection-manifest.json",
   "scripts": {
-    "build.app": "node ../../bin/stencil build --debug",
+    "build.app": "node ../../bin/stencil build --debug --es5",
     "build.prerender": "node ../../bin/stencil build --config test-prerender/stencil.config-prerender.ts --prerender --debug && node test-prerender/no-script-build.js",
     "build.sibling": "node ../../bin/stencil build --config test-sibling/stencil.config.ts --debug",
     "karma": "karma start karma.config.js",
@@ -14,34 +14,32 @@
     "karma.prod": "npm run tsc && npm run build.sibling && npm run build.app && npm run karma.webpack && npm run build.prerender && karma start karma.config.js",
     "karma.ie": "karma start karma.config.js --browsers=IE --single-run=false",
     "karma.edge": "karma start karma.config.js --browsers=Edge --single-run=false",
-    "karma.webpack": "webpack --config test-app/esm-webpack/webpack.config.js",
+    "karma.webpack": "webpack-cli --config test-app/esm-webpack/webpack.config.js",
     "start": "node ../../bin/stencil build --dev --watch --serve --es5",
     "tsc": "node ../../node_modules/typescript/lib/tsc -p tsconfig.json"
   },
   "devDependencies": {
     "@stencil/less": "^1.0.0",
     "@stencil/postcss": "^1.0.1",
-    "@stencil/sass": "^1.3.1",
-    "@stencil/stylus": "^1.0.0",
-    "bootstrap": "^4.4.1",
-    "jasmine-core": "^3.4.0",
-    "karma": "^4.1.0",
-    "karma-browserstack-launcher": "^1.5.1",
+    "@stencil/sass": "^1.3.2",
+    "@stencil/stylus": "^1.0.1",
+    "bootstrap": "^4.5.1",
+    "jasmine-core": "^3.6.0",
+    "karma": "^5.1.1",
+    "karma-browserstack-launcher": "^1.6.0",
     "karma-chrome-launcher": "^3.1.0",
     "karma-edge-launcher": "^0.4.2",
     "karma-firefox-launcher": "^1.3.0",
     "karma-ie-launcher": "^1.0.0",
-    "karma-jasmine": "^3.1.1",
+    "karma-jasmine": "^3.3.1",
     "karma-polyfill": "^1.1.0",
     "karma-safari-launcher": "^1.0.0",
-    "karma-typescript": "^5.0.1",
+    "karma-typescript": "^5.0.3",
     "normalize.css": "^8.0.1",
-    "puppeteer": "^2.1.1",
     "rollup-plugin-node-builtins": "^2.1.2",
     "rollup-plugin-node-globals": "^1.4.0",
     "rollup-plugin-node-polyfills": "^0.1.2",
-    "webpack": "^4.42.1",
-    "webpack-cli": "^3.3.11",
+    "webpack-cli": "^3.3.12",
     "workbox-build": "4.3.1"
   }
 }

test/karma/stencil.config.ts

@@ -12,18 +12,18 @@ export const config: Config = {
   tsconfig: 'tsconfig-stencil.json',
   outputTargets: [
     {
-      type: 'www'
+      type: 'www',
+      copy: [
+        { src: '**/*.html' },
+        { src: '**/*.css' },
+        { src: 'noscript.js' }
+      ],
     },
     {
       type: 'dist',
       dir: 'test-dist'
     }
   ],
-  copy: [
-    { src: '**/*.html' },
-    { src: '**/*.css' },
-    { src: 'noscript.js' }
-  ],
   globalScript: 'test-app/global.ts',
   globalStyle: 'test-app/style-plugin/global-sass-entry.scss',
   plugins: [
@@ -33,10 +33,16 @@ export const config: Config = {
     postcss(),
     stylus()
   ],
+  buildEs5: true,
   extras: {
     appendChildSlotFix: true,
     cloneNodeFix: true,
+    cssVarsShim: true,
+    dynamicImportShim: true,
     lifecycleDOMEvents: true,
+    safari10: true,
+    scriptDataOpts: true,
+    shadowDomShim: true,
     slotChildNodesFix: true,
   },
   devServer: {

test/karma/test-app/components.d.ts

@@ -93,8 +93,6 @@ export namespace Components {
     }
     interface FactoryJsx {
     }
-    interface IePolyfills {
-    }
     interface ImageImport {
     }
     interface InitCssRoot {
@@ -475,12 +473,6 @@ declare global {
         prototype: HTMLFactoryJsxElement;
         new (): HTMLFactoryJsxElement;
     };
-    interface HTMLIePolyfillsElement extends Components.IePolyfills, HTMLStencilElement {
-    }
-    var HTMLIePolyfillsElement: {
-        prototype: HTMLIePolyfillsElement;
-        new (): HTMLIePolyfillsElement;
-    };
     interface HTMLImageImportElement extends Components.ImageImport, HTMLStencilElement {
     }
     var HTMLImageImportElement: {
@@ -1010,7 +1002,6 @@ declare global {
         "external-import-b": HTMLExternalImportBElement;
         "external-import-c": HTMLExternalImportCElement;
         "factory-jsx": HTMLFactoryJsxElement;
-        "ie-polyfills": HTMLIePolyfillsElement;
         "image-import": HTMLImageImportElement;
         "init-css-root": HTMLInitCssRootElement;
         "input-basic-root": HTMLInputBasicRootElement;
@@ -1180,8 +1171,6 @@ declare namespace LocalJSX {
     }
     interface FactoryJsx {
     }
-    interface IePolyfills {
-    }
     interface ImageImport {
     }
     interface InitCssRoot {
@@ -1419,7 +1408,6 @@ declare namespace LocalJSX {
         "external-import-b": ExternalImportB;
         "external-import-c": ExternalImportC;
         "factory-jsx": FactoryJsx;
-        "ie-polyfills": IePolyfills;
         "image-import": ImageImport;
         "init-css-root": InitCssRoot;
         "input-basic-root": InputBasicRoot;
@@ -1539,7 +1527,6 @@ declare module "@stencil/core" {
             "external-import-b": LocalJSX.ExternalImportB & JSXBase.HTMLAttributes<HTMLExternalImportBElement>;
             "external-import-c": LocalJSX.ExternalImportC & JSXBase.HTMLAttributes<HTMLExternalImportCElement>;
             "factory-jsx": LocalJSX.FactoryJsx & JSXBase.HTMLAttributes<HTMLFactoryJsxElement>;
-            "ie-polyfills": LocalJSX.IePolyfills & JSXBase.HTMLAttributes<HTMLIePolyfillsElement>;
             "image-import": LocalJSX.ImageImport & JSXBase.HTMLAttributes<HTMLImageImportElement>;
             "init-css-root": LocalJSX.InitCssRoot & JSXBase.HTMLAttributes<HTMLInitCssRootElement>;
             "input-basic-root": LocalJSX.InputBasicRoot & JSXBase.HTMLAttributes<HTMLInputBasicRootElement>;