html - 带 Angular 单元测试css

Question

有什么方法可以测试元素的 height css 属性吗？

我有一个函数可以改变 div 的高度，如果能在测试中检查该函数是否正常运行就好了...

即:

<div #myDiv>Hello world</div>

---

@ViewChild('myDiv') myDiv: ElementRef;

myFunct() {
  this.myDiv.nativeElement.style.height = 500;
}

---

it('should increase div size', () => {
  // Here is where I get stuck...
});

更新

实现测试，例如:

it('should return correct height of dropdown when initialised', () => {
    component.myFunct();

    expect(component.dropdown.nativeElement.style.height).toBe(34);
  });

导致测试失败并显示消息:

Expected '' to be 500.

Answer 1

像这样的……

1. 公开公开 myDiv

2. 为组件设置测试平台(通常默认添加)

3. 添加

component.myFunct();

expect(component.myDiv.nativeElement.style.height).toBe(500);