Despite these two related questions on StackOverflow, I have not yet found a satisfactory answer for this, so I am sending messages to find out if there is a good practice accepted among Jasmine-jQuery users.
The main problem is simple, and two of its examples are considered in two related issues:
My Javascript has a setup() function that associates event handlers with various selectors on the page, as in $('#someDiv').click(someHandler) ; this function is passed to $(document).ready
In Jasmine tests, I use HTML fixtures representing various extracted parts of the page to test AJAX interactions on these elements (I launch the jasmine rails server version, where you can view Jasmine test reports in a browser)
The problem, of course, is that the selector with which setup() trying to associate handlers will not exist until the device is loaded. As a result, an event that is explicitly called in the Jasmine test will not be picked up by the DOM element in the device, because the function that would bind this handler to $(document).ready time already.
If only Jasmine could somehow delay the call to $(document).ready , until after the devices were loaded, I would be golden. But apparently this can not.
From two of the above StackOverflow questions, I drew various ways to get around this, all unsatisfactorily:
Copy the binding code into setup on the HTML devices themselves. This is not dry and will almost certainly lead to the fact that the luminaires will not synchronize with reality, and the luminaires should represent unobtrusive JS and, therefore, do not mix code and markup.
Call the setup function explicitly when necessary. This works in simple cases, but does not work if setup did non-idempotent things.
In setup use the code $(document).on('click', '#someDiv', someHandler) instead of the code shown above. (I am in jQuery 1.10.1.) I really tried this, but it doesn’t work: even if the loaded device contains an element matching #someDiv , running 'click' on that element does not produce someHandler called. Even if it worked, it is useless because (if I understand correctly) the value of this when calling the handler will reflect the element that actually handled the event, and not the one that first received it.
In setup use something like $('#someDiv').live(someHandler) , but live is deprecated as jQuery 1.7 and removed in 1.9.
Is there any other method that I am missing that does not require changes to the working code solely to host the test environment and does not require DRY violation?
source share