Question

我正在尝试在我的karma配置文件中包含一个简单的html文件，以便从我的javascript文件中访问html元素，并在karma中使用jasmine进行测试。

但我总是遇到意外的令牌＆lt; 错误。我在网络广播中看到可以包含html文件，但我不知道为什么它不能用于我的配置？

提前致谢

Answer 1

通过karma配置，您必须注册要在测试中使用的每个文件。您可以通过在配置中的files数组中添加模式来实现此目的。

文件模式如下所示：

files: [
    {
        pattern: 'test/unit/*.js',
        watched: true, //watching file modifications for test autorun
        included: true, //included as <script src="..."> in the runner html file
        served: true //used by tests (the test server should serve it)
    }
]

您可以使用短格式语法：

files: [
    'test/unit/*.js'
]

这意味着与之前的模式完全相同。

如果您不想在包含<script src="file.js"></script>的测试中使用您的文件，那么您已经使用included: false并通过AJAX从测试中加载文件。请注意，您应该使用相对URL，因为测试服务器的域可以随时更改...

模式顺序也很重要，它使用反向覆盖：

files: [
     {pattern: '*.js', included: true}
     {pattern: '*.js', included: false}
]

在这种情况下，将包含每个js文件，因此第一个模式将覆盖第二个模式。

例如通过html文件：

karma config：

files: [
     {pattern: 'bootstrap.js', included: true}
     {pattern: 'x.html', included: false}
]

<强> bootstrap.js：

var xhr = new XMLHttpRequest();
xhr.open('get', '/base/x.html', false);
xhr.send();
console.log(xhr.status, xhr.responseText); //200, '<html content>'

URI始终具有/base前缀，因为Karma在顶层存储自己的index.html和js文件，因此需要一个子文件夹。如果要查找提供的URI，可以使用以下代码：

var servedUris = Object.keys(window.__karma__.files);

我写了一些基本的fs内容来支持Yadda的同步读取：https://github.com/acuminous/yadda/blob/master/lib/shims/karma-fs.js您可以将它移动到另一个项目扩展它，并使用fs代替AJAX浏览器。至少我是如何使用Browserify做的。

Answer 2

我最终在我的Karma安装中为lib/middleware/karma.js文件制作了一个简单的补丁。它使用扩展名.literal来表示“只是将整个文件回显到页面上”。我总是觉得很奇怪Karma没有内置的方法来做到这一点。我的方式肯定不是很出色，但对你来说可能已经足够了。

这样你就可以进入你的karma.conf.js：

// ...
files: [
   "path/to/my_html.literal", // Echoed directly onto the page
   "path/to/other.js",        // Normal behaviour
   // ...
],

我的嵌套scriptTags函数（在createKarmaMiddleware内）看起来像这样：

var scriptTags = files.included.map(function(file) {
  var filePath = file.path;
  var fileExt = path.extname(filePath);

  // Include .literal files directly into the body of the HTML.
  if (filePath.match(/.literal$/)) {
     var fs = require("fs");
     return fs.readFileSync(filePath, "utf-8");
  }

  // ...

差异在这里：https://github.com/amagee/karma/commit/c09346a71fc27c94cc212a2bd88b23def19ec3a4

Answer 3

如果使用AngularJS，您需要使用html2js preprocessor（或ng-html2js预处理器）。请参阅预处理器描述以了解其工作原理。

自Karma 0.10起，html2js预处理器随Karma一起提供并默认配置：

module.exports = function(config) {
  config.set({
    files: [
      'templates/*.html'
    ],
    preprocessors: {
      '**/*.html': ['html2js']
    }
  });
};

然后您可以将JS内容作为JS字符串访问：

var elm = $(__html__['templates/x.html'])

您获得的错误意味着HTML文件未经过预处理。默认情况下，basePath下的所有HTML文件都经过预处理，因此您的HTML文件可能位于其他位置，在这种情况下，您需要明确地将它们放在preprocessors配置中。如果您需要更多帮助，请分享您的karma.conf.js。

Karma - 包含html文件时出现意外的令牌

3 个答案: