必应地图的Chutzpah CDN问题

Question

我正在使用Chutzpah测试我的TypeScript，它似乎不认识Bing地图CDN："http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0“。我尝试将它作为引用路径包含在chutzpah.json文件中，但没有效果。知道我做错了什么吗？

资料来源(MapViewer.ts):

/// <reference path="../scripts/typings/bingmaps/microsoft.maps.d.ts" />

module Viewers {
export class MapViewer {
    private containerName: string;
    private map: Microsoft.Maps.Map;

    constructor(theContainerName: string) {
        this.containerName = theContainerName;
        this.map = new Microsoft.Maps.Map(document.getElementById(this.containerName));
    }
}

试验(MapViewerTest.ts)

///<reference path="../../lib/jasmine/jasmine.d.ts"/>
///<reference path="../../../FrontEndTools.WebUI/Services/MapViewer.ts"/>

module Viewers {
describe("MapViewer tests",() => {
    var viewer = null;

    beforeEach(() => {
        viewer = new MapViewer("myMapContainer");
    });

    it("should have a map",() => {
        var result = viewer;
        expect(result);
    });
});
}

运行测试结果出现错误：‘file://.../_Chutzpah.83.MapViewer.js.中的MapViewer测试:应该有一个映射’失败的ReferenceError:无法找到变量: Microsoft

顺便说一句，jQuery CDN作为参考路径工作得很好。包含jQuery的源的测试成功运行。

Chutzpah.json

 {
  "Framework": "jasmine",
  "TestHarnessReferenceMode": "Normal",
  "TypeScriptModuleKind": "CommonJS",
  "TypeScriptCodeGenTarget": "ES5",
  "References" : [
   { "Path": "FrontEndTools.WebUI/lib/knockout.js" },
   { "Path": "http://code.jquery.com/jquery-2.1.0.min.js" },
   { "Path": "http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0" }
   ]
 }

Answer 1

问题是，Chutzpah假设JS文件将具有.js扩展名。在未来，这可以被修复，这样它就假设没有扩展，您打算使用.js，因为这是最常见的。

要想解决这个问题，现在只需提供一个虚拟的扩展，例如：

 {
  "Framework": "jasmine",
  "TestHarnessReferenceMode": "Normal",
  "TypeScriptModuleKind": "CommonJS",
  "TypeScriptCodeGenTarget": "ES5",
  "References" : [
   { "Path": "FrontEndTools.WebUI/lib/knockout.js" },
   { "Path": "http://code.jquery.com/jquery-2.1.0.min.js" },
   { "Path": "http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0#dummy.js" }
   ]
 }

Answer 2

基于Matthew的答案，这就是我最后测试的代码，实例化Bing地图。我不得不进一步引用Veapicore.js，并将一个容器<div />注入到生成的<div />中。

试验(MapViewerTest.ts)

///<reference path="../../lib/jasmine/jasmine.d.ts"/>
///<reference path="../../../FrontEndTools.WebUI/scripts/typings/jquery/jquery.d.ts" />
///<reference path="../../../FrontEndTools.WebUI/Services/MapViewer.ts"/>

module Viewers {
describe("MapViewer tests",() => {
    var viewer = null;

    beforeEach(() => {
        // Inject a container into the page 
        // before instantiating the map.
        var mapContainerName = "myMapContainer";
        var $div = $('<div />').appendTo('body');
        $div.attr('id', mapContainerName);

        viewer = new MapViewer(mapContainerName);
    });

    it("should have a map",() => {
        var result = viewer;
        expect(result).toBeDefined();
    });
});
}

Chutzpah.json

 {
  "Framework": "jasmine",
  "TestHarnessReferenceMode": "Normal",
  "TypeScriptModuleKind": "CommonJS",
  "TypeScriptCodeGenTarget": "ES5",
  "References" : [
   { "Path": "FrontEndTools.WebUI/lib/knockout.js" },
   { "Path": "http://code.jquery.com/jquery-2.1.0.min.js" },
   { "Path": "http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0#dummy.js" },
   { "Path": "http://ecn.dev.virtualearth.net/mapcontrol/v7.0/7.0.20140904153057.64/js/en-us/veapicore.js" }
   ]
 }