TFS 2017 工作项扩展不起作用

TFS 2017 Work item Extension not working

此 TS 脚本的新手,因此需要一些帮助, 我正在尝试创建一个从 4 个工作项字段创建 url 的扩展。 示例贡献:

{
"manifestVersion": 1,
"id": "tritech-tfsurl-control",
"version": "0.1.18",
"name": "tritech-tfsurl-control",
"scopes": [ "vso.work", "vso.work_write" ],
"description": "4 fields to a url",
"publisher": "TriTech-Software-Systems",
"icons": {
    "default": "img/logo.png"
},
"targets": [
    {
        "id": "Microsoft.VisualStudio.Services"
    }
],
"tags": [
    "Work Item",
    "Work Item control",
    "Url",
    "Url tfs server"
],
"content": {
    "details": {
        "path": "details.md"
    }
},
"links": {
    "home": {
        "uri": "http://www.Tritech.com"
    }
},
"branding": {
    "color": "rgb(220, 235, 252)",
    "theme": "light"
},
"files": [
    {
        "path": "img",
        "addressable": true
    },        
    {
        "path": "index.html",
        "addressable": true
    }
],
"categories": [
    "Plan and track"
],
"contributions": [
    {
        "id": "tfsurlcontrol-action",
        "type": "ms.vss-work-web.work-item-form-control",
        "description": "Work Item fields to create url from",
        "targets": [
            "ms.vss-work-web.work-item-form"
        ],
        "properties": {
            "name": "tfsurl-control",
            "uri": "index.html",
            "height": 90,
            "inputs": [
      {
        "id": "PreviousTFSServer",
        "description": "The TFS server url that has the work item.",
        "type": "WorkItemField",
        "properties": {
          "workItemFieldTypes": [ "String" ]
        },
        "validation": {
          "dataType": "String",
          "isRequired": true
        }
      },
      {
        "id": "TFSCollection",
        "description": "The original tfs collection name",
        "type": "WorkItemField",
        "properties": {
          "workItemFieldTypes": [ "String" ]
        },
        "validation": {
          "dataType": "String",
          "isRequired": true
        }
      },
      {
        "id": "TfsTeamProject",
        "description": "Original TFS project name",
        "type": "WorkItemField",
        "properties": {
          "workItemFieldTypes": [ "String" ]
        },
        "validation": {
          "dataType": "String",
          "isRequired": true
        }
      },
      {
        "id": "TfsWorkItemId",
        "description": "Original work item id",
        "type": "WorkItemField" ,
        "properties": {
          "workItemFieldTypes": [ "Integer" ]
        }          
      }
    ]    
        }
    }
]

}

然后在我的 App.ts 文件中是这样的,

///<reference types="vss-web-extension-sdk" />
import { Controller } from "./control";
import * as ExtensionContracts from "TFS/WorkItemTracking/ExtensionContracts";
import { WorkItemFormService } from "TFS/WorkItemTracking/Services";

var control: Controller;

var provider = () => {
    return {
  onLoaded: (workItemLoadedArgs: ExtensionContracts.IWorkItemLoadedArgs) => {   
            control = new Controller();
        }
    }
};

VSS.register(VSS.getContribution().id, provider);

这是我的 Control.ts 文件,

` 私人 _initialize(): void {

    this._inputs = VSS.getConfiguration().witInputs;
    this._ServerFieldName = this._inputs["PreviousTFSServer"];
    this._CollectionFieldName = this._inputs["TFSCollection"];
    this._ProjectFieldName = this._inputs["TFSTeamProject"];
    this._WorkItemIdFieldName =  this._inputs["TfsWorkItemId"];

    WitService.WorkItemFormService.getService().then(
        (service) => {
            Q.spread<any, any>(
                [ service.getFieldValue(this._ServerFieldName),service.getFieldValue(this._CollectionFieldName),
                service.getFieldValue(this._ProjectFieldName),service.getFieldValue(this._WorkItemIdFieldName)],
                (server: string, collection: string, project:string, id: number) => {
                 this._view = new View(server,collection,project,id);
                 }, this._handleError
            ).then(null, this._handleError);
        },
        this._handleError);
}    

private _handleError(error: string): void {
    let errorView = new ErrorView(error);
}

} ` 然后我加了一个view.ts

export class View {

    constructor(server: string, collection: string, project: string, id: number) {
        // container div
        if(server)
        {
            var Container = $("<div />");
            var workItemUrl = $("<span></span>").text("Original work item");
            var a = $("<a> </a>");
            var url = 'server + "/" + collection + "/" + project + "/_workitemId?=" + String(id)'
            a.attr("href", url );
            a.attr("target", "_blank");
            a.text("here.");
            workItemUrl.append(a);
            //$('body').empty().append(Container);
            $(".events").append(workItemUrl);
        }
    }
}

       <Input Id="PreviousTFSServer" Value="TriTech.Source.Server" />
              <Input Id="TFSCollection" Value="TriTech.Source.Collection" />
              <Input Id="TFSTeamProject" Value="TriTech.Source.Project" />
              <Input Id="TfsWorkItemId" Value="TriTech.Source.Id" />
            </Inputs>
          </ControlContribution>
        </Group>`

我从最新版本的 vsts-extension-ts-seed-simple-master 包开始。编译并创建扩展,但我没有看到任何 url 或 link.

我错过了什么? WIT 已编辑为使用扩展名。

Web 调试显示正在加载,

{"id":"TriTech-Software-Systems.tritech-tfsurl-control.tritech-tfsurlcontrol-action","description":"Work Item fields to create url from","type":"ms.vss-work-web.work-item-form-control-group","targets":["ms.vss-work-web.work-item-form"],"properties":{"name":"tritech-tfsurl-control","uri":"index.html","height":90,"inputs":[{"id":"PreviousTFSServer","description":"The TFS server url that has the work item.","type":"WorkItemField","properties":{"workItemFieldTypes":["String"]},"validation":{"dataType":"String","isRequired":true}},{"id":"TFSCollection","description":"The original tfs collection name","type":"WorkItemField","properties":{"workItemFieldTypes":["String"]},"validation":{"dataType":"String","isRequired":true}},{"id":"TfsTeamProject","description":"Original TFS project name","type":"WorkItemField","properties":{"workItemFieldTypes":["String"]},"validation":{"dataType":"String","isRequired":true}},{"id":"TfsWorkItemId","description":"Original work item id","type":"WorkItemField","properties":{"workItemFieldTypes":["Integer"]}}],"::Attributes":16,"::Version":"0.1.20"}}

提前致谢。

我最终使用静态值并使其正常工作。

var Provider = () => {
        this.ServerfieldName = "Source.Server"; 
        this.CollectionfieldName = "Source.Collection";  
        this.ProjectfieldName = "Source.Project";  
        this.WorkItemIdfieldName = "Source.Id";  
        this._view = View;

        return{
                onLoaded: (WorkItemLoadedArgs: ExtensionContracts.IWorkItemLoadedArgs) => {
            var deferred = Q.defer();
            
            WorkItemFormService.getService().then(
            (service) => {
                Q.spread<any, any>(
                    [service.getFieldValue(this.ServerfieldName),service.getFieldValue(this.CollectionfieldName),
                    service.getFieldValue(this.ProjectfieldName),service.getFieldValue(this.WorkItemIdfieldName)],
                                        (server: string, collection: string, project: string, workitemId: number) => {
                                        
                                        var data =(`${server}/${collection}/${project}/_workitems#_a=edit&id=${workitemId}`);
                                        if(server){
                                            this._view = new View(data);
                                        }
                                        else{
                                            $('body').empty().append("This is the original Work Item");
                                        }
                                        
                    })
                    .catch(function (e) {deferred.reject(e)} 
                ); 
                return deferred.promise;  //.then(null);
            }
        )}

    }    
};

并使用了视图,

/// <reference path="../typings/index.d.ts" />
export class View {    

    constructor(public value:string) {
        
            var Container = $("<div role='link'> </div>");
            Container.addClass("Container");
            Container.attr('tabindex', '0');
            var rdiv = $("<div/>").addClass("rightDiv");
            var ldiv = $("<div/>");
            var help = $("<span></span>").text("Original Tfs work item ");

            var a = $("<a> </a>");
            a.attr("href", value);
            a.attr("target", "_blank");
            a.text("here.");
            help.append(a);
            ldiv.append(help);
            Container.append(rdiv);
            Container.append(ldiv);
            $('body').empty().append(Container);
        
    }
    
}