Running test using PhantomJS is failing with RC.0 #5065

daBishMan · 2017-02-27T16:21:58Z

Please provide us with the following information:

OS?

Windows 10.

Versions.

Please run ng --version. If there's nothing outputted, please run in a Terminal: node --version and paste the result here:

@angular/cli: 1.0.0-rc.0
node: 7.5.0
os: win32 x64
@angular/common: 2.4.8
@angular/compiler: 2.4.8
@angular/core: 2.4.8
@angular/forms: 2.4.8
@angular/http: 2.4.8
@angular/platform-browser: 2.4.8
@angular/platform-browser-dynamic: 2.4.8
@angular/router: 3.4.8
@angular/cli: 1.0.0-rc.0
@angular/compiler-cli: 2.4.8

Repro steps.

Was this an app that wasn't created using the CLI? What change did you do on your code? etc.
Running tests using PhantomJS fails, while running the same tests using Chrome passes.

$ ng test -browsers PhantomJS
27 02 2017 09:16:38.148:WARN [karma]: No captured browser, open http://localhost:9876/
27 02 2017 09:16:38.158:INFO [karma]: Karma v1.4.1 server started at http://0.0.0.0:9876/
27 02 2017 09:16:38.158:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
27 02 2017 09:16:38.614:INFO [launcher]: Starting browser PhantomJS
27 02 2017 09:16:42.636:INFO [PhantomJS 2.1.1 (Windows 8 0.0.0)]: Connected on socket FxslPlobVmqXyCu-AAAA with id 90654741
PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
SyntaxError: Use of reserved word 'class'
at webpack:///src/app/shared/models/search-params.model.ts:4:0 <- src/test.ts:6252
PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
SyntaxError: Use of reserved word 'class'
at webpack:///src/app/shared/models/search-params.model.ts:4:0 <- src/test.ts:6252

PhantomJS 2.1.1 (Windows 8 0.0.0): Executed 0 of 0 ERROR (0.862 secs / 0 secs)

Chrome 56.0.2924 (Windows 10 0.0.0): Executed 291 of 291 SUCCESS (10.092 secs / 9.985 secs)
TOTAL: 291 SUCCESS

The log given by the failure.

Normally this include a stack trace and some more information.
$ ng test -browsers PhantomJS
27 02 2017 09:16:38.148:WARN [karma]: No captured browser, open http://localhost:9876/
27 02 2017 09:16:38.158:INFO [karma]: Karma v1.4.1 server started at http://0.0.0.0:9876/
27 02 2017 09:16:38.158:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
27 02 2017 09:16:38.614:INFO [launcher]: Starting browser PhantomJS
27 02 2017 09:16:42.636:INFO [PhantomJS 2.1.1 (Windows 8 0.0.0)]: Connected on socket FxslPlobVmqXyCu-AAAA with id 90654741
PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
SyntaxError: Use of reserved word 'class'
at webpack:///src/app/shared/models/search-params.model.ts:4:0 <- src/test.ts:6252
PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR
SyntaxError: Use of reserved word 'class'
at webpack:///src/app/shared/models/search-params.model.ts:4:0 <- src/test.ts:6252

Mention any other details that might be useful.

This only happens if you are running using PhantomJS

Thanks! We'll be in touch soon.

The text was updated successfully, but these errors were encountered:

daBishMan · 2017-02-27T19:42:53Z

The issue is the new tsconfig.spec.json, what gets generated for a brand new project is:

{
"compilerOptions": {
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"es2016"
],
"outDir": "../out-tsc/spec",
"module": "commonjs",
"target": "es6",
"baseUrl": "",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts"
],
"include": [
"**/*.spec.ts"
]
}
`

to get it to run with PhantomJS and Chrome I made the following changes:

{
"compilerOptions": {
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [
"es2016",
"dom"
],
"outDir": "../out-tsc/spec",
"module": "commonjs",
"target": "es5",
"baseUrl": "",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts"
],
"include": [
"**/*.spec.ts"
]
}

I had to add, "dom" to the lib.
and I change the target to "es5" instead of "es6"

hope this helps someone.

Is these changes by design? or is PhantomJS is not intended to work with the CLI?

royling · 2017-02-28T09:24:43Z

Beside the above change @daBishMan made, I also modified polyfills.ts to include all es6 polyfills (i.e. core-js/es6/*, by default those are not included.) to get it work.

DjolePetrovic · 2017-02-28T19:01:39Z

Weird, I did what you guys did, but I still get this error:
PhantomJS 2.1.1 (Windows 8 0.0.0) ERROR SyntaxError: Unexpected token 'const' at webpack:///~/@angular/core/@angular/core/testing.es5.js:10:0 <- src/test.ts:7712

Any ideas? There is another Thread here which is kind of similar.

royling · 2017-03-01T01:39:01Z

@DjolePetrovic I assume you are using angular v4.x (ng new --ng4). If so, there is the issue with the build process as you already linked - angular/angular#14730.

DjolePetrovic · 2017-03-01T09:10:24Z

@royling Yes, that's correct. Well at least I've moved my old project to CLI rc0 and angular 4 rc1.

OClement · 2017-03-02T15:20:16Z

Having the same issue here, using @angualr/cli@1.0.0-rc.0 and @angular/*@4.0.0-rc.1

Also have:

...
"karma-phantomjs-launcher": "^1.0.2",
"phantomjs-prebuilt": "^2.1.14",
...

Enabled all imports in polyfills.ts, tried adding this file to Karma's file array

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  SyntaxError: Use of reserved word 'class'
  at webpack:///~/@angular/platform-browser-dynamic/@angular/platform-browser-dynamic/testing.es5.js:11:0 <- src/test.ts:24962

Not sure where to go from there?
Edit: Forgot to mention, I don't have a tsconfig.spec.json file anywhere after updating to Cli 1.0.0-rc.0

Creating it manually with the content posted above by @daBishMan didn't help

gamesover · 2017-03-07T16:07:06Z

If I have another monitor, I never mind using Chrome:) The sad story is I only have one monitor for my laptop, so I changed my test browser to phantomjs but meet the same issue as @DjolePetrovic . My system is Angular 2 + ts 2.0. Thank you, @daBishMan and @royling , after I applied both your methods now it could pass npm test without any issue.

DjolePetrovic · 2017-03-07T16:57:44Z

My problem got solved with angular 4 rc2. Update the version and try again.

filipesilva · 2017-03-14T12:43:32Z

Fixed by #5255

justincrosbiehaventec · 2017-05-17T03:48:45Z

Hi, I'm experiencing this issue, on latest angular-cli and angular 4, with latest PhantomJS. I have tried setting "target": "es5" etc in tsconfig.spec.json etc, nothing works.

Any advice, or is this a regression? Let me know if I should open a new issue.

UPDATE: Seems to be an issue with referencing dependent packages by their built JS. The fails are in custom npm packages I'm maintaining. If I specifically reference the .TS source rather than the built JS in the packages in my import statements, the problem goes away.

Thanks,
Justin

badcodelab · 2018-02-09T16:44:18Z

Hi,
getting this issue with @angular/cli 1.6.8 and @angular 5.2.3 and IE 11
tsconfig.spec.ts has es5 as a target

UPDATE:
I use ng cli for test only in my lib project so .angular-cli.json has the following structure:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "project": { "ejected": true },
  "apps": [{
      "root": "src",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "testTsconfig": "tsconfig.spec.json"
   }]
}

My src folder had only tsconfig.spec.json and that make ng cli generate es2015 bundles.
I've added tsconfig.app.json to src folder and bundles and issue has gone away.
Pretty strange behaviour.

angular-automatic-lock-bot · 2019-09-07T22:41:42Z

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

Meligy mentioned this issue Feb 28, 2017

Ng Test throws PhantomJS Linux Webpack DI Error #5078

Closed

m0t0r mentioned this issue Mar 2, 2017

Karma unit tests fail with Angular 4 and older browsers #5185

Closed

filipesilva closed this as completed Mar 14, 2017

angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 7, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Running test using PhantomJS is failing with RC.0 #5065

Running test using PhantomJS is failing with RC.0 #5065

daBishMan commented Feb 27, 2017

Please provide us with the following information:

daBishMan commented Feb 27, 2017 •

edited

Loading

royling commented Feb 28, 2017 •

edited

Loading

DjolePetrovic commented Feb 28, 2017

royling commented Mar 1, 2017

DjolePetrovic commented Mar 1, 2017

OClement commented Mar 2, 2017 •

edited

Loading

gamesover commented Mar 7, 2017 •

edited

Loading

DjolePetrovic commented Mar 7, 2017

filipesilva commented Mar 14, 2017

justincrosbiehaventec commented May 17, 2017 •

edited

Loading

badcodelab commented Feb 9, 2018 •

edited

Loading

angular-automatic-lock-bot bot commented Sep 7, 2019

Running test using PhantomJS is failing with RC.0 #5065

Running test using PhantomJS is failing with RC.0 #5065

Comments

daBishMan commented Feb 27, 2017

Please provide us with the following information:

OS?

Versions.

Repro steps.

The log given by the failure.

Mention any other details that might be useful.

daBishMan commented Feb 27, 2017 • edited Loading

royling commented Feb 28, 2017 • edited Loading

DjolePetrovic commented Feb 28, 2017

royling commented Mar 1, 2017

DjolePetrovic commented Mar 1, 2017

OClement commented Mar 2, 2017 • edited Loading

gamesover commented Mar 7, 2017 • edited Loading

DjolePetrovic commented Mar 7, 2017

filipesilva commented Mar 14, 2017

justincrosbiehaventec commented May 17, 2017 • edited Loading

badcodelab commented Feb 9, 2018 • edited Loading

angular-automatic-lock-bot bot commented Sep 7, 2019

daBishMan commented Feb 27, 2017 •

edited

Loading

royling commented Feb 28, 2017 •

edited

Loading

OClement commented Mar 2, 2017 •

edited

Loading

gamesover commented Mar 7, 2017 •

edited

Loading

justincrosbiehaventec commented May 17, 2017 •

edited

Loading

badcodelab commented Feb 9, 2018 •

edited

Loading