antonybudianto / angular-starter

:star: Gulp Angular Starter using TypeScript (Updated to 4.4.3)

Home Page:https://antonybudianto.github.io/angular-starter/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Can't find variable: require at node_modules/angular2-jwt/angular2-jwt.js

ovione opened this issue · comments

Issue Overview

Can't find variable: require at node_modules/angular2-jwt/angular2-jwt.js:

Issue Description

When I use angular2-jwt.ts in my code I can load everything with npm start but when I issue npm test then I have the error mentioned above.

I think its because npm start uses Systemjs to compile the ts modules but with karma its karma that uses the angular2-jwt.js (already compiled) from node modules furnished with angular2-jwt.
I think this angular2-jwt.js is loading modules in a way that karma doesn't understand.
Is there a way to tell karma how to load angular2-jwt.js ? otr is it because angular2-jwt.js has been compiled beforehand that karma doesn't understand ?

Reproducables

import angular2-jwt.ts in your projects and build with karma
include angular2-jwt.js in the files[] setcion of the karma.conf.js
and run npm test

Information

Operating System Ubuntu/
Node version 5.x
NPM Version 3.x
Environment Browser

thanks

https://github.com/antonybudianto/angular2-starter/wiki/FAQ#adding-new-js-libraries-like-lodash-etc-from-npm

try the last point and please don't include angular2-jwt.js in the files[] setcion of the karma.conf.js, I had created the routine for adding 3rd party libs for test

hi
thanks for the reply
what I have done exactly is:

1. system.config.js

var packages = {
    'angular2-jwt': {main: 'angular2-jwt.js', defaultExtension: 'js'},

var npmPackages = [
'angular2-jwt',

2. in my application .ts files where I use it

import {JwtHelper} from "angular2-jwt";

3. in karma.conf.js

like you mentioned I don't put the angular2-jwt.js in the files[] section.
but where do I add the angular2-jwt ? The last point in the FAQ also add the name in karma config file gives me a 404.

I tried to put it in

var dependencies = [
'angular2-jwt',

but that gives me a
Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:9876/core-js

as I said npm start works but npm test gives me now this error.

Sorry, I'd updated the link.
Please give a reproducable/repo.
The fact it worked when npm start, then it's test setup issue

thanks for your tips.

so I have put
1. in karma.conf.js

var dependencies = [
'angular2-jwt'
and then I add the error
Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:9876/core-js
If I read the stack trace there is a
Error loading http://localhost:9876/core-js as "core-js" from http://localhost:9876/node_modules/angular2-jwt/angular2-jwt.spec.js

Then I went into the node_modules/angular2-jwt and yes there are angular2-jwt.spec.js that tries to load core-js

When I delete those specs everything works well !!! npm start and npm test.

But now how do I ignore in our karma.conf.js the node_modules/angular2-jwt .spec files.

I tried
var files = [
createFilePattern('node_modules/angular2-jwt/' + '
/.spec.js', {included: false}),*

but this didn't do the trick.

I found the solution and that is in point 3.
karma.conf.js
configuration.files.push({
pattern: 'node_modules/angular2-jwt/angular2-jwt.js',
included: false,
watched: false
});

why ? because if I put it in the

  var dependencies = [
    'angular2-jwt'

it will try to load also the spec files that have a dependecny in core-js

We don't want to load spec files that have other dependencies.

So now everything npm start and npm test works.

But :) I consider this a workaround because if we have other dependencies with specs like angular2-jwt then we agai have to write the inclusion of the dependencies manually.
Then we will include some generic code to test this.

I think I'm happy with this soloution unless you ahve some remarks.

cheers
Ovidioo

I see, so it's trying to load 3rd party lib specs, for now it's a good workaround.
Thank you for reporting, I'll fix it soon. @ovione

Or maybe you can make a PR to fix the glob here :)
https://github.com/antonybudianto/angular2-starter/blob/master/config/test/karma.conf.js#L76