Setup JSTestDriver with ExtJS 4 & jasmine
Hi,
I'm trying to setup unit-tests in my existing ExtJS 4.1 project. I'm using jasmine for logical unit testing, and it's working fine so far. (testing in browser and via terminal)...
Now, I'm trying to setup JSTestDriver for better IDE integration. I followed already an old thread (here) .. but didn't get it to work. JSTestDriver-Server is working fine, but, as I need to load my ExtJS-files dynamically, I get some errors on the jstd-server while it's async loading the required js-files:
Error:
Code:
localhost:9876/slave/page/RUNNER/id/1359996445901/mode/quirks/upload_size/50/refresh/1359996450734/load_type/app/controller/main
Uncaught SyntaxError: Unexpected token <
Does anybody have experiences with JSTestDriver & jasmine & ExtJS? I'm using jstd in Webstorm 5. Do I need to setup Ext.Loader in a special way?
My JSTestDriver.conf (located in the root folder)
Code:
server: http://localhost:9876
load:
- ext/ext-all.js
- app/controller/main/IdentityManager.js
- app-test/lib/jasmine-1.3.1/jasmine.js
- app-test/lib/jasmine-1.3.1/JasmineAdapter.js
test:
- app-test/specs/identity.js
serve:
- app/**.js
JsTestDriver server adds /test to your app's URL paths
I just ran into the same problem this morning trying to integrate my Jasmine unit tests with my IntelliJ IDE through JsTestDriver for a Sencha Touch 2.0 app using dynamic loading. It turns out that the JsTestDriver web server changes the path to your JS files, so you have to modify your Ext.Loader paths.
I had the same problem ("Uncaught SyntaxError: Unexpected token <"). The problem is that the Sencha dynamic loader sends an AJAX request to load a JS file, but it gets back an HTML document from JsTestDriver's embedded web server, and the Sencha framework then tries to call `eval` on the HTML string, which causes that '<' syntax error.
It turns out that JsTestDriver's built-in web server serves your files under a prepended "/test" path in the URL. So if you configure your classes to be available as, say, app/controller/AppController.js, then it'll actually be served as /test/app/controller/AppController.js.
I solved that problem with a custom config of Ext.Loader just for JsTestDriver. First, the jsTestDriver.conf:
Code:
load:
- lib/jasmine-1.3.1/jasmine.js
- lib/JasmineAdapter.js
- sdk/sencha-touch-all.js
- test/jstdExtLoaderConfig.js
#- app.js
test:
- test/jasmine/spec/*.js
serve:
- app/config/*.js
- app/controller/*.js
- app/model/*.js
- app/store/*.js
- app/util/*.js
- app/view/*.js
Note that I currently have this file at the root of project, although I'd like to move it into the test/ folder once I figure out how to get everything working.
My test/jstdExtLoaderConfig.js looks like the following:
Code:
Ext.Loader.setConfig({
enabled: true,
paths: {
Ext: 'sdk',
App: '/test/app'
}
});
Note that in the "paths" config, I had to change {App: 'app'}, to {App: '/test/app'} to get it to load my app's classes correctly. It had to be the absolute path "/test/app", not the relative path "test/app", to work correctly.
You might notice that I have app.js commented out in my jsTestDriver.conf above. I still haven't gotten this thing to load that file correctly, so any tests that depend on the top-level application class are still broken. When I tell it to load app.js, for some reason, it tries to load it from the wrong path and breaks the whole thing. For reasons I haven't figured out yet, instead of loading the correct path, project/app.js, it attempts to load project/archive/app.js, which doesn't exist. I have no clue which part of this setup is sticking "archive" into the path or why.
