How do I build a suite of Qunit tests that all have their own qunit fixtures?

javascript, qunit

Solution

I usually have a master runner.html, leave my `#qunit-fixture` empty and populate the fixture from within my modules' setup method.

However if you want to share html its easy to:

- Store the html in a template (ie some-test-fixture.html)

- Load the template using ajax (or requirejs !text)

Then you can populate the #qunit-fixture as needed

Problem

I have two XXXTest.html files, each similar to this: ``` <html> <head> <link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-1.11.0.css" /> <script src="../../../public/scripts/common/SomeUtils.js"></script> </head> <body> <div id="qunit"></div> <div id="qunit-fixture"> <div id="findme">Something specific for the code under test</div> </div> <script src="http://code.jquery.com/qunit/qunit-1.11.0.js"></script> <script src="SomeUtilsTest.js"></script> </body> </html> ``` Each has their own qunit-fixture, so the html file is equivalent to a JUnit Test Class. I realize qunit considers modules as roughly the same thing as a test class, but that's very limiting. What's the best way to have a master html file that will execute tests within other html files? Or what's the "correct way" to separate out tests that need their own fixtures in the qunit world?

Original source