Fix QPS default method & add IE11 polyfills (#337)

.vscode/settings.json

@@ -4,7 +4,7 @@
         "Euroset",
         "QPS"
     ],
-    "typescript.tsdk": "node_modules/typescript/lib",
+    "typescript.tsdk": "./node_modules/typescript/lib",
     "prettier.configPath": ".prettierrc",
     "prettier.prettierPath": "node_modules/prettier",
     "editor.defaultFormatter": "esbenp.prettier-vscode",

package-lock.json

@@ -11247,6 +11247,21 @@
         }
       }
     },
+    "ts-polyfill": {
+      "version": "3.8.2",
+      "resolved": "https://registry.npmjs.org/ts-polyfill/-/ts-polyfill-3.8.2.tgz",
+      "integrity": "sha512-x0M4kx+FObO88sedZ1zld+YX+GvcgaYSVnHspNftI4GRT86FTBy41O89ztKfvue0XtaKpb8WBpPZsh82hy3Ncw==",
+      "requires": {
+        "core-js": "^3.6.4"
+      },
+      "dependencies": {
+        "core-js": {
+          "version": "3.6.5",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.6.5.tgz",
+          "integrity": "sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA=="
+        }
+      }
+    },
     "tslib": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.0.tgz",

package.json

@@ -62,6 +62,7 @@
     "redux-form": "~7.2.3",
     "redux-saga": "~0.16.0",
     "styled-components": "~4.1.1",
+    "ts-polyfill": "~3.8.2",
     "uri-template": "~1.0.1",
     "url-polyfill": "~1.0.11",
     "whatwg-fetch": "~2.0.3"

src/app/polyfills.ts

@@ -1,5 +1,3 @@
 import 'url-polyfill';
 import 'whatwg-fetch';
-import 'core-js/es6/promise';
-import 'core-js/es6/object';
-import 'core-js/es6/array';
+import 'ts-polyfill';

src/app/sagas/initialize-app/initialize-modal/to-initial-form.ts

@@ -8,9 +8,11 @@ import {
     MobileCommerceFormInfo,
     EurosetFormInfo,
     WalletFormInfo,
-    TokenProviderFormInfo
+    TokenProviderFormInfo,
+    QPSFormInfo
 } from 'checkout/state';
 import { BankCardTokenProvider } from 'checkout/backend/model';
+import { assertUnreachable } from 'checkout/utils';
 
 const resolveDefaultMethod = (defaultMethod: PaymentMethod): FormInfo => {
     switch (defaultMethod.name) {
@@ -18,6 +20,8 @@ const resolveDefaultMethod = (defaultMethod: PaymentMethod): FormInfo => {
             return new CardFormInfo();
         case PaymentMethodName.Euroset:
             return new EurosetFormInfo();
+        case PaymentMethodName.QPS:
+            return new QPSFormInfo();
         case PaymentMethodName.DigitalWallet:
             return new WalletFormInfo();
         case PaymentMethodName.ApplePay:
@@ -29,6 +33,7 @@ const resolveDefaultMethod = (defaultMethod: PaymentMethod): FormInfo => {
         case PaymentMethodName.MobileCommerce:
             return new MobileCommerceFormInfo();
         default:
+            assertUnreachable(defaultMethod.name);
             console.error(`${logPrefix} Unsupported initial form for method ${defaultMethod}`);
             return new CardFormInfo();
     }

src/app/utils/assert-unreachable.ts

@@ -0,0 +1,7 @@
+/**
+ * Very useful with switch-case for checking unreachable cases
+ * more info https://stackoverflow.com/questions/39419170/how-do-i-check-that-a-switch-block-is-exhaustive-in-typescript
+ */
+export function assertUnreachable(x: never) {
+    return x;
+}

src/app/utils/index.ts

@@ -11,3 +11,4 @@ export * from './amount';
 export * from './phone';
 export * from './split-by-first';
 export * from './is-contain-card-number';
+export * from './assert-unreachable';

tsconfig.json

@@ -3,11 +3,11 @@
         "outDir": "./dist/",
         "sourceMap": true,
         "noImplicitAny": true,
-        "moduleResolution": "node",
-        "module": "es2015",
-        "target": "es5",
+        "moduleResolution": "Node",
+        "module": "ES2015",
+        "target": "ES5",
         "jsx": "react",
-        "lib": ["es2015", "dom"],
+        "lib": ["ESNext", "DOM"],
         "baseUrl": ".",
         "paths": {
             "checkout/*": ["./src/app/*", "./src/locale/*"]