require.js dilemma: async loading of JS files for synchronous test case

1,127 views
Skip to first unread message

Mikko Ohtamaa

unread,
Oct 21, 2011, 5:40:11 PM10/21/11
to JsTestDriver
Hi,

I am converting my codebase to use require.js module loader:
http://requirejs.org/

However, I am struggling how to make JsTestDriver and require.js
coexist nicely.

Problem: require.js require() function does async magic when loading
JS files - vs. - you cannot use async callbacks in normal TestCase()

Possible solutions I have come up with and the questions:

* Make "adapter" for require.js tests which run require() code before
calling setUp(). Is this possible? How could I inject my own JS loader
to TestCase class?

* Convert all test cases to AsyncTestCases and create a common setUp()
method for all your test cases which does require.js loading. Is queue
available in setUp() and can I inject a custom step doing require()
calls there?

Igor Minar

unread,
Oct 21, 2011, 6:41:23 PM10/21/11
to js-test...@googlegroups.com
I don't think that either of your solutions will work. You don't want to be resolving the dependencies when your app is being tested. I'd be really worried about stumbling across JSTD bugs or other issues that could result in flakiness.

Is there  a way to process the code e.g. in nodejs and get a dependency tree that could be used to generate a jstd config file? That's the path I'd try first.

In the worst case, just create the jstd config file by hand (yeah, that is duplication of all require statements) and then override the require methods (require and friends to noop function) in a file that jstd loads before any of your files.

/i




--
You received this message because you are subscribed to the Google Groups "JsTestDriver" group.
To post to this group, send email to js-test...@googlegroups.com.
To unsubscribe from this group, send email to js-test-drive...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/js-test-driver?hl=en.


Samuel Ecko

unread,
Oct 22, 2011, 5:57:07 AM10/22/11
to JsTestDriver
This is what worked for me in a setup with jstd and ExtJs 4 (which
introduced a dependency management very similar to commonJS).
I use JsTestDriver's ability to serve JavaScript files to the captured
browser by specifiying them in the 'serve' section of the jstd config
file. I also configure the 'Loader' (the ExtJS 'class' responsible for
resolving dependencies) to use synchronous loading. Default behavior
in ExtJS is to load dependencies asynchronously until the page fires
the 'onReady' ('onLoad') event.
Furthermore, I tell the 'Loader' where to find the resource files
since jstd serves all files under the path '/test'.

The advantage of this setup compared to specifiying dependencies in
the 'load' section is that I don't have to care about the *load
order*, since this is handled by the framework.


A typical jstd config file in my setup looks like this:

load:
- jasmine/jasmine-1.1.0/jasmine.js # Jasmine framework
- jasmine/JasmineAdapter.js # Jasmine jstd adapter
- ext/ext-debug.js # basic ExtJS bootstrap classes
- myapp-test/util/loader.js # configure Ext.Loader
test:
- myapp-test/controller/SomeTests.js

serve:
- myapp/app/*.js
- myapp-test/*.js
# ... (all app directories)
- ext/src/*.js
- ext/src/util/*.js
# ... (all ext directories)



Performance of test execution might or might not improve with this
setup. On the upside, only required dependencies are loaded which
should speed up test execution. However, these dependencies are loaded
synchronously which might actually have a rather significant negative
effect on execution time.
Also, I am not sure how jstd handles files in the serve section (or
files in general). Does the jstd client upload all files to the jstd
server, or are they streamed on demand?


The described setup works for me. However, I wonder whether it might
be possible to write a jstd plugin that allows ExtJs to load files
asynchronously, and delay test execution until all dependencies are
resolved and executed. Haven't looked into this yet!


Sam

Maxim Lacrima

unread,
Oct 22, 2011, 7:33:35 AM10/22/11
to js-test...@googlegroups.com
Hi Mikko!

Recently I wrote some wrapper around AsyncTestCase that serves exactly this purpose:

https://github.com/mbreeze/jstd_amd

Take a look at it.
readme file is a bit clunky, I will probably rework it shortly. Feel free to contact me if you have any questions.


--
You received this message because you are subscribed to the Google Groups "JsTestDriver" group.
To post to this group, send email to js-test...@googlegroups.com.
To unsubscribe from this group, send email to js-test-drive...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/js-test-driver?hl=en.




--
with regards,
Maxim

Mikko Ohtamaa

unread,
Oct 22, 2011, 9:01:32 AM10/22/11
to JsTestDriver
Hi Maxim,

On Oct 22, 2:33 pm, Maxim Lacrima <lacrima.ma...@gmail.com> wrote:
> Hi Mikko!
>
> Recently I wrote some wrapper around AsyncTestCase that serves exactly this
> purpose:
>
> https://github.com/mbreeze/jstd_amd

This is great! I succesfully applied your work here w/little
modifications:

https://github.com/miohtama/Krusovice/blob/master/tests/amdTestCase.js

* Wrote patch to which correctly handles non-test-methods in cases

And then I wrote my own boilerplate code which wraps existing test
cases to amdTestCases:

https://github.com/miohtama/Krusovice/blob/master/tests/common.js

Little bit hackyish and fresh from the bakery last night ... I hope
JsTestDriver would support extra "beforeSetUp" callback which would
allow do some asynchronous <head> set-up.

Good work!

-Mikko

http://twitter.com/moo9000

Cory Smith

unread,
Oct 22, 2011, 2:36:12 PM10/22/11
to js-test...@googlegroups.com
From the sound of it, you need to look at the jasmine jstd adaptor to cover the functionality you are looking for.

And, I trust you always run with --reset? Otherwise, the browser cache management won't work as expected.

Tigbro

unread,
Oct 23, 2011, 12:11:13 PM10/23/11
to js-test...@googlegroups.com
Hi,
we are using r.js to combine alle requird javascript files into one script, and use that one with JsTestDriver. This also writes the module names in the anonymous module definitions, so everything works as expected. E.g. in the Module we simply have define(function(){...});
In detail, we are using Maven for the build, and the brew maven plugin for callinf r.js.

Tobias

Reply all
Reply to author
Forward
0 new messages