Angularjs 使用Jest在Angular 1.x上进行快照测试

我想使用Jest快照测试angular 1.x指令。 我已经有了一个使用jest的工作测试环境，但我不确定如何（如果可以）对指令/组件进行快照测试

我不认为我可以使用本例中使用的renderer对象（看起来像一个react-specific对象），而且我不确定如何使用.toJSON（）函数来序列化我的指令/组件

这是我在Jest+Angular 1.x用法中找到的唯一链接： 我找不到关于快照测试的任何答案

提前感谢,

费德里科

它很管用

test.js

const angular = require('angular');
require('angular-mocks');

describe('Renderer', () => {
  let element;
  let scope;

  beforeEach(
    angular.mock.inject(($rootScope, $compile) => {
      scope = $rootScope.$new();
      element = $compile(
        '<div><label ng-show="label.show">1</label><label ng-hide="label.show">2</label></div>'
      )(scope);
      scope.$digest();
    })
  );

  it('should render the element', () => {
    expect(element).toBeDefined();
    expect(element[0]).toMatchSnapshot();
  });
});

const angular=require（'angular'）；
要求（“角度模拟”）；
描述（'Renderer'，（）=>{
let元素；
让范围；
之前(
angular.mock.inject（$rootScope，$compile）=>{
scope=$rootScope.$new（）；
元素=$compile(
'12'
)（范围）；
范围。$digest（）；
})
);
它（'应该呈现元素'，（）=>{
expect（element.toBeDefined（）；
expect（元素[0]）.toMatchSnapshot（）；
});
});

快照

exports[`Renderer should render the element 1`] = `
<div
  class="ng-scope"
>
  <label
    class="ng-hide"
    ng-show="label.show"
  >
    1
  </label>
  <label
    ng-hide="label.show"
  >
    2
  </label>
</div>
`;

exports[`Renderer应该呈现元素1`]=`
1.
2.
`;

您发现这方面的任何信息了吗？我对tooTobias很感兴趣，遗憾的是没有答案，也没有时间自己找到任何新答案在您的示例中，您正在使用硬编码字符串作为模板。如何导入和使用HTML模板？如何将变量注入模板？模板取决于您的设置。您可以在

$compile

调用中要求html，也可以使用

$ngTemplateCache

。我已经在模板中使用变量

标签
是
$scope
上的变量。范围在
$compile
调用的第二个大括号中是必需的