can't load stripe.js when running tests with capybara-webkit on linux

[jmondo]

Hey everyone,

I love puffing-billy! But I'm having a pretty critical problem. I am doing an end to end test and on the checkout page, we load stripe from js.stripe.com like so:

javascript_include_tag 'https://js.stripe.com/v1/'

We then of course use that library to get a payment token.

When I run the test on my mac, the payment succeeds and the test passes. on ubuntu (and circle CI) however, it does not. The test fails and stripe (ruby) renders:

Empty string given for card. You should supply either a token or full card details. To learn more about collecting payment information as a token, see: https://stripe.com/docs/tutorials/cards

Turns out that is because the Stripe (js) library isn't loaded and therefore my server is receiving an empty stripe_card_token.
To confirm: If I interrupt the test and I run page.driver.console_messages I get:

ReferenceError: Can't find variable: Stripe

But this only happens on linux! Not sure what's up. Happy to post whatever info you need. I am running ubuntu 12.04, I am not using the caching feature of puffing-billy, and I have WebMock installed but it is set to allow_net_connect!

Let me know if you have any ideas or debugging steps.

[jmondo]

Oh and with a pry session open just before the test fails, if I can run

uri = URI.parse('https://js.stripe.com/v1/')
Net::HTTP.get_print(uri)

and it definitely gets the content from stripe.

[jmondo]

further proof that the browser can't get to https://js.stripe.com/v1/. strange...

page.evaluate_script %(
  $.get( "https://js.stripe.com/v1/" )
  .fail(function( jqXHR, textStatus, errorThrown ) {
    console.log(JSON.stringify(jqXHR))
    console.log(textStatus)
    console.log(errorThrown)
  })
)

page.driver.console_messages
# => [{:message=> "{\"readyState\":0,\"responseText\":\"\",\"status\":0,\"statusText\":\"error\"}"}, {:message=>"error"}, {:message=>""}]

[ronwsmith]

Everything works fine when you're not using the _billy driver?

[jmondo]

Indeed.

John Gesimondo
Developer of all the things
http://jmondo.github.io/ http://jmondo.com/

[ronwsmith]

Anything in the puffing-billy logs during page load?

[jmondo]

OOo is there a separate log for billy?

On Tuesday, July 22, 2014, ronwsmith [email protected] wrote:

Anything in the puffing-billy logs during page load?

Reply to this email directly or view it on GitHub
#60 (comment)
.

John Gesimondo
Developer of all the things
http://jmondo.github.io/ http://jmondo.com/

[ronwsmith]

It uses your Rails.logger (or STDOUT without Rails). You can see a sample line here.

Do something along the lines of tail -f log/test.log | grep puffing during test run to see the additional output.

[jmondo]

When I try to ajax get google.com, I get this in the logs:

puffing-billy: CACHE KEY for 'http://google.com/' is 'get_google.com_ac4cbe16220c61319d192bf9078f01de42e383e3'
puffing-billy: PROXY GET for 'http://google.com/'

When I ajax get https://js.stripe.com/v1/ nothing appears in the logs.

[jmondo]

FWIW not a single log item is https. And when I try to get https://google.com, the same thing happens. Nothing in the logs and jquery hits the error callback.

[jmondo]

Made a new driver:

Capybara.register_driver :webkit2_billy do |app|
  driver = Capybara::Webkit::Driver.new(app)
  driver.browser.set_proxy(:host => Billy.proxy.host,
                           :port => Billy.proxy.port)
  driver.browser.ignore_ssl_errors
  driver.enable_logging # same thing webkit-debug driver uses
  driver
end

This is very helpful. Here's some stuff from the webkit logs:

Started request to "https://fonts.googleapis.com/css?family=Open+Sans:400,600" 
Started request to "https://js.stripe.com/v1/" 
Started request to "http://platform.twitter.com/oct.js" 
Received 200 from "http://127.0.0.1:57847/orders" 
Received 0 from "https://fonts.googleapis.com/css?family=Open+Sans:400,600" 
Received 0 from "https://js.stripe.com/v1/" 

Here it is without the proxy:

Started request to "https://fonts.googleapis.com/css?family=Open+Sans:400,600" 
Received 200 from "https://fonts.googleapis.com/css?family=Open+Sans:400,600" 
Started request to "https://js.stripe.com/v1/" 
Received 200 from "https://js.stripe.com/v1/" 

[ronwsmith]

Interesting find, I'm betting it's an issue here. Can you add some logging to see what @parser.http_method is there and see if it's getting into restart_with_ssl?

[jmondo]

yep trying now. thanks so much for the help.

[jmondo]

This method does not get called for the https requests on the affected machine. It does get called on my mac.

[ronwsmith]

So it might be a different http_method. Can you see what @parser.http_method returns from the non-Mac?

[jmondo]

Sorry should have been more specific. on_message_complete isn't being called at all on the non Mac for https requests

[ronwsmith]

That sounds like an issue with EventMachine as it's what calls that method on callback.

[oesmith]

Could the browser be dropping the connection before completion (because of the self-signed cert)?

Are there other EventMachine callbacks we could hook into there?

[jmondo]

Seems like the browser is doing something with the connections. I tried hooking into many parts of EventMachine::Connection and none of them seem to be getting hit with https connections. According to the comment at the top, this suggests that the return connection isn't happening:

  # EventMachine::Connection is a class that is instantiated
  # by EventMachine's processing loop whenever a new connection
  # is created. (New connections can be either initiated locally
  # to a remote server or accepted locally from a remote client.)

Though I do have that log item Received 0 from "https://js.stripe.com/v1/" showing up from capybara's debug mode. That suggests it's receiving /something/ even if it's nothing.

Not sure what to try next. Suggestions?

[bmulholland]

I'm having this problem now too. I just put a ton of work into getting puffing-billy working and now it won't work on CircleCI. It doesn't look like a solution was found here. How can I help move this along?

[bmulholland]

I've wasted two more days on this. Sometimes things work, and then some minor thing changes and they fail again. Here's my console output:
[2] pry(#Cucumber::Rails::World)> page.driver.console_messages
=> [{:line_number=>0, :message=>"ReferenceError: Can't find variable: Stripe", :source=>"undefined"}, {:line_number=>0, :message=>"TypeError: 'undefined' is not an object", :source=>"undefined"}]

This only seems to happen SOME of the time. Sometimes it works! Minor HTML changes on the page are the difference between it working or not. It's pretty messed up and I don't see why that would happen.

I verified that switching from :webkit_billy to :webkit for the driver removes the problem, and I'm going to have to leave it like that.

I still would love to use puffing-billy and to help support the project. Please let me know what I can do to diagnose and fix this issue.

[bmulholland]

I reduced this down to a simple test case where I include stripe, then try to set the public key. I check the console for errors and get an error, but only on Circle. Locally it works fine.

• I confirmed that this was an HTTPS issue by switching the cached file to be HTTP, the include to be HTTP, and changed the filename to be the hash for HTTP. That fixed the issue.
• I confirmed all of the findings above.
• I tried other scripts (not just the Stripe one) and confirmed that those are not executed by the browser when using an HTTPS connection
• I see that all HTTP connections return 200 status, while HTTPS returns 0 status
• Locally (OSX Yosemite) the connection returns 200
• There is no difference when I remove the "ignore_ssl_errors" line in the driver. It's like SSL errors are not being ignored after all.
• With ignore_ssl_errors removed, it pases locally.
• Setting ignore_ssl_errors manually inline (page.driver.browser.ignore_ssl_errors) doesn't do anything either. This was suggested recently, so I don't think it has changed.
• I tried setting eventmachine to the latest from git, which didn't help.
• I upgraded capybara-webkit to the latest, still failed.
• I tried poltergeist, and that worked.

Overall, this really seems like an issue with capybara-webkit or webkit. I tried looking and could not find any related issues for either project. If this has been around since July, there should have been a bug filed /somewhere/. I don't have enough information right now to open an issue on either project, though.

@ronwsmith / @oesmith Do you have any suggestions for what I can dig into so I can get enough information to narrow it down and file a bug in the right place?

EDIT: Put together a sample project that demonstrates this issue. https://github.com/bmulholland/debug-puffing-billy-stripe

[bmulholland]

FYI - as solved in thoughtbot/capybara-webkit#679, this bug is ultimately caused by QTBUG-25542, which is present on Qt 4.8.1. To fix this, upgrade to a Qt version > 4.8.1 (4.8.6 is confirmed working).

[ronwsmith]

Great, thanks for the update @bmulholland! Can we close this issue as well then?

Edit: Just realized you weren't the reporter -- @jmondo, please verify this fixes your issue.

[bmulholland]

@ronwsmith My 2 cents is that you can close this :)

[ronwsmith]

Closing, fixed in capybara-webkit.