当使用Jasmine进行测试时，RequireJS模块垫片不工作

Question

我有一个JavaEE project，它使用RequireJS加载一些第三方框架。其中一个框架是OpenLayers3。 Openlayers3本地创建一个全局“ol”变量。但是，OpenLayers3被写为AMD兼容，并通过RequireJS作为模块工作。我也正在使用名为“olLayerSwitcher”的OpenLayers3 plugin，该版本并未针对AMD进行优化。相反，它取决于“ol”变量是全局变量。

我需要配置如下所示：

paths: { 
    "sinon": ['/webjars/sinonjs/1.7.3/sinon'], 
    "jquery": ["/webjars/jquery/2.1.4/jquery"], 
    "backbone": ['/webjars/backbonejs/1.2.1/backbone'], 
    "underscore": ['/webjars/underscorejs/1.8.3/underscore'], 
    "text": ['/webjars/requirejs-text/2.0.14/text'], 
    "log4js": ['/webjars/log4javascript/1.4.13/log4javascript'], 
    "ol": ['/webjars/openlayers/3.5.0/ol'], 
    "olLayerSwitcher": ['/js/vendor/ol3-layerswitcher/1.0.1/ol3-layerswitcher'] 
}, 
shim: { 
    "olLayerSwitcher": { 
     deps: ["ol"], 
     exports: "olLayerSwitcher" 
    }, 
    'sinon' : { 
     'exports' : 'sinon' 
    } 
} 

该项目是采用骨干，包括路由器模块（/src/main/webapp/js/controller/AppRouter.js）：

/*jslint browser : true*/ 
/*global Backbone*/ 
define([ 
    'backbone', 
    'utils/logger', 
    'views/MapView' 
], function (Backbone, logger, MapView) { 
    "use strict"; 
    var applicationRouter = Backbone.Router.extend({ 
     routes: { 
      '': 'mapView' 
     }, 
     initialize: function() { 
      this.LOG = logger.init(); 
      this.on("route:mapView", function() { 
       this.LOG.trace("Routing to map view"); 

       new MapView({ 
        mapDivId: 'map-container' 
       }); 
      }); 
     } 
    }); 

    return applicationRouter; 
}); 

路由器模块取决于视图模块上（/src/main/webapp/js/views/MapView.js）：

/*jslint browser: true */ 
define([ 
    'backbone', 
    'utils/logger', 
    'ol', 
    'utils/mapUtils', 
    'olLayerSwitcher' 
], function (Backbone, logger, ol, mapUtils, olLayerSwitcher) { 
    "use strict"; 

    [...] 

    initialize: function (options) { 
     this.LOG = logger.init(); 
     this.mapDivId = options.mapDivId; 
     this.map = new ol.Map({ 

      [...] 

       controls: ol.control.defaults().extend([ 
        new ol.control.ScaleLine(), 

        new ol.control.LayerSwitcher({ 
         tipLabel: 'Switch base layers' 
        }) 
       ]) 
      }); 

      Backbone.View.prototype.initialize.apply(this, arguments); 
      this.render(); 
      this.LOG.debug("Map View rendered"); 
     } 
    }); 

    return view; 
}); 

在V浏览模块试图同时引入OpenLayers3和第三方OpenLayers插件。

当项目建立和部署时，它可以在浏览器中正常工作。当视图模块被加载时，OpenLayers和第三方插件就可以正常工作了，一切都能正常呈现。

但是，当我试图在茉莉花测试这是所有这些崩溃。

对于Jasmine，我使用的是Jasmine-Maven插件。它与我的图书馆一起拉入JasmineJS，PhantomJS和RequireJS并运行我的规格。问题是，当通过Jasmine运行时，MapView模块尝试加载OpenLayers3库以及第三方插件（olLayerSwitcher），但由于第三方插件找不到“ol”而失败。

测试：

define([ 
    "backbone", 
    "sinon", 
    'controller/AppRouter' 
], function (Backbone, sinon, Router) { 
    describe("Router", function() { 
     beforeEach(function() { 
      this.router = new Router(); 
      this.routeSpy = sinon.spy(); 
      this.router.bind("route:mapView", this.routeSpy); 

      try { 
       Backbone.history.start({silent: true}); 
      } catch (e) { 
      } 
      this.router.navigate("elsewhere"); 
     }); 

     it("does not fire for unknown paths", function() { 
      this.router.navigate("unknown", true); 
      expect(this.routeSpy.notCalled).toBeTruthy(); 
     }); 

     it("fires the default root with a blank hash", function() { 
      this.router.navigate("", true); 
      expect(this.routeSpy.calledOnce).toBeTruthy(); 
      expect(this.routeSpy.calledWith(null)).toBeTruthy(); 
     }); 
    }); 
}); 

从茉莉花错误：

[ERROR - 2015-08-08T21:27:30.693Z] Session [4610ead0-3e14-11e5-bb2b-dd2c4b5c2c7b] - page.onError - msg: ReferenceError: Can't find variable: ol 

:262 in error 
[ERROR - 2015-08-08T21:27:30.694Z] Session [4610ead0-3e14-11e5-bb2b-dd2c4b5c2c7b] - page.onError - stack: 
global code (http://localhost:58309/js/vendor/ol3- layerswitcher/1.0.1/ol3-layerswitcher.js:9) 

:262 in error 
JavaScript Console Errors: 

* ReferenceError: Can't find variable: ol 

从OL3-layerswitcher插件第9行相关的部分是：

[...] 
ol.control.LayerSwitcher = function(opt_options) { 
[...] 

所以它取决于“ol”是否在这一点上。

茉莉花，Maven插件创建其自己的规格亚军HTML和相关的部分看起来像这样：

<script type="text/javascript"> 
if(window.location.href.indexOf("ManualSpecRunner.html") !== -1) { 
    document.body.appendChild(document.createTextNode("Warning: Opening this HTML file directly from the file system is deprecated. You should instead try running `mvn jasmine:bdd` from the command line, and then visit `http://localhost:8234` in your browser. ")) 
} 

var specs = ['spec/controller/AppRouterSpec.js']; 

var configuration = { 
    paths: { 
    "sinon": ['/webjars/sinonjs/1.7.3/sinon'], 
    "jquery": ["/webjars/jquery/2.1.4/jquery"], 
    "backbone": ['/webjars/backbonejs/1.2.1/backbone'], 
    "underscore": ['/webjars/underscorejs/1.8.3/underscore'], 
    "text": ['/webjars/requirejs-text/2.0.14/text'], 
    "log4js": ['/webjars/log4javascript/1.4.13/log4javascript'], 
    "ol": ['/webjars/openlayers/3.5.0/ol'], 
    "olLayerSwitcher": ['/js/vendor/ol3-layerswitcher/1.0.1/ol3-layerswitcher'] 
    }, 
    shim: { 
    "olLayerSwitcher": { 
     deps: ["ol"], 
     exports: "olLayerSwitcher" 
    }, 
    'sinon' : { 
     'exports' : 'sinon' 
    } 
    } 
}; 

if (!configuration.baseUrl) { 
    configuration.baseUrl = 'js'; 
} 

if (!configuration.paths) { 
    configuration.paths = {}; 
} 

if (!configuration.paths.specs) { 
    var specDir = 'spec'; 
    if (!specDir.match(/^file/)) { 
     specDir = '/'+specDir; 
    } 
    configuration.paths.specs = specDir; 
} 

require.config(configuration); 

require(specs, function() { 
    jasmine.boot(); 
}); 

我能够创建一个客户HTML亚军，但我不知道是什么问题是如此我不知道需要改变什么。

这似乎并不是一个PhantomJS问题，因为我可以在浏览器中加载测试，并且遇到同样的问题。

如果有人对这里可能发生的事情有任何想法，我将不胜感激。我真的不想破解第三方模块，将它转换成RequireJS模块，因为茉莉花测试是完全实现它的最后一步，我完全陷在这里。

我使用茉莉花2.3.0和2.1.18 RequireJS

我不连接更多道歉，但是这是一个新的帐户，我没有足够的代表吧。

Answer 1

如果没有安装的运行版本，就很难找出问题所在。 但是，如果您能够自定义由maven插件生成的jasmine的SpecRunner.html，只需在SpecRunner html-<script src="/<path_to_lib>">中包含茉莉花（/任何其他导致问题的库）。

根据我的经验，它通常不值得付出努力，使库在源代码兼容的情况下使用，并与其他所有库一起使用以便进行测试设置。