Bing 地图的 Chutzpah CDN 问题

Question

我正在使用 Chutzpah 测试我的 TypeScript，它似乎无法识别 Bing Maps 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);
    });
});
}

运行测试结果出错：'MapViewer tests:should have a map' 失败 ReferenceError：找不到变量：Microsoft in file://.../_Chutzpah.83.MapViewer.js.

顺便说一句，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 /> 注入到生成的 HTML 中。

测试 (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" }
   ]
 }

Bing 地图的 Chutzpah CDN 问题

Chutzpah CDN issue with Bing Maps

javascript

typescript

bing-maps

chutzpah