jsx specs not working when upgraded to Sprockets 3.0

jejacks0n / teaspoon

Teaspoon: Javascript test runner for Rails. Use Selenium, BrowserStack, or PhantomJS.

1.43k stars 243 forks source link

jsx specs not working when upgraded to Sprockets 3.0 #434

Closed mockdeep closed 8 years ago

mockdeep commented 8 years ago

We just upgraded to Sprockets 3.0 and everything in our app seems to be working alright, but tests with the extension .js.jsx no longer work from the command line. Booting into the browser they run fine, but from CLI we just get the cryptic "Syntax error: parse error" from phantomjs and:

Finished in 0.00200 seconds
0 examples, 0 failures

Not sure if this is a teaspoon issue, but figured I'd start here. We're using react-rails which adds .js.jsx extensions to the asset pipeline.

mockdeep commented 8 years ago

We have our matcher configured as:

suite.matcher = 'spec/javascripts/**/*_spec.{js,js.jsx}'

mikepack commented 8 years ago

@mockdeep thanks for reporting this bug. I'll try to spend some turkey time looking into it. Do you know if it's specific to .jxs extensions?

mockdeep commented 8 years ago

@mikepack Sorry, we only use .js and .jsx in our javascripts folder, so not sure if other extensions are a problem. We are using haml in our fixtures, and those seem to be fine.

mikepack commented 8 years ago

The reason this is happening is because Teaspoon calls #logical_path on a sprockets asset in order to get a file URL that can be requested from the browser. We assume this returns a .js extension every time (like it does in Sprockets 2.x), but this is not the case with .js.jsx extensions in Sprockets 3.x, in which case it returns .jsx.

This seems like it could be one of two things:

Teaspoon should not use #logical_path but I'm not currently aware of another way to determine the URL for a sprockets asset.
It's upstream in the react-rails asset pipeline integration and they need specify a .js extension for #logical_path.

mockdeep commented 8 years ago

@mikepack how are other extensions like .coffee handled?

mikepack commented 8 years ago

It's mostly handled by sprockets. Sorry, I didn't provide a good resolution for the interim. If you're on Teaspoon 1.1.x, try setting this configuration:

config.suite do |suite|
  suite.js_extensions = [/(\.js)?.coffee/, /(\.js)?.es6/, ".es6.js", ".js.jsx"]
end

mockdeep commented 8 years ago

Thanks! At first blush it looks like that fixed it for me.

mikepack commented 8 years ago

:+1: