简体   繁体   中英

React/Babel: Components not rendering only on CircleCI

I've recently added ReactJS with React-Redux and Babelify (for ES6) to a Rails application. The cucumber tests are passing locally, but they are not passing on CircleCI. Here is what I know so far:

  • When I check screenshots in the artifacts, it appears the React components are not rendering, even while waiting up to 4 seconds for them to appear.
  • There are no errors in the CircleCI build
  • I've tried rebuilding on CircleCI without the cache.
  • Basic javascript-reliant tests are passing.
  • Basic tests that rely on babel and importing a library (lodash) are passing

How can I get my cucumber tests of React components to pass on CircleCI?

# no circle.yml

# gemfile
gem 'capybara-webkit'
gem "chromedriver-helper"
gem 'capybara-screenshot'
gem 'selenium-webdriver'

# package.json
"dependencies": {
  "browserify": "~> 10.2.4",
  "browserify-incremental": "^3.0.1",
  "lodash": "^3.10.1",
  "react": "~>0.13.3",
  "react-redux": "~>3.1.0",
  "redux-thunk": "~>1.0.0",
  "babelify": "~>6.3.0"
}

# support/env.rb
Capybara.register_driver :chrome do |app|
  Capybara::Selenium::Driver.new(app, browser: :chrome)
end
Capybara.javascript_driver = :chrome

After SSHing into the CircleCI tests, my colleague saw that Object.assign was undefined. Apparently CircleCI is using an older version of Chrome than we have been for our tests, and Babel does not automatically polyfill that ES6 method (see comments for more info).

He replaced Object.assign() with lodash's _.extend() and tests are green everywhere.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM