"browser" field in package.json

[LinusU]

How about adding a "browser" field to the package.json, and a small browser shim that simply re-exports window.crypto? That way you could write code that works in Node.js, and also seamlessly works with webpack/browserify/rollup in the browser.

I would be happy to submit a PR 🚀

[kevlened]

I published a really small shim as a workaround until browsers are supported here. I do have a few questions:

What are the supported browsers?
If you just export window.crypto you lose support for IE11 and old Safari versions (they have older, prefixed versions of webcrypto). By adding webcrypto-shim, you regain support at the cost of 3.8k min+gzipped.

Note: IE11 doesn't support elliptic curve or SHA512-based algos

What's the testing strategy?
It seems that the tests are tightly coupled to the node implementation. I haven't dug into how difficult it would be to generalize these. It may not even make sense to run these tests against the browser implementation.

[christiansmith]

There was never any intention to use this directly in browsers. Most browsers already support W3C Web Cryptography API sufficiently for our purposes (excepting algs like Ed25519, etc. which is apparently coming in 2.0). Where they don't, shims exist?

It's Node.js' maintainers that (to the detriment of the ecosystem, in my opinion) declined to consider implementing the standard. We wrote this package so that we could write webcrypto dependent code that runs both in the browser and on the server. In particular for packages such as these:

https://github.com/anvilresearch/jose
https://github.com/anvilresearch/oidc-rp

The support for webpack and browsers vs node is handled there ^, not in this package.

There is apparently a comprehensive official W3C test suite for browsers (tightly coupled to that environment) and we've considered porting it here. Bandwidth is currently an issue.

[LinusU]

There was never any intention to use this directly in browsers

Just to make my proposal very clear, I do not intend to run any of the code here in the browser.

What I want is to have a few packages intended for publishing to npm to be able to function both in browsers that have WebCrypto support and on Node.js.

Currently I would have to do something like this:

let webcrypto
if (typeof window === 'object' && typeof window.crypto === 'object') {
  webcrypto = window.crypto
} else {
  webcrypto = require('webcrypto')
}

// ...

and webpack/browserify would still probably not be able to understand that the require('crypto') branch will ever be hit, so it will probably bundle up all that code in the resulting bundle anyways.

What I want to be able to do is to just write const crypto = require('webcrypto') in my code, and that could be accomplished by the following small change to this package:

diff --git a/browser.js b/browser.js
new file mode 100644
index 0000000..a836487
--- /dev/null
+++ b/browser.js
@@ -0,0 +1 @@
+module.export = window.crypto

diff --git a/package.json b/package.json
index 9cdaaf6..33d1ca8 100644
--- a/package.json
+++ b/package.json
@@ -3,6 +3,7 @@
   "version": "0.8.3",
   "description": "WebCrypto API for Node.js",
   "main": "src/index.js",
+  "browser": "browser.js",
   "directories": {
     "test": "test"
   },

This will instruct browserify and webpack that this module is not intended for the browser, and that the result of requiring this module inside of the browser should just be window.crypto.

I hope this clears up this issue, the intention is not to try and port anything to the browser. But merely adding a small hint to bundlers that "hey, this package is only for Node.js, use window.crypto in the browser".