Angular 2测试 - 获取DOM元素样式

Question

我想在我的Angular 2应用程序中测试我的隐藏显示按钮的功能(测试是用Jasmine编写的),所以我需要检查display相关元素的属性值.如何使用Angular获取此属性debugElement？测试代码:

let input = fixture.debugElement.query(By.css('input'));
expect(input.styles['visibility']).toBe('false');

我收到错误:预期未定义为'false'.

Answer 1

我有同样的问题。将DebugElement.styles始终是即使我设置一些风格到该元素明确一个空的对象（角码，也许错误？）。所以我宁愿native element直接从浏览器中获取：

let input = fixture.debugElement.query(By.css('input'));
expect(input.nativeElement.style.visibility).toBe('false');

Answer 2

对于任何偶然发现此示例的人来说，此特定问题的解决方案display是. 如果元素被隐藏，它将包含，否则。hiddendebugElementtruefalse