1

测试对象中事件处理的最佳方法是什么？我似乎无法弄清楚这一点。

我有一个对象，它设置了一些事件侦听器，当它观察到这些事件被触发时，它会更改页面上的一个 dom 对象。当我进行多个测试时，下面示例中的最后一个测试失败，如果我注释掉其他的就可以了。

我有一个看起来像的测试套件

var TitleTest = TestCase('TitleTest');

TitleTest.prototype.defaultTitle = 'title';
TitleTest.prototype.defaultCount = '0';

TitleTest.prototype.setUp = function() {
    var titleObj;
    this.div = new Element('div');
    $$('body').first().insert(this.div);
    this.div.insert('<div id="title"><h1><span id="titleCaption">' + this.defaultTitle + '</span><span id="titleCount">' + this.defaultCount + '</span></h1></div>');
    titleObj = new Title();
});

TitleTest.prototype.testNewItemsEvent = function() {
    var data = {count: 10};

    assertEquals('Count should be zero before events are fired', this.defaultCount, $('titleCount').innerHTML);
    document.fire('custom:NewItems', data);
    assertEquals('New count should be 10', data.count + '', $('titleCount').innerHTML);
});

// ... a few other simple tests like the one above

TitleTest.prototype.testUpdateSpecial = function() {
    var data = {caption: 'Special Title', count: 10},
        specialObj = {special: {type: 2, value: 5}};

    // Emulate a special type of category, that can only be 
    // added at page load
    document.fire('custom:UpdateTitle', data);
    assertEquals(data.caption, $('titleCaption').innerHTML);
    assertEquals(data.count, $('titleCount').innerHTML);

    //Removing the special category should revert the title to its default
    document.fire('custom:RemoveSpecial', specialObj);
    assertEquals(this.defaultTitle, $('titleCaption').innerHTML);
    assertEquals(this.defaultCount, $('titleCount').innerHTML);

    // only way to get this added back in during non load is using
    // javascript history so it needs to revert to previous state
    document.fire('custom:AddSpecial', specialObj);
    assertEquals(data.caption, $('titleCaption').innerHTML);
    assertEquals(data.count + '', $('titleCount').innerHTML);
});

如果前面的测试运行，最后一对断言将始终失败，但如果我注释掉其他测试，则将通过。我不知道我能做些什么来让它工作。

编辑：这是处理特殊标题的添加/删除的代码

    Event.observe(document, 'custom:UpdateTitle', function(event) {
        if (event.memo.caption) {
            this._updateCaption(event.memo.caption);
        }

        if (event.memo.count) {
            this._updateCount(event.memo.count);
        }   

    }.bind(this));


    Event.observe(document, 'custom:RemoveSpecial', function(event) {
        if (
            event.memo.special.type === 1 ||
            event.memo.special.type === 2 ||
            (   
                event.memo.special.type === 3 &&
                parseInt(event.memo.special.value, 10) === 8
            )   
        ){  
            this._previousTitle = $('titleCaption').innerHTML;
            this._resetTitle();
        }   
    }.bind(this));

    Event.observe(document, 'custom:AddSpecial', function(event) {
        if (
            event.memo.special.type === 1 ||
            event.memo.special.type === 2 ||
            (   
                event.memo.special.type === 3 &&
                parseInt(event.memo.special.value, 10) === 8
            )   
        ){  
            if (!this._previousTitle.blank()) {
                this._updateCaption(this._previousTitle);
            }   
        }   
    }.bind(this));
4

2 回答 2

1

尝试在 tearDown 方法中编写一些清理代码，以将 titleObj 及其侦听器从 DOM 中分离出来。据我所知，jsTestDriver 在每次测试后都会重置 DOM，但我不确定监听 DOM 事件的对象会发生什么。您可能仍然有一个旧的 titleObj 不能被垃圾收集，因为它附加到 DOM。

除此之外，您测试 DOM 事件的方式看起来还不错。触发 DOM 事件并断言代码是否完成了它应该做的事情......

于 2011-07-06T09:33:03.757 回答
1

@meyertee 提到了我的问题的解决方案。我假设 setup 和 teardown 像 PHPUnit 一样工作，它们仅在所有测试运行之前和之后分别被触发，但 jsTestDriver 在每次测试之前和之后触发它们。由于我在设置中设置了我的 DOM 和 Title 事件，因此在每次测试之前都会创建一个新的 title 对象，因此更多的侦听器会导致竞争条件。我将我的 Title 对象的实例化移出设置，这已经解决了这个问题。

于 2011-07-11T13:53:48.713 回答