Angular Tests随机打破:“Uncaught TypeError:你提供了'undefined',预计会有一个流。”

问题描述 投票:8回答:1

我们有一个中等角度的应用程序,目前约有700个单元测试。几个星期前,完美的测试开始破裂。更奇怪的是:两次运行测试会产生不同的结果,即不同的测试可能会中断。在控制台中,我们总能找到错误:

未捕获的TypeError:您在预期的流中提供了“未定义”。

但是堆栈跟踪没有提示错误的根实际位于何处(参见本文末尾)。堆栈跟踪显示了与mergeMap运算符的连接,但事实证明我们在我们的应用程序中没有使用此运算符,在我们的测试中没有任何地方。

我浏览了所有的spec文件并让它们自行运行(使用fdescribe)。每个spec文件都没有错误地传递。将它们一起运行会导致所描述的破损。

当然我的猜测是我们遇到了一个异步问题所以我花了很多精力去完成所有的测试并将它们中的每一个都包装在一个异步环境中。我还检查了每个订阅在某些时候都取消订阅 - 这是我们的应用程序的情况,但并不总是我们的测试。但是,错误仍然存​​在。

这对我们的项目来说是个大问题。任何建议都非常欢迎。也许有人知道找到导致问题的部分测试的方法?

我们现在使用jasmine 3.3.0,karma v3.1.4和Angular 7.1.3。我们在一周前做了茉莉和角的更新,因为我们希望摆脱这个问题。只有一件事情发生了变化:在更新之前,测试并没有随机破坏,而是在固定数量的测试中(在我们的例子中,639次测试会导致测试中断,638,640,641 ......会通过; 648会再次破裂)。我认为它与茉莉花现在使用的随机种子有关。

这是完整的堆栈跟踪:

<!-- language: lang-none -->
Uncaught TypeError: You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
    at subscribeTo (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/util/subscribeTo.js:41)
    at subscribeToResult (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/util/subscribeToResult.js:11)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._innerSub (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/operators/mergeMap.js:74)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._tryNext (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/operators/mergeMap.js:68)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber._next (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/operators/mergeMap.js:51)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Subscriber.js:54)
    at Observable._subscribe (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/util/subscribeToArray.js:5)
    at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable._trySubscribe (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Observable.js:43)
    at Observable.push../node_modules/rxjs/_esm5/internal/Observable.js.Observable.subscribe (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/Observable.js:29)
    at MergeMapOperator.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapOperator.call (:9876/_karma_webpack_/webpack:/node_modules/rxjs/_esm5/internal/operators/mergeMap.js:29)
    at ____________________Elapsed_3_ms__At__Thu_Dec_27_2018_10_03_35_GMT_0100__Mitteleurop_ische_Normalzeit_ ()
    at Object.onScheduleTask (:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-testing.js:108)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask (:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:401)
    at Object.onScheduleTask (:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:297)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask (:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:401)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.scheduleTask (:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:232)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask (:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:255)
    at scheduleMacroTaskWithCurrentZone (:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:1114)
    at :9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:2090
jasmine rxjs karma-jasmine
1个回答
0
投票

Oooof,听起来像是变得片状。最近我们随机破坏了单元测试。您是否一直在更新Angular和Karma版本?

我们遇到的是默认情况下(通过Angular CLI)设置单元测试的方式已经改变,而旧的测试没有运行正确的async方式。

您看到的错误确实与我们看到的不同,但我确信这是一个值得探索的途径,以消除单元测试设置引入的任何瑕疵。

取自https://angular.io/guide/testing#calling-compilecomponents

describe('BannerComponent', () => {
    let component: BannerComponent
    let fixture: ComponentFixture<BannerComponent>

    beforeEach(async(() => {
      TestBed.configureTestingModule({
        declarations: [ BannerComponent ],
      }).compileComponents();  // compile template and css
    }));

    beforeEach(() => {
        fixture = TestBed.createComponent(BannerComponent)
        component = fixture.componentInstance
        fixture.detectChanges()
    })

    it('should create', () => {
        expect(component).toBeTruthy()
    })

特别注意第一个beforeEach(),其中有一个async() => {},还有一个必需的.compileComponent()

第二个beforeEach()是在component的共享上下文中定义和填充describe()变量。

我希望这可以帮助你弄清楚是什么导致了片状。由于源自RxJS的迭代器问题似乎指向依赖于先前测试设置的状态的测试,其中它以Observable的形式接收输入。如果在测试执行之后设置或定义此Observable,则可能会遇到类似于您所描述的问题。

© www.soinside.com 2019 - 2024. All rights reserved.