Merge pull request #779 from mozilla/edgy

implemented crypto polyfills for ms edge

app/main.js

@@ -1,10 +1,10 @@
+import 'fast-text-encoding'; // MS Edge support
 import 'fluent-intl-polyfill';
 import app from './routes';
 import locale from '../common/locales';
 import fileManager from './fileManager';
 import dragManager from './dragManager';
 import { canHasSend } from './utils';
-import assets from '../common/assets';
 import storage from './storage';
 import metrics from './metrics';
 import experiments from './experiments';
@@ -30,10 +30,7 @@ app.use((state, emitter) => {
     ) {
       unsupportedReason = 'outdated';
     }
-    if (/edge\/\d+/i.test(navigator.userAgent)) {
+    const ok = await canHasSend();
-      unsupportedReason = 'edge';
-    }
-    const ok = await canHasSend(assets.get('cryptofill.js'));
     if (!ok) {
       unsupportedReason = /firefox/i.test(navigator.userAgent)
         ? 'outdated'

app/utils.js

@@ -25,7 +25,7 @@ function loadShim(polyfill) {
   });
 }
 
-async function canHasSend(polyfill) {
+async function canHasSend() {
   try {
     const key = await window.crypto.subtle.generateKey(
       {
@@ -35,7 +35,6 @@ async function canHasSend(polyfill) {
       true,
       ['encrypt', 'decrypt']
     );
-
     await window.crypto.subtle.encrypt(
       {
         name: 'AES-GCM',
@@ -45,9 +44,23 @@ async function canHasSend(polyfill) {
       key,
       new ArrayBuffer(8)
     );
+    await window.crypto.subtle.importKey(
+      'raw',
+      window.crypto.getRandomValues(new Uint8Array(16)),
+      'PBKDF2',
+      false,
+      ['deriveKey']
+    );
+    await window.crypto.subtle.importKey(
+      'raw',
+      window.crypto.getRandomValues(new Uint8Array(16)),
+      'HKDF',
+      false,
+      ['deriveKey']
+    );
     return true;
   } catch (err) {
-    return loadShim(polyfill);
+    return false;
   }
 }
 
@@ -167,6 +180,7 @@ module.exports = {
   copyToClipboard,
   arrayToB64,
   b64ToArray,
+  loadShim,
   canHasSend,
   isFile,
   openLinksInNewTab

package-lock.json

@@ -417,6 +417,12 @@
       "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=",
       "dev": true
     },
+    "asmcrypto.js": {
+      "version": "0.22.0",
+      "resolved": "https://registry.npmjs.org/asmcrypto.js/-/asmcrypto.js-0.22.0.tgz",
+      "integrity": "sha512-usgMoyXjMbx/ZPdzTSXExhMPur2FTdz/Vo5PVx2gIaBcdAAJNOFlsdgqveM8Cff7W0v+xrf9BwjOV26JSAF9qA==",
+      "dev": true
+    },
     "asn1": {
       "version": "0.1.11",
       "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.1.11.tgz",
@@ -4501,6 +4507,12 @@
       "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=",
       "dev": true
     },
+    "fast-text-encoding": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/fast-text-encoding/-/fast-text-encoding-1.0.0.tgz",
+      "integrity": "sha512-R9bHCvweUxxwkDwhjav5vxpFvdPGlVngtqmx4pIZfSUhM/Q4NiIUHB456BAf+Q1Nwu3HEZYONtu+Rya+af4jiQ==",
+      "dev": true
+    },
     "fastparse": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.1.tgz",

package.json

@@ -54,6 +54,7 @@
     "node": ">=8.2.0"
   },
   "devDependencies": {
+    "asmcrypto.js": "^0.22.0",
     "babel-core": "^6.26.0",
     "babel-loader": "^7.1.3",
     "babel-plugin-istanbul": "^4.1.5",
@@ -74,6 +75,7 @@
     "expose-loader": "^0.7.4",
     "extract-loader": "^1.0.2",
     "extract-text-webpack-plugin": "^3.0.2",
+    "fast-text-encoding": "^1.0.0",
     "file-loader": "^1.1.9",
     "fluent-intl-polyfill": "^0.1.0",
     "git-rev-sync": "^1.10.0",

server/layout.js

@@ -69,6 +69,7 @@ module.exports = function(state, body = '') {
     <script defer src="${assets.get('runtime.js')}"></script>
     <script defer src="${assets.get('vendor.js')}"></script>
     <script defer src="${locales.get(state.locale)}"></script>
+    <script defer src="${assets.get('cryptofill.js')}"></script>
     <script defer src="${assets.get('app.js')}"></script>
   </head>
   ${body}

test/frontend/index.js

@@ -7,7 +7,7 @@ function kv(f) {
 
 module.exports = function() {
   const files = fs.readdirSync(path.join(__dirname, 'tests'));
-  const code = files.map(kv).join(';\n');
+  const code = "require('fast-text-encoding');\n" + files.map(kv).join(';\n');
   return {
     code,
     dependencies: files.map(f => require.resolve('./tests/' + f)),

test/frontend/routes.js

@@ -29,6 +29,7 @@ module.exports = function(app) {
           })
           </script>
           <script src="/jsconfig.js"></script>
+          <script src="${assets.get('cryptofill.js')}"></script>
           <script src="${assets.get('runtime.js')}"></script>
           <script src="${assets.get('vendor.js')}"></script>
           <script src="${assets.get('tests.js')}"></script>

test/frontend/tests/crypto-tests.js

@@ -0,0 +1,122 @@
+import assert from 'assert';
+import { arrayToB64, b64ToArray } from '../../../app/utils';
+
+describe('webcrypto', function() {
+  it('can do it', async function() {
+    const encoder = new TextEncoder();
+    const x = b64ToArray('SPIfAlwbnncIFw3hEHYihw');
+    const a = await crypto.subtle.importKey('raw', x, 'PBKDF2', false, [
+      'deriveKey'
+    ]);
+
+    const ad = await crypto.subtle.deriveKey(
+      {
+        name: 'PBKDF2',
+        salt: encoder.encode('metadata'),
+        iterations: 100,
+        hash: 'SHA-256'
+      },
+      a,
+      {
+        name: 'AES-GCM',
+        length: 128
+      },
+      false,
+      ['encrypt', 'decrypt']
+    );
+
+    const ae = await crypto.subtle.encrypt(
+      {
+        name: 'AES-GCM',
+        iv: new Uint8Array(12),
+        tagLength: 128
+      },
+      ad,
+      encoder.encode('hello world!')
+    );
+
+    assert.equal(
+      arrayToB64(new Uint8Array(ae)),
+      'UXQQ4yVf55TRk9AZtz5QCwFofRvh-HdWJyxSCQ'
+    );
+
+    const ah = await crypto.subtle.deriveKey(
+      {
+        name: 'PBKDF2',
+        salt: encoder.encode('authentication'),
+        iterations: 100,
+        hash: 'SHA-256'
+      },
+      a,
+      {
+        name: 'HMAC',
+        hash: { name: 'SHA-256' }
+      },
+      true,
+      ['sign']
+    );
+    const ahx = await crypto.subtle.exportKey('raw', ah);
+    assert.equal(
+      arrayToB64(new Uint8Array(ahx)),
+      'wxXDmHgmMgrcDVD8zbDLRl2yNa8jSAQgsaeIBZ4vueygpxzaTK6ZE_6X-XHvllBly6pSuFNbSxcve0ZHhVdcEA'
+    );
+    // const jwk = await crypto.subtle.exportKey('jwk', ah)
+    // console.error(jwk)
+    const as = await crypto.subtle.sign(
+      {
+        name: 'HMAC'
+      },
+      ah,
+      encoder.encode('test')
+    );
+    assert.equal(
+      arrayToB64(new Uint8Array(as)),
+      'AOi4HcoCJxQ4nUYxlmHB1rlcxQBn-zVjrSHz-VW7S-I'
+    );
+
+    const b = await crypto.subtle.importKey('raw', x, 'HKDF', false, [
+      'deriveKey'
+    ]);
+    const bd = await crypto.subtle.deriveKey(
+      {
+        name: 'HKDF',
+        salt: new Uint8Array(),
+        info: encoder.encode('encryption'),
+        hash: 'SHA-256'
+      },
+      b,
+      {
+        name: 'AES-GCM',
+        length: 128
+      },
+      true,
+      ['encrypt', 'decrypt']
+    );
+    const bdx = await crypto.subtle.exportKey('raw', bd);
+
+    assert.equal(arrayToB64(new Uint8Array(bdx)), 'g7okjWWO9yueDz16-owShQ');
+
+    const bh = await crypto.subtle.deriveKey(
+      {
+        name: 'HKDF',
+        salt: new Uint8Array(),
+        info: encoder.encode('authentication'),
+        hash: 'SHA-256'
+      },
+      b,
+      {
+        name: 'HMAC',
+        hash: { name: 'SHA-256' }
+      },
+      true,
+      ['sign']
+    );
+
+    const bhx = await crypto.subtle.exportKey('raw', bh);
+
+    assert.equal(
+      arrayToB64(new Uint8Array(bhx)),
+      'TQOGtmQ8-ZfnWu6Iq-U1IAVBVREFuI17xqsW1shiC8eMCa-a5qeYTvoX3-5kCoCha8R59ycnPDnTz75clLBmbQ'
+    );
+  });
+});

webpack.config.js

@@ -192,6 +192,7 @@ module.exports = {
   ],
   devServer: {
     compress: true,
+    host: '0.0.0.0',
     before: IS_DEV ? require('./server/dev') : undefined
   }
 };