[SOLVED] Why does rxjs 6 marbles documentation say "--(abc)-|" completes on frame 8?

Why does rxjs 6 marbles documentation say "--(abc)-|" completes on frame 8?

I am reading over the marbles testing documentation for Rxjs 6, and found this part under the "Examples" section for "Marble Syntax"

https://github.com/ReactiveX/rxjs/blob/master/docs_app/content/guide/testing/marble-testing.md#examples

Here is the example for my question:

'--(abc)-|': on frame 2 emit a, b, and c, then on frame 8 complete

Why does it say frame 8 for complete?

I count only 5 frames in total for the above string. The string (abc) should only count as a single frame. It's then followed by another frame - then a complete |.

--(abc)-|
11  1  11 = sum(5)

So I don't understand why it's frame 8, but when I run the above in a unit test with marbles it outputs that it completed on frame 8.

So where are the 3 extra frames coming from?

Solution

This is intended because when the event is outside parentheses it calculates the frame only from its string position. I believe the main reason is that you can still put multiple marble diagram under each other and it's still easily readable:

combineLatest([
  hot('-a--b-----c-d-e-|'),
  hot('--------f--g-h-i--j-|'),
  hot('--1--(234)---5-6---|'),
]);

You can still easily tell when 5 is going to be emitted. If it worked as you expected then you'd have to manually subtract the frames to tell whether 5 goes before d and g for example.

It's not very obvious from the source code but it advances frames for every character in the diagram (the advanceFrameBy(1) call):

https://github.com/ReactiveX/rxjs/blob/master/src/internal/testing/TestScheduler.ts#L334