Does Capybara Webkit recognize JavaScript's Array.includes() method?

Question

In my Rails app front-end I use JavaScript's Array.includes method as follows

if (['a', 'b', 'c'].includes('b')) {
  // do stuff

It works fine in a live Chrome browser, but my RSpec test is failing. I believe Capybara Webkit doesn't seem to support it?

I can confirm this by pausing the spec with binding.pry and running

> page.evaluate_script("['a', 'b', 'c'].includes('b')")
=> nil

It returns nil when it should return true.

Just out of curiosity I tried this same thing on another Rails app, and miraculously it worked on that app

> page.evaluate_script("['a', 'b', 'c'].includes('b')")
=> true

So I'm scratching my head as to why it would work on one app but not another?

App #1 (Failure)
- Capybara 2.18.0
- Capybara Webkit 1.15.0
App #2 (Success)
- Capybara 2.13.0
- Capybara Webkit 1.14.0

In fact the first app where it failed seems to have a more recent version of Capybara/Webkit..

Thanks!

Thomas Walpole Thomas Walpole · Accepted Answer · 2018-08-08T05:22:27

capybara-webkit gets it's JS support based on the version of QtWebkit it is built against. The last released stable version of QtWebkit supported ES5 (and most of ES 5.1) and is basically equivalent to a 6-7 year old version of Safari.

Since Array.prototype.includes() wasn't included in the JS standard until ES2015 it is not supported natively by capybara-webkit. You can however add support for includes via a polyfill and I'm guessing that's what you have in your App #2.

In order for capybara-webkit to be useful with modern apps you need to make sure all JS used in your app is transpiled to ES5 and polyfilled (using babel, etc). If your apps requirements don't include old/obsolete browsers a better solution for headless testing is to use headless Chrome or Firefox via capybaras selenium driver since those combinations support modern JS and CSS.

Does Capybara Webkit recognize JavaScript's Array.includes() method?

2 Answers