Package using UMD to make it work in a Typescript/Webpack project

[dkowis]

I think this will fix #93. It worked in my local angular 8 project

Changed the library type to UMD.

libraryTarget: 'umd' - This exposes your library under all the module
definitions, allowing it to work with CommonJS, AMD and as global
variable.

from https://webpack.js.org/configuration/output/#outputlibrarytarget

[CLAassistant]

All committers have signed the CLA.

[dkowis]

Should I include the built min.js files and such?

[dkowis]

Just to include the example code I'm using it in in typescript:

import {Injectable} from '@angular/core';
import {Jose} from 'jose-jwe-jws'
import {from, Observable, of} from "rxjs";
import {catchError, flatMap, map, tap} from "rxjs/operators";

@Injectable({
  providedIn: 'root'
})
export class TokenService {

  token: string;

  constructor() {
  }

  validateToken(pubkey: ECPubkey): Observable<boolean> {
    const cryptographer = new Jose.WebCryptographer();
    console.log(`Token: ${this.token}`);

    // REF: https://auth0.com/docs/jwks
    // and the Square Library: https://github.com/square/js-jose

    return of(this.token).pipe(
      map(token => {
        return new Jose.JoseJWS.Verifier(cryptographer, token)
      }),
      flatMap(verifier => {
        return from(verifier.addRecipient(pubkey)).pipe(
          map(() => verifier)
        );
      }),
      flatMap(verifier => {
        console.log("Going to verify!");
        return from(verifier.verify());
      }),
      map(verificationResult => {
        console.log("VERIFIED: ", verificationResult)
        return true;
      }),
      catchError(() => of(false))
    );
  }
}

export interface ECPubkey extends IJsonWebKey {
}

[dkowis]

Okay, sadly it doesn't quite seem to work. I got past one error, originally it died here:

        return new Jose.JoseJWS.Verifier(cryptographer, token)

Now it's dying at:

        return from(verifier.addRecipient(key)).pipe(

with the same "Jose is not defined" ...

[dkowis]

But it was failing to verify with "signature alg does not match" so something worked. I had to modify to use "ES512" in the webcryptographer. So it's able to pick up some stuff.

[dkowis]

Without specifying the right signature algorithm, I die at the same spot in the flow, but with a very different error:

[dkowis]

I suspect it's dying here: https://github.com/square/js-jose/blob/master/lib/jose-jwe-webcryptographer.js#L322 when the WebCryptographer is trying to reference Jose again.

[dkowis]

I think the problem is that although webpack will package it as UMD allowing the use of either variable or module, you can't do both at the same time. Typescript is loading it as a module, and so the internal global variable reference does not work.

[dkowis]

Honestly, I don't think this would be too difficult to write in Typescript proper, and then publish a proper module. Is that an okay conversion for the project? There's not a whole lot of code, and it could be directly ported to typescript with just time, and then a bit of restructuring. It would probably necessitate a 2.0 release, however, because it would break existing interface (module vs variable).

[mbyczkowski]

@dkowis thanks for taking this on and investigating this issue! I've spent some time looking into this problem, but haven't quite got time recently to focus on it.

You've mentioned quite a few issues, so here's what I've been thinking (and I should probably open it up as an issue, so we can track these):

1. I'd like to get rid off global var references and make modules as self-contained as possible.
2. It would be great if we migrated the entire project to TypeScript.
3. Improve unit and integration tests.
4. the project is in 0.x release cycle, so we can create breaking changes and call it 0.3 without breaking SemVer.
5. I'd like to clean-up Travis CI and build releases on CI, not on devs' laptops.
6. I'd like to release this package under @square namespace (so maybe @square/jose?)
7. I'd like to review the API, get some feedback and make changes that we can then call as 1.0.

If you'd like to tackle any of these (however big or small), I'd be happy to chat and review the code.

[dkowis]

I think all that makes sense, and I think I'm going down an ugly rabbit hole making random tweaks and hacks to make it work. I created #126 out of your comment. I might hack at it a bit longer, because I feel like it's just "one more hack" to get signature validation to work :)

But then I'll throw this on my backlog, it seems like a good way to git gud at TypeScript, which I need to do! Thanks!

[dkowis]

Okay, so this actually does work. I was able to get it working in my angular/typescript project to verify a ES512 pubkey. I figure I should probably re-open this anyway, since it might help someone else until we can get around to the bigger plans.

[dkowis]

Well, it works fine in chrome, firefox is still upset, but doesn't have very good error messages either. And it's not the fault of the code or the library, it's more like the ec pubkey format is wrong for the webncryptoapi, unrelated to the pull request's problem.