Creating Fakes
While it's best to put
dynamic class configuration within an init function where it can be spied, sometimes this isn't possible. In these circumstances, create a fake file to fill in the gaps and ensure a class definition doesn't throw exceptions when isolated from Ext JS and the rest of the app.
Example
In the Ext Spec examples, the book view uses dynamic configuration for a layout property:
layout: {
type : 'hbox',
align: 'middle',
pack : 'center',
availableSpaceOffset: Ext.getScrollbarSize().width
}
Note: Technically the above could be moved within an init function, but has been left for the sake of this demonstration.To ensure the above doesn't throw a type error when isolated in a test harness, the Ext Spec example uses this fake:
Ext.getScrollbarSize = function () {
return {
width: 25
};
};
Setting up a Harness
When setting up an HTML test harness with fakes, the script references must be in the following order:
- Frameworks and Libraries
- Fakes
- Class
- Suite
The Ext Spec examples use the following script references in the book view harness.
<!-- ... -->
<!-- Library References -->
<link href="libraries/jasmine/jasmine.css" rel="stylesheet" type="text/css" />
<script src="libraries/jasmine/jasmine.js" type="text/javascript"></script>
<script src="libraries/jasmine/jasmine-html.js" type="text/javascript"></script>
<script src="libraries/extspec/ExtSpec.js" type="text/javascript"></script>
<!-- Fakes (if required) -->
<script src="specifications/view/book/View-fakes.js" type="text/javascript"></script>
<!-- Class Under Test -->
<script src="app/view/book/View.js" type="text/javascript"></script>
<!-- Unit Test Suite -->
<script src="specifications/view/book/View-unit.js" type="text/javascript"></script>
<!-- ... -->