文章/答案/技术大牛

发布

社区首页 >问答首页 >尝试运行"ng MatSnackBar“时没有提供程序出现测试错误

问尝试运行"ng MatSnackBar“时没有提供程序出现测试错误
EN

Stack Overflow用户

提问于 2018-06-09 04:58:04

回答 3查看 32K关注 0票数 29

所以我试着在我的Angular 4 Angular CLI上运行"ng test“。我有很多问题，比如如果测试失败，UI不能加载任何有用的消息，但幸运的是控制台可以工作。不管怎样，出现这个错误是因为我没有在规范中给MatSnackBar提供一个提供者，但是当我这样做的时候，我得到了一个不同的错误。

Chrome 66.0.3359 (Linux 0.0.0) BranchNameCellComponent should create FAILED
    Error: No provider for MatSnackBar!

将MatSnackBar包含为导入时出错

Chrome 66.0.3359 (Linux 0.0.0) BranchNameCellComponent should create FAILED
    Failed: Unexpected value 'MatSnackBar' imported by the module 'DynamicTestModule'. Please add a @NgModule annotation.

在我的组件代码中，我导入了MatSnackBar并在构造函数中调用它。它工作得很好。

import { MatSnackBar } from '@angular/material';
....
constructor(private httpClient: HttpClient, private fb: FormBuilder, public snackBar: MatSnackBar) { }

但在规范中，我尝试了一下，但没有用。

import { MatSnackBar } from '@angular/material';
....
describe('BranchNameCellComponent', () => {
  let component: BranchNameCellComponent;
  let fixture: ComponentFixture<BranchNameCellComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ BranchNameCellComponent ],
      imports: [ HttpClientTestingModule, ReactiveFormsModule, MatSnackBar ],
      schemas: [ NO_ERRORS_SCHEMA ]
    })
    .compileComponents();
  }));

  it('should create', () => {
    fixture = TestBed.createComponent(BranchNameCellComponent);
    component = fixture.componentInstance;
    expect(component).toBeTruthy();
  });
});

按照Diego的建议导入模块后，我现在在同一个测试中得到一个超时错误

08 06 2018 16:14:52.839:WARN [Chrome 66.0.3359 (Linux 0.0.0)]: Disconnected (1 times), because no message in 10000 ms.
Chrome 66.0.3359 (Linux 0.0.0) ERROR
Chrome 66.0.3359 (Linux 0.0.0) ERROR
  Disconnected, because no message in 10000 ms.
Chrome 66.0.3359 (Linux 0.0.0): Executed 16 of 56 DISCONNECTED (11.204 secs / 1.241 secs)
Chrome 66.0.3359 (Linux 0.0.0) ERROR
Chrome 66.0.3359 (Linux 0.0.0): Executed 16 of 56 DISCONNECTED (11.204 secs / 1.241 secs)

angular-cli

angular

testing

angular-material

回答 3

Stack Overflow用户

回答已采纳

发布于 2018-06-09 05:01:38

您应该导入模块而不是组件。

import { MatSnackBar, MatSnackBarModule } from '@angular/material';
....
describe('BranchNameCellComponent', () => {
  let component: BranchNameCellComponent;
  let fixture: ComponentFixture<BranchNameCellComponent>;
    
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ BranchNameCellComponent ],
      imports: [ HttpClientTestingModule, ReactiveFormsModule, MatSnackBarModule ],
      schemas: [ NO_ERRORS_SCHEMA ]
    }).compileComponents();
  }));
    
  it('should create', () => {
    fixture = TestBed.createComponent(BranchNameCellComponent);
    component = fixture.componentInstance;
    expect(component).toBeTruthy();
  });
});

对于与超时相关的问题，请尝试将以下内容添加到karma配置文件中：

captureTimeout: 210000,
browserDisconnectTolerance: 3, 
browserDisconnectTimeout : 210000,
browserNoActivityTimeout : 210000,

票数 43

Stack Overflow用户

发布于 2020-07-10 15:23:10

当我在我的angular应用程序中导航到某个延迟加载的模块时，我遇到了这个错误。此模块正在导入MatSnackBarModule，但我还需要在app.module.ts文件中导入MatSnackBarModule

票数 6

Stack Overflow用户

发布于 2021-02-15 00:12:45

最近在我身上发生了这样的事情，我决定这样做：

包括文件aap.module.ts

import { MatSnackBarModule } from '@angular/material/snack-bar';
...
...
imports: [
    ...
    MatSnackBarModule
  ]
...

在文件组件或服务上：

import { MatSnackBar } from '@angular/material/snack-bar';
...
...
constructor(private snackBar: MatSnackBar) { }
...

票数 5

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/50768318

复制

相似问题

问尝试运行"ng MatSnackBar“时没有提供程序出现测试错误
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问尝试运行"ng MatSnackBar“时没有提供程序出现测试错误EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问尝试运行"ng MatSnackBar“时没有提供程序出现测试错误
EN