Làm cách nào để tránh giới thiệu các rò rỉ toàn cầu khi sử dụng Squire.js với RequireJS và Mocha?

Question

Tôi đang viết một ứng dụng JavaScript đơn bằng cách sử dụng Backbone và Backbone.Marionette. Tôi đang sử dụng các mô-đun AMD và RequireJS để giúp tổ chức mã của tôi và quản lý các phụ thuộc. Tôi cũng đang sử dụng Mocha làm khung kiểm tra cho TDD/BDD.

Mọi thứ đều hoạt động tốt cho đến khi tôi muốn giới thiệu sơ khai, kết nối và gián điệp bằng Sinon.JS. Sau nhiều lần tìm kiếm, tôi đã xem một trang trên test frameworks in the RequireJS wiki và Squire.js, dường như nó sẽ phù hợp với nhu cầu của tôi. Tuy nhiên, khi tôi cố gắng sử dụng Squire.js để tải một mô-đun, Mocha đột nhiên báo cáo rò rỉ toàn cầu cho các phụ thuộc của mô-đun. Không có rò rỉ được báo cáo nếu tôi tải mô-đun trực tiếp bằng cách sử dụng Require.JS.

Ví dụ, mã kiểm tra sau không gây Mocha báo cáo bất kỳ rò rỉ:

define(['app/app'], function(app) { 
    describe('App', function() { 
     it('Should define a \'header\' region', function() { 
      expect(app.headerRegion).to.exist; 
     }); 

     it('Should define a \'main\' region', function() { 
      expect(app.mainRegion).to.exist; 
     }); 
    }); 

    return { 
     name: "App" 
    }; 
}); 

Tuy nhiên, việc chuyển đổi mã để sử dụng Squire.js như sau gây Mocha báo cáo rò rỉ cho jQuery, Backbone, và Marionette (phụ thuộc của app.js):

define(['Squire'], function(Squire) { 
    describe('App', function() { 

     var testContext = {}; 

     beforeEach(function(done) { 
      testContext.injector = new Squire(); 
      testContext.injector.require(['app/app'], function(app) { 
       testContext.app = app; 
       done(); 
      }); 
     }); 

     it('Should define a \'header\' region', function() { 
      expect(testContext.app.headerRegion).to.exist; 
     }); 

     it('Should define a \'main\' region', function() { 
      expect(testContext.app.mainRegion).to.exist; 
     }); 
    }); 

    return { 
     name: "App" 
    }; 
}); 

Tôi đang làm gì sai? Tôi hoàn toàn bối rối rằng Mocha không báo cáo một sự rò rỉ với RequireJS nhưng làm với Squire.js. Tôi cũng đã thử một số giải pháp khác mà tôi đã tìm thấy trong một số khác StackOverflow question on mocking RequireJS dependencies, chẳng hạn như hàm tùy chỉnh và testr.js, trước Squire.js và có kết quả tương tự. Cho đến nay, tôi đã không thể tìm thấy một ví dụ sử dụng Mocha, RequireJS và Sinon.JS cùng nhau.

Tôi đã placed my current code base on GitHub trong trường hợp có một số thông tin quan trọng mà tôi đã bỏ sót hoặc một cái gì đó. Bạn có thể tìm thấy bài kiểm tra được đề cập trong số test\spec\test.app.js.

Bất kỳ hỗ trợ nào được đánh giá cao. Tôi rất muốn có được quá khứ khỉ với thiết lập thử nghiệm của tôi và trên để thực sự làm việc trên ứng dụng của tôi. Cảm ơn trước.

Answer 1

Sau khi suy nghĩ kỹ hơn, tôi nhận ra rằng đây thực sự là hành vi mong đợi và tác dụng phụ của thời điểm khi app.js được tải để thử nghiệm.

xét nghiệm của tôi được nạp qua RequireJS trong một tuyên bố require hiển thị dưới đây

require([ 
    'spec/test.smoketest', 
    'spec/test.app' 
    ], runMocha); 

nơi runMocha chỉ đơn giản là một chức năng mà chỉ đơn giản gọi mocha.run().

Đã xảy ra với tôi rằng cách mà Mocha có khả năng phát hiện rò rỉ toàn cầu nhất là so sánh những gì được đăng ký trên toàn cầu trước và sau mỗi lần chạy thử nghiệm. Trong ví dụ đầu tiên ở trên, nơi rò rỉ không được báo cáo, jQuery, Backbone và Marionette được nạp bởi RequireJS trước khi mocha.run() được gọi là một phần của tải mô-đun test.app.js. Mặt khác, jQuery, Backbone, và Marionette được nạp như một phần của bản thân các thử nghiệm trong ví dụ thứ hai.

Do đó, cấu hình đầu tiên không báo cáo bất kỳ rò rỉ nào vì jQuery, Backbone và Marionette đã được đăng ký toàn cầu trước khi gọimocha.run(). Báo cáo cấu hình thứ hai bị rò rỉ vì chúng được đăng ký trong các thử nghiệm.

Bây giờ tôi đã hiểu điều gì đang diễn ra và điều này được mong đợi, tôi cảm thấy thoải mái khi cấu hình Mocha để cho phép các đối tượng chung này.Điều này có thể được thực hiện trong cấu hình Mocha như hình dưới đây:

mocha.setup({ 
    ui: "bdd", 
    globals:["_", "$", "jQuery", "Backbone", "Marionette"] 
});