问题描述:
在使用Jest进行快照测试时,发现Angular CDK Overlay组件在快照中没有显示出来。
解决方法:
import { OverlayModule } from '@angular/cdk/overlay';
import { Component, NgModule } from '@angular/core';
import { TestBed } from '@angular/core/testing';
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
import { MyComponent } from './my.component';
@Component({
template: `
`
})
class TestHostComponent {}
@NgModule({
declarations: [TestHostComponent, MyComponent],
imports: [OverlayModule, NoopAnimationsModule],
exports: [TestHostComponent]
})
class TestHostModule {}
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [TestHostModule]
})
.compileComponents();
}));
it('should display overlay', () => {
const fixture = TestBed.createComponent(TestHostComponent);
fixture.detectChanges();
expect(fixture).toMatchSnapshot();
});
这样,运行Jest测试时,会生成一个包含Overlay组件的快照,可以在快照中查看和验证Overlay的显示情况。
注意:确保在运行Jest测试之前,已安装并配置了Jest、Angular CDK和相关的测试工具和库。