small medium large xlarge

Generic-user-small
05 May 2017, 03:02
steve fox (9 posts)

Hi,

Thanks for this book!

While running angular test in ch 7, I’m getting a failure to click_button “Log in”

Failures:

  1) angular test Our Angular Test App is Working
     Failure/Error: click_button "Log in"

     Capybara::Poltergeist::JavascriptError:
       One or more errors were raised in the Javascript code on the page. If you don't care about these errors, you can ignore them by setting js_errors: false in your Poltergeist configuration (see documentation for details).

The code works fine in the browser, and I’ve output the page.html, which corresponds to ~/devise/sessions/new.html.erb. Here’s the line from page.html that contains the log in button:

<input type="submit" name="commit" value="Log in" class="btn btn-primary btn-lg" data-disable-with="Log in">

Repo for this code should you need more info -> https://github.com/cheeby/shine2. I can post more, too. Just let me know.

Thanks,

Steve

Dmfcb_pragsmall
05 May 2017, 11:51
David Copeland (422 posts)

Can you post more about what you were executing and what the errror was?

When Poltergeist says there was a JavaScript error, it usually means there is some problem executing JavaScript so your HTML is never even rendered.

If you still have a javascript_pack_tag in your main application layout, is there a chance that webpack-dev-server isn’t running? How this worked changed since the latest beta, so you might be running it according to the book, but it’s still not working.

You can try doing RAILS_ENV=test bin/webpack before running your test and that might work

Generic-user-small
05 May 2017, 15:18
steve fox (9 posts)

I’ve tried setting

 RAILS_ENV=test bin/webpack

before running

$> bundle exec rspec spec/features/angular_test_app_spec.rb

with and without the javascript_pack_tag commented out in app/views/layouts/application.html.erb. (Aside, but related: should I remove that?)

So I run the rspec command above. Here’s the full error:

WARNING in ./~/@angular/core/@angular/core.es5.js
5870:15-36 Critical dependency: the request of a dependency is an expression

WARNING in ./~/@angular/core/@angular/core.es5.js
5886:15-102 Critical dependency: the request of a dependency is an expression
Child extract-text-webpack-plugin:
    chunk    {0} extract-text-webpack-plugin-output-filename 57.1 kB [entry] [rendered]
        [0] ./~/css-loader/lib/css-base.js 2.19 kB {0} [built]
        [1] ./~/base64-js/index.js 3.48 kB {0} [built]
        [2] ./~/buffer/index.js 48.6 kB {0} [built]
        [3] ./~/css-loader!./~/postcss-loader!./~/sass-loader/lib/loader.js!./app/javascript/packs/application.css 169 bytes {0} [built]
        [4] ./~/ieee754/index.js 2.05 kB {0} [built]
        [5] ./~/isarray/index.js 132 bytes {0} [built]
        [6] (webpack)/buildin/global.js 509 bytes {0} [built]
Child extract-text-webpack-plugin:
    chunk    {0} extract-text-webpack-plugin-output-filename 201 kB [entry] [rendered]
        [0] ./~/bootstrap/dist/fonts/glyphicons-halflings-regular.eot 74 bytes {0} [built]
        [1] ./~/css-loader/lib/css-base.js 2.19 kB {0} [built]
        [2] ./~/bootstrap/dist/fonts/glyphicons-halflings-regular.svg 74 bytes {0} [built]
        [3] ./~/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf 74 bytes {0} [built]
        [4] ./~/bootstrap/dist/fonts/glyphicons-halflings-regular.woff 75 bytes {0} [built]
        [5] ./~/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2 76 bytes {0} [built]
        [6] ./~/base64-js/index.js 3.48 kB {0} [built]
        [7] ./~/buffer/index.js 48.6 kB {0} [built]
        [8] ./~/css-loader!./~/postcss-loader!./~/sass-loader/lib/loader.js!./~/bootstrap/dist/css/bootstrap.css 144 kB {0} [built]
        [9] ./~/ieee754/index.js 2.05 kB {0} [built]
       [10] ./~/isarray/index.js 132 bytes {0} [built]
       [11] (webpack)/buildin/global.js 509 bytes {0} [built]

webpack: Compiled with warnings.
Angular is running in the development mode. Call enableProdMode() to enable the production mode.
[WDS] Warnings while compiling.
./~/@angular/core/@angular/core.es5.js
5870:15-36 Critical dependency: the request of a dependency is an expression
./~/@angular/core/@angular/core.es5.js
5886:15-102 Critical dependency: the request of a dependency is an expression
  Our Angular Test App is Working (FAILED - 1)
Killing webpack-dev-server

Failures:

  1) angular test Our Angular Test App is Working
     Failure/Error: click_button "Log in"

     Capybara::Poltergeist::JavascriptError:
       One or more errors were raised in the Javascript code on the page. If you don't care about these errors, you can ignore them by setting js_errors: false in your Poltergeist configuration (see documentation for details).

       TypeError: undefined is not an object (evaluating 'handler.call')
       TypeError: undefined is not an object (evaluating 'handler.call')
           at http://127.0.0.1:63438/assets/application-1575012bebd78ebcd04fce85e074444aa3a84c575c723fe4865bceec02c8ede4.js:145
           at :0 in sendEvent
           at phantomjs://code/web_page.js:59
           at phantomjs://code/web_page.js:558 in mouseEvent
           at phantomjs://code/node.js:67 in mouseEvent
           at phantomjs://code/browser.js:398 in mouse_event
           at phantomjs://code/browser.js:418 in click
           at phantomjs://code/browser.js:89 in runCommand
           at phantomjs://code/cmd.js:35 in run
           at phantomjs://code/main.js:17 in runCommand
           at phantomjs://code/connection.js:16 in commandReceived
           at phantomjs://code/connection.js:1
       TypeError: undefined is not an object (evaluating 'handler.call')
       TypeError: undefined is not an object (evaluating 'handler.call')
           at http://127.0.0.1:63438/assets/application-1575012bebd78ebcd04fce85e074444aa3a84c575c723fe4865bceec02c8ede4.js:145
           at :0 in sendEvent
           at phantomjs://code/web_page.js:59
           at phantomjs://code/web_page.js:558 in mouseEvent
           at phantomjs://code/node.js:67 in mouseEvent
           at phantomjs://code/browser.js:398 in mouse_event
           at phantomjs://code/browser.js:418 in click
           at phantomjs://code/browser.js:89 in runCommand
           at phantomjs://code/cmd.js:35 in run
           at phantomjs://code/main.js:17 in runCommand
           at phantomjs://code/connection.js:16 in commandReceived
           at phantomjs://code/connection.js:1
     # ./spec/features/angular_test_app_spec.rb:30:in `block (2 levels) in <top (required)>'

Top 1 slowest examples (15.59 seconds, 99.3% of total time):
  angular test Our Angular Test App is Working
    15.59 seconds ./spec/features/angular_test_app_spec.rb:21

Finished in 15.7 seconds (files took 2.81 seconds to load)
1 example, 1 failure

Failed examples:

rspec ./spec/features/angular_test_app_spec.rb:21 # angular test Our Angular Test App is Working

Randomized with seed 19330

The WARNINGs have been there from the start and hasn’t affected how the app has functioned yet.

Thanks. Sorry for all the error code above.

Steve

Dmfcb_pragsmall
06 May 2017, 21:45
David Copeland (422 posts)
TypeError: undefined is not an object (evaluating 'handler.call')

Is the problem. This doesn’t happen in your browser? What version of phantomjs are you running?

> phantomjs --version
2.1.1

If this only happens when running the test, it’s going to be hard to debug. What I usually do is take out JavaScript entirely, and then add it in piece by piece until I see the failure.

If this happens even without the javascript_pack_tag in there, something deeper might be wrong. I would certainly expect the test to fail without, but it should not give you the above error from JavaScript.

Generic-user-small
09 May 2017, 04:02
steve fox (9 posts)

Hi David,

Thanks for the reply.

All looks and works fine in the browser, though in the console (firefox dev edition), I see

./~/@angular/core/@angular/core.es5.js
5870:15-36 Critical dependency: the request of a dependency is an expression  application.js:336:4
./~/@angular/core/@angular/core.es5.js
5886:15-102 Critical dependency: the request of a dependency is an expression

also (not sure if bootstrap is related, but this 404 is there)

 [HTTP/1.1 200 OK 0ms]
GET 
http://localhost:8080/bootstrap.css.map [HTTP/1.1 404 Not Found 14ms]

If I comment out the javascript_pack_tag from application.html.haml, the errors go away, but I do see

[WDS] Disconnected!  application.js:275:10

PhantomJS is 2.1.1

$  phantomjs --version
2.1.1

So, this is what I’ve been seeing. Haven’t been able to come back to this for a few days. But I’ll keep poking at it. Thanks in advance for any additional insight you may be able to offer.

Steve

Dmfcb_pragsmall
09 May 2017, 11:58
David Copeland (422 posts)
Critical dependency: the request of a dependency is an expression  application.js:336:4

is normal. There’s something in Angular that is causing this, but it shouldn’t be a problem.

The 404 on the .map file should also be OK.

Since PhantomJS is a headless WebKit, does everything work in Chrome (or Safari, if you are on a Mac)?

Generic-user-small
09 May 2017, 16:58
steve fox (9 posts)

yep! All works as expected, chrome, ff, ff dev, safari on Mac OS X.

Generic-user-small
15 May 2017, 23:47
steve fox (9 posts)

I am likely going to start over with a fresh new directory and use your Gemfile.lock.

Thanks.

You must be logged in to comment