javascript – 如何使用Snap.svg在Karma中编写与SVG图形交互的单元测试？

我正在开发一个Web应用程序,它使用SVG图形进行大部分显示和交互.我想使用Karma创建加载SVG资产的单元测试,确保存在某些组/路径等.

我还没有找到任何直截了当的答案,如何做到这一点,或者我自己想出来的.我试图让这样一个简单的测试通过(使用mocha& chai)：

describe("SimpleDecalRoulette", function() {
      it("decal SVG can be loaded", function() {
        var decalLoaded = false;    
        var SVG = Snap.load("/base/app/img/decal.svg", function(fragment) {
          decalLoaded = true;
        });
        expect(decalLoaded).to.be.true;
      });
    });

最初,我假设在karma.conf.js的“files”指令中包含svg文件就足够了：

files: [
  { pattern: 'app/bower_components/lodash/dist/lodash.min.js', watched: false, included: true, served: true },
  { pattern: 'app/bower_components/jquery/dist/jquery.min.js', watched: false, included: true, served: true },
  { pattern: 'app/bower_components/snap.svg/dist/snap.svg-min.js', watched: false, included: true, served: true },
  { pattern: 'app/js/\*\*/\*.js', watched: true, included: true, served: true },
  { pattern: 'app/img/decal.svg', watched: true, included: false, served: true },
  { pattern: 'app/img/assets.svg', watched: true, included: false, served: true },
  'tests/\*\*/\*_spec.js'
],
proxies: {
  '/app/img/': '/base/app/img/'
}

但是,尝试从app / img / decal.svg或base / app / img / decal.svg加载svg文件都会导致404错误.我也尝试使用’代理’指令,详见this SO answer,但还没有让它工作(如上所示).

这是业力可以做的事情,还是应该以不同方式处理的用例？我需要加载并与SVG交互,因为业力在为这个游戏编写单元测试时很有用.

解决方法:

我正在做同样的事情,并让它工作.

我的karma.conf.js包含files数组中的svg文件：

{pattern：’src / svg / * .svg’,包括：false,serve：true}

在测试中我可以将其加载为：

Snap.load( ‘基/ SRC / SVG / Drawing.svg’,…);

我测试的主要区别在于我使用延迟来确保在执行任何断言之前加载SVG的方式.我正在使用Jasmine 2.0,它允许在it函数内完成回调.

it('Should load the SVG', function(done) {
   Snap.load('base/src/svg/Drawing.svg', function (fragment) {
     expect(...).toBe(...);
     done();
   });
});

您可以在此处阅读有关异步支持的更多信息：http://jasmine.github.io/2.0/introduction.html#section-Asynchronous_Support

版本1.3：http://jasmine.github.io/1.3/introduction.html#section-Asynchronous_Support

标签：javascript,svg,karma-runner,snap-svg,karma-mocha
来源： https://codeday.me/bug/20190708/1405422.html