mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-17 18:16:15 +08:00
test(editor): reduce flaky timing in turbo renderer tests (#12082)
### TL;DR Improved the test stability for the turbo renderer by using reactive state observation instead of arbitrary timeouts. (https://github.com/toeverything/AFFiNE/actions/runs/14729729312/job/41340918866?pr=12071) ### What changed? - Replaced `wait(FRAME)` and other timeout-based waits with reactive state observation using RxJS - Added `filter` import from `rxjs/operators` - Updated test assertions to properly wait for specific renderer states (`ready`, `pending`, `zooming`) - Made tests more deterministic by waiting for specific state transitions rather than arbitrary time periods <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **Tests** - Improved test reliability by replacing fixed-duration waits with reactive waits based on renderer state changes, ensuring tests are synchronized with actual state transitions. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
@@ -8,6 +8,7 @@ import {
|
||||
ViewportTurboRendererExtension,
|
||||
} from '@blocksuite/affine-gfx-turbo-renderer';
|
||||
import { firstValueFrom } from 'rxjs';
|
||||
import { filter } from 'rxjs/operators';
|
||||
import { afterEach, beforeEach, describe, expect, test } from 'vitest';
|
||||
|
||||
import { wait } from '../utils/common.js';
|
||||
@@ -38,7 +39,10 @@ describe('viewport turbo renderer', () => {
|
||||
|
||||
test('should render 6 notes in viewport', async () => {
|
||||
addSampleNotes(doc, 6);
|
||||
const renderer = getRenderer();
|
||||
await renderer.refresh();
|
||||
await wait(FRAME);
|
||||
await firstValueFrom(renderer.state$.pipe(filter(s => s === 'ready')));
|
||||
|
||||
const notes = document.querySelectorAll('affine-edgeless-note');
|
||||
expect(notes.length).toBe(6);
|
||||
@@ -59,12 +63,13 @@ describe('viewport turbo renderer', () => {
|
||||
test('zooming should change internal state and populate optimized block ids', async () => {
|
||||
const renderer = getRenderer();
|
||||
addSampleNotes(doc, 1);
|
||||
await renderer.refresh();
|
||||
await wait(FRAME);
|
||||
await firstValueFrom(renderer.state$.pipe(filter(s => s === 'ready')));
|
||||
expect(renderer.optimizedBlockIds.length).toBe(0);
|
||||
|
||||
renderer.viewport.zooming$.next(true);
|
||||
const nextState = await firstValueFrom(renderer.state$);
|
||||
expect(nextState).toBe('zooming');
|
||||
await firstValueFrom(renderer.state$.pipe(filter(s => s === 'zooming')));
|
||||
|
||||
const canUseCache = renderer.canUseBitmapCache();
|
||||
expect(canUseCache).toBe(false);
|
||||
@@ -74,9 +79,9 @@ describe('viewport turbo renderer', () => {
|
||||
expect(renderer.optimizedBlockIds.length).toBe(1);
|
||||
|
||||
renderer.viewport.zooming$.next(false);
|
||||
await wait(renderer.options.debounceTime + 100);
|
||||
await firstValueFrom(renderer.state$.pipe(filter(s => s === 'ready')));
|
||||
|
||||
expect(renderer.state$.value).not.toBe('zooming');
|
||||
expect(renderer.state$.value).toBe('ready');
|
||||
expect(renderer.optimizedBlockIds.length).toBe(0);
|
||||
});
|
||||
|
||||
@@ -84,12 +89,16 @@ describe('viewport turbo renderer', () => {
|
||||
const renderer = getRenderer();
|
||||
|
||||
addSampleNotes(doc, 1);
|
||||
await renderer.refresh();
|
||||
await wait(FRAME);
|
||||
await firstValueFrom(renderer.state$.pipe(filter(s => s === 'pending')));
|
||||
expect(renderer.state$.value).toBe('pending');
|
||||
|
||||
// Ensure zooming is off and wait for debounce + buffer
|
||||
renderer.viewport.zooming$.next(false);
|
||||
await wait(renderer.options.debounceTime + 500);
|
||||
await renderer.refresh();
|
||||
await wait(FRAME);
|
||||
await firstValueFrom(renderer.state$.pipe(filter(s => s === 'ready')));
|
||||
|
||||
expect(renderer.state$.value).toBe('ready');
|
||||
});
|
||||
|
||||
@@ -103,14 +112,14 @@ describe('viewport turbo renderer', () => {
|
||||
addSampleNotes(doc, 1);
|
||||
await wait(100);
|
||||
|
||||
// Access getter to populate cache
|
||||
const _cache = renderer.layoutCache;
|
||||
noop(_cache);
|
||||
expect(renderer.layoutCacheData).not.toBeNull();
|
||||
|
||||
// Invalidate
|
||||
addSampleNotes(doc, 1);
|
||||
await wait(100);
|
||||
await renderer.refresh();
|
||||
await wait(FRAME);
|
||||
|
||||
expect(renderer.layoutCacheData).toBeNull();
|
||||
});
|
||||
@@ -118,6 +127,7 @@ describe('viewport turbo renderer', () => {
|
||||
test('accessing layoutCache getter should populate cache data', async () => {
|
||||
const renderer = getRenderer();
|
||||
addSampleNotes(doc, 1);
|
||||
await renderer.refresh();
|
||||
await wait(FRAME);
|
||||
expect(renderer.layoutCacheData).toBeNull();
|
||||
|
||||
|
||||
Reference in New Issue
Block a user