我如何在Visual Studio中为NightwatchJS使用intellisense

Question

我如何在Visual Studio中为NightwatchJS使用intellisense？

使用任何本机支持的方法来解决此问题均未取得丰硕的成果，我花了很多时间在网上搜索其他人是如何做到这一点的，没有运气。

Answer 1

为了解决这个问题，我创建了一个名为vs-intellisense-definitions.js的文件

然后在所有我的夜视文件中，我通过以下方式引用了此信息以进行智能感知：

/// <reference path="../helpers/vs-intellisense-definitions.js" />

然后，我创建了一个脚本来生成所有方法定义，这是通过导航到Nightwatch api网站（http://nightwatchjs.org/api），打开开发人员控制台并运行以下脚本来完成的。输出是一个javascript字符串，只需将其复制并粘贴到vs-intellisense-definitions.js中>

(function(){var m = $('.apimethod').map(function(i, el)
{
  var methodlink = location.href.slice(0, location.href.indexOf('#') === -1 ? location.href.length : location.href.indexOf('#'))+'#'+$(el).find('h3').attr('id');
  var a = { 
    "name":$(el).find('h3 code').first().text(),
    "summary":$(el).find('p').first().text() +" Link:"+methodlink,
    "params": []
  };
  $(el)
    .find('.table-responsive table').first()
    .find('tr')
    .filter(function(i, el){ return $(el).find('th').size() === 0; })
    .each(function(i, tr)
    {
      var tds = $(tr).find('td');
      a.params.push({
        "name":$(tds[0]).find('code').text(),
        "type":$(tds[1]).text(),
        "optional":$(tds[0]).find('.optional').size()>0,
        "description":$(tds[2]).text()
      });
    });
  return a;
}).toArray();

m = m.filter(function(el){ return ["Language Chains"].indexOf(el.name) === -1; });

m = Array.prototype.concat.apply([], m.map(function(el){
  return el.name.split('/').map(function(subN)
  {
    var n = JSON.parse(JSON.stringify(el));
    n.name = subN;
    if(n.params.length === 0 && n.name.indexOf('(') !== -1)
    {
      n.params = n.name.slice(n.name.indexOf('(')+1, n.name.indexOf(')')).split(",").map(function(mn){ return {"name":mn}; });
    }
    var taken=[];
     n.params.forEach(function(p, i)
     { 
       if(taken.indexOf(p.name) === -1) taken.push(p.name);
       else p.name = p.name+i;
    });
    if(n.name.indexOf('(') !== -1)n.name = n.name.slice(0, n.name.indexOf('('));
    n.name = n.name.replace(/\./gim, "");
    return n;
  });
}));

return "\n\n\nfunction _Browser(){\n"+m.map(function(el){
  return "this."+ el.name+" = function("+el.params.map(function(m){ return m.name; }).join(', ') + ")\n{\n/// <summary> "+el.summary+" </summary>\n"+ el.params.map(function(p)
    { 
      var str = "/// <param ";
      if(p.name)str += "name=\""+p.name+"\" ";
      if(p.type)str += "type=\""+p.type+"\" ";
      str += "optional=\""+(p.optional?"true":"false")+"\" ";
      return str+"> " + (p.description || "") + " </param>";
    }).join("\n")+"\n/// <returns type=\"_Browser\">Browser instance</returns>\n};\n";
}).join('\n')+"\n}\n\n\n";})();
全部加载并引用完之后，我只是通知Nightwatch测试属于浏览器参数的“类型”。例如：

/// <reference path="../helpers/vs-intellisense-definitions.js" /> 
module.exports = {
    "Test Name": function (browser)
    { /// <param name="browser" type="_Browser">

        // Intellisense success!
        browser.
    }
}
很明显，对API进行的任何较大更改都需要重新构建文件，但这不会经常发生。

Answer 2

我尝试过这个。没用我按照指令将脚本的输出粘贴到vs-intellisense-definitions.js中，但是它显示了很多语法错误。