流星摩卡手表模式显示代码行而不是断言信息

问题描述：

我在手表模式下使用practicalmeteor:mocha，并且已经编写了一些UI测试（单元测试模板组件）。流星摩卡手表模式显示代码行而不是断言信息

我有一个奇怪的问题，即我的失败测试不会揭示断言消息，而是代码片段。

我重视的图像用一个例子输出：

不幸的是我没有找到关于包或摩卡本身的文档中与此相关的一个配置的任何信息。

我的测试命令如下：

meteor test --driver-package practical meteor:mocha

测试代码如下：

// PACKAGES 
import {Meteor} from 'meteor/meteor'; 
import {Template} from 'meteor/templating'; 
import {$} from 'meteor/jquery'; 
import {Random} from 'meteor/random'; 
import {chai, assert} from 'meteor/practicalmeteor:chai'; 
import StubCollections from 'meteor/hwillson:stub-collections'; 
import {sinon} from 'meteor/practicalmeteor:sinon'; 

// HELPERS 
import {withRenderedTemplate, renderTemplate, withDiv} from '../../test-helpers.js'; 

// COMPONENTS 
import '../../../startup/both/schemaDefaults'; 
import {loadingClassName} from '../../components/loading/loading'; 
import {Comments} from '../../../api/comments/Comments'; 
import '../comments.js'; 


describe("UI/Comments", function() { 

    beforeEach(function() { 
     StubCollections.stub(Comments); 
     Template.registerHelper('_', key => key); 
    }); 

    afterEach(function() { 
     Template.deregisterHelper('_'); 
     StubCollections.restore(); 
     Meteor.subscribe.restore(); 
    }); 

    ////////////////////////////////////////////////////////  

    it("renders a loading symbol on load", function (done) { 

     sinon.stub(Meteor, 'subscribe',() => ({ 
      subscriptionId: Random.id(), 
      ready:() => false, 
     })); 

     withRenderedTemplate(Template.comments, {}, el => { 
      const target = $(el); 
      chai.assert.equal(target.find('.' + loadingClassName).length, 1); 
      done(); 
     }); 

    }); 

    //////////////////////////////////////////////////////// 

    it("displays a message if no comments exist for the given document", function (done) { 

     sinon.stub(Meteor, 'subscribe',() => ({ 
      subscriptionId: Random.id(), 
      ready:() => true, 
     })); 

     withRenderedTemplate(Template.comments, {docId: Random.id()}, el => { 
      const target = $(el); 
      chai.assert.equal(target.find('.' + loadingClassName).length, 0); 
      chai.assert.equal(target.find('.no-comments').length, 1); 
      done(); 
     }); 

    }); 

    //////////////////////////////////////////////////////// 

    it("displays comments, if comments are found", function (done) { 

     sinon.stub(Meteor, 'subscribe',() => ({ 
      subscriptionId: Random.id(), 
      ready:() => true, 
     })); 

     const userId = Random.id(); 
     const commentDoc = { 
      title: Meteor.user().username, 
      status: 0, 
      docId: Random.id(), 
      description: "this is a comment", 
      createdAt: new Date().getTime(), 
      updatedAt: new Date().getTime(), 
      createdBy: userId, 
      updatedBy: userId, 
     }; 

     Comments.insert(commentDoc); 

     withRenderedTemplate(Template.comments, {docId: Random.id()}, el => { 
      const target = $(el); 
      assert.equal(target.find('.' + loadingClassName).length, 0); 
      assert.equal(target.find('.no-comments').length, 0); 
      assert.isAbove(target.find('.comment-entry').length, 0); 
      done(); 
     }); 
    }); 

    //////////////////////////////////////////////////////// 

    it("displays a comment of self different than comments of others", function (done) { 
     assert.fail("not yet implemented"); 
    }) 
});

答

好吧，我找到了答案，自己在DOM挖后。

这也可能是有趣的，非流星用户：

摩卡环球网记者使用了错误输出一个css类名叫做.error这当然是对的CSS覆盖非常脆弱。

我首先想到的是，这不可能是问题，因为我通常使用前缀类名来避免这种冲突。

但我安装了一个编辑一个包，还配备了一个默认的CSS里面也有一个入口，叫做：

.error { 
    display: none; 
}

流星应用奇妙捆绑所有的方式，即运行我的摩卡时测试中，错误字段隐藏在网络记者的身上。

我删除了编辑器包，我的问题得到解决。

我从中学到了什么：不要在包中使用常用名称作为css类。

流星摩卡手表模式显示代码行而不是断言信息

相关推荐