Jasmine测试：倾听DOM变化

Question

我有一个requireJS设置，我有一个'imageGallery'模块，可以监听和处理 点击“.gallery”元素上的活动。这又使用插件'magnificPopup'打开一个 基于点击元素的图像库。

我想用Jasmine测试一下;那就是我想测试是否调用了click事件 magnificPopup的html位于dom - 证明click事件是成功的。

我当前的点击测试使用'waitsFor'，但这总是失败。关于如何实现这一点的任何想法？

图片库模块

define(

    ['jquery', 'magnificPopup'],

    function($, magnificPopup) {

    return {

        init: function() {

            $('body').on('click', '.gallery', function(e) {
                e.preventDefault();

            //code to generate  items...

            $.magnificPopup.open({
                items: items,
                gallery: { enabled: true }
            });         


            });

        }
    }
})

图片库茉莉花测试

define(['imageGallery'],

    function(imageGallery) {

        jasmine.getFixtures().fixturesPath = '/';

        describe('Image Galleries', function() {

            beforeEach(function(){
                loadFixtures('/path-to-my-fixture');
                spyOn(imageGallery, 'init');
                imageGallery.init();
            });

            it('Should be defined', function() {
                expect(imageGallery).not.toBe(null);
            });            

            it('Should be initialised via imageGallery.init()', function() {
                expect(imageGallery.init).toHaveBeenCalled();                
            });                       

            //fails
            it('Should open a modal after a .gallery element is clicked', function() {                 

                $('.gallery').click();

                waitsFor(function() {
                   return ($('body').find('.mfp-ready').length > 0)
                }, '.gallery to be clicked', 500);

            });



        });

    }

);