Support use of this library in frontend code
djmitche opened this issue · comments
It should be possible to use Hawk to authenticate requests from a browser.
The functionality that I want is that the library can be yarn add'd and imported just like any other library in a project that is then webpack'd for deployment.
This was possible until 7.1.0. But that was by an entirely separate implementation from the rest of the library, which was removed. That version did support direct inclusion in a page via <script .. /> element. It also required a bit of webpack config to get it to work.
As of 8.x, inclusion via webpack doesn't work because the library requires dgram and dns to support @hapi/sntp. Browsers can't use UDP (dgram) or directly resolve domain names (dns). #276 removed that requirement, but the library still uses Buffer and crypto without importing them, and just adding the library to a project (like taskcluster) causes build errors.
I'm not sure what is the best way to support this. To be honest, while I understand building libraries for use in Node, I don't really understand how libraries for use via webpack should be done. Should the library webpack itself and ship the result? Should that include polyfills? @eliperelman, do you have any advice?
@camd maybe you have some advice?
Hmm, this is a tough one. Treeherder uses version 7.1.0 still, which is probably why we didn't upgrade. And I would imagine if it doesn't work with Webpack, it won't work with Neutrino either, since that's Webpack based.
but the library still uses Buffer and crypto without importing them, and just adding the library to a project (like taskcluster) causes build errors.
Can you import Buffer and crypto in this library? Would that remove the build errors in taskcluster?
I'll admit I'm a little out of my wheelhouse on this as I haven't worked much with webpack. (Ed Morley did most of that in TH) But I'm interested in learning, so happy to lend a hand here.
IIRC, adding the imports doesn't totally fix the issue unless I also arrange for polyfilling in the consuming project (taskcluster in my case). I'm not sure if it's appropriate to publish a package and say "if you depend on this, even indirectly, in a webpacked project, you'll need to enable polyfilling", or if the library should be more self-sufficient than that.
Do you know of other libraries like this, which are usable both in and out of a browser, and which have nontrivial dependencies? An example to follow would be helpful..
IIRC, adding the imports doesn't totally fix the issue unless I also arrange for polyfilling in the consuming project (taskcluster in my case). I'm not sure if it's appropriate to publish a package and say "if you depend on this, even indirectly, in a webpacked project, you'll need to enable polyfilling", or if the library should be more self-sufficient than that.
Do you know of other libraries like this, which are usable both in and out of a browser, and which have nontrivial dependencies? An example to follow would be helpful..
Hmm, I'm sorry. I really don't know of an example like this.
Through a little bit of experimentation, I've discovered that webpack will use the browser property of package.json as the entry point, while node apps use the main property. So, I think we can set this up in such a way that some dedicated code is included in the webpacked version, but not in the node version.
I just set up an app with create-react-app, and used npm add ../path/to/hawk. It worked fine. Its webpack config pulls in the necessary browserify stuff. So maybe the lack of answers to "how do you make this work" is because "it just works" and perhaps Taskcluster itself is doing something wrong in this regard.
It does seem that the work to remove @hapi/sntp was necessary -- reverting back to the most recent release with the create-react-app test app does show issues (around use of private members in @hapi/teamwork).
...so I think this is a Taskcluster issue, not a hawk issue. I'll leave this open until I'm sure (at which point we can release 9.0.0)
I suspect this, in turn, requires taskcluster/taskcluster#4001.
In fact, #4006 is sufficient.