diff --git a/examples/angular/dynamic/src/app/column-virtualizer-dynamic.component.ts b/examples/angular/dynamic/src/app/column-virtualizer-dynamic.component.ts index 0aaf1d658..c57d5583f 100644 --- a/examples/angular/dynamic/src/app/column-virtualizer-dynamic.component.ts +++ b/examples/angular/dynamic/src/app/column-virtualizer-dynamic.component.ts @@ -56,12 +56,10 @@ export class ColumnVirtualizerDynamic { count = this.sentences.length - #measureItems = effect( - () => - this.virtualItems().forEach((el) => { - this.virtualizer.measureElement(el.nativeElement) - }), - { allowSignalWrites: true }, + #measureItems = effect(() => + this.virtualItems().forEach((el) => { + this.virtualizer.measureElement(el.nativeElement) + }), ) virtualizer = injectVirtualizer(() => ({ diff --git a/examples/angular/dynamic/src/app/grid-virtualizer-dynamic.component.ts b/examples/angular/dynamic/src/app/grid-virtualizer-dynamic.component.ts index 598cfc27d..7bc35e95a 100644 --- a/examples/angular/dynamic/src/app/grid-virtualizer-dynamic.component.ts +++ b/examples/angular/dynamic/src/app/grid-virtualizer-dynamic.component.ts @@ -115,11 +115,9 @@ export class GridVirtualizerDynamic { virtualRows = viewChildren>('virtualRow') - #measureItems = effect( - () => - this.virtualRows().forEach((el) => { - this.rowVirtualizer.measureElement(el.nativeElement) - }), - { allowSignalWrites: true }, + #measureItems = effect(() => + this.virtualRows().forEach((el) => { + this.rowVirtualizer.measureElement(el.nativeElement) + }), ) } diff --git a/examples/angular/dynamic/src/app/row-virtualizer-dynamic-window.component.ts b/examples/angular/dynamic/src/app/row-virtualizer-dynamic-window.component.ts index b79f6543a..112f15457 100644 --- a/examples/angular/dynamic/src/app/row-virtualizer-dynamic-window.component.ts +++ b/examples/angular/dynamic/src/app/row-virtualizer-dynamic-window.component.ts @@ -75,12 +75,10 @@ export class RowVirtualizerDynamicWindow { count = this.sentences.length - #measureItems = effect( - () => - this.virtualItems().forEach((el) => { - this.virtualizer.measureElement(el.nativeElement) - }), - { allowSignalWrites: true }, + #measureItems = effect(() => + this.virtualItems().forEach((el) => { + this.virtualizer.measureElement(el.nativeElement) + }), ) virtualizer = injectWindowVirtualizer(() => ({ diff --git a/examples/angular/dynamic/src/app/row-virtualizer-dynamic.component.ts b/examples/angular/dynamic/src/app/row-virtualizer-dynamic.component.ts index c626305ba..408356ed5 100644 --- a/examples/angular/dynamic/src/app/row-virtualizer-dynamic.component.ts +++ b/examples/angular/dynamic/src/app/row-virtualizer-dynamic.component.ts @@ -78,12 +78,10 @@ export class RowVirtualizerDynamic { count = this.sentences.length - #measureItems = effect( - () => - this.virtualItems().forEach((el) => { - this.virtualizer.measureElement(el.nativeElement) - }), - { allowSignalWrites: true }, + #measureItems = effect(() => + this.virtualItems().forEach((el) => { + this.virtualizer.measureElement(el.nativeElement) + }), ) virtualizer = injectVirtualizer(() => ({ diff --git a/examples/angular/infinite-scroll/src/app/app.component.ts b/examples/angular/infinite-scroll/src/app/app.component.ts index 5bed165b6..f8ed070f5 100644 --- a/examples/angular/infinite-scroll/src/app/app.component.ts +++ b/examples/angular/infinite-scroll/src/app/app.component.ts @@ -103,25 +103,22 @@ export class InfiniteScrollComponent { overscan: 5, })) - #fetchNextPage = effect( - () => { - const lastItem = - this.virtualizer.getVirtualItems()[ - this.virtualizer.getVirtualItems().length - 1 - ] - if (!lastItem) { - return - } - if ( - lastItem.index >= this.allRows().length - 1 && - this.query.hasNextPage() && - !this.query.isFetchingNextPage() - ) { - this.query.fetchNextPage() - } - }, - { allowSignalWrites: true }, - ) + #fetchNextPage = effect(() => { + const lastItem = + this.virtualizer.getVirtualItems()[ + this.virtualizer.getVirtualItems().length - 1 + ] + if (!lastItem) { + return + } + if ( + lastItem.index >= this.allRows().length - 1 && + this.query.hasNextPage() && + !this.query.isFetchingNextPage() + ) { + this.query.fetchNextPage() + } + }) } @Component({ diff --git a/examples/angular/padding/src/app/column-virtualizer-padding.component.ts b/examples/angular/padding/src/app/column-virtualizer-padding.component.ts index 1aa9e52fd..f7c288cf2 100644 --- a/examples/angular/padding/src/app/column-virtualizer-padding.component.ts +++ b/examples/angular/padding/src/app/column-virtualizer-padding.component.ts @@ -51,12 +51,10 @@ export class ColumnVirtualizerPadding { virtualItems = viewChildren>('virtualItem') - #measureItems = effect( - () => - this.virtualItems().forEach((el) => { - this.virtualizer.measureElement(el.nativeElement) - }), - { allowSignalWrites: true }, + #measureItems = effect(() => + this.virtualItems().forEach((el) => { + this.virtualizer.measureElement(el.nativeElement) + }), ) virtualizer = injectVirtualizer(() => ({ diff --git a/examples/angular/padding/src/app/grid-virtualizer-padding.component.ts b/examples/angular/padding/src/app/grid-virtualizer-padding.component.ts index 6ef3ab7c4..ae67cc33a 100644 --- a/examples/angular/padding/src/app/grid-virtualizer-padding.component.ts +++ b/examples/angular/padding/src/app/grid-virtualizer-padding.component.ts @@ -107,13 +107,11 @@ export class GridVirtualizerPadding { virtualItems = viewChildren>('virtualItem') - #measureItems = effect( - () => - this.virtualItems().forEach((el) => { - this.rowVirtualizer.measureElement(el.nativeElement) - this.columnVirtualizer.measureElement(el.nativeElement) - }), - { allowSignalWrites: true }, + #measureItems = effect(() => + this.virtualItems().forEach((el) => { + this.rowVirtualizer.measureElement(el.nativeElement) + this.columnVirtualizer.measureElement(el.nativeElement) + }), ) show = signal(true) diff --git a/examples/angular/padding/src/app/row-virtualizer-padding.component.ts b/examples/angular/padding/src/app/row-virtualizer-padding.component.ts index 3c676aa52..0bd144a7d 100644 --- a/examples/angular/padding/src/app/row-virtualizer-padding.component.ts +++ b/examples/angular/padding/src/app/row-virtualizer-padding.component.ts @@ -51,12 +51,10 @@ export class RowVirtualizerPadding { virtualItems = viewChildren>('virtualItem') - #measureItems = effect( - () => - this.virtualItems().forEach((el) => { - this.virtualizer.measureElement(el.nativeElement) - }), - { allowSignalWrites: true }, + #measureItems = effect(() => + this.virtualItems().forEach((el) => { + this.virtualizer.measureElement(el.nativeElement) + }), ) virtualizer = injectVirtualizer(() => ({ diff --git a/packages/angular-virtual/e2e/app/test/no-deprecated-effect-options.spec.ts b/packages/angular-virtual/e2e/app/test/no-deprecated-effect-options.spec.ts new file mode 100644 index 000000000..2f4998786 --- /dev/null +++ b/packages/angular-virtual/e2e/app/test/no-deprecated-effect-options.spec.ts @@ -0,0 +1,28 @@ +import { readFile } from 'node:fs/promises' +import { resolve } from 'node:path' +import { expect, test } from '@playwright/test' +import { glob } from 'tinyglobby' + +const ANGULAR_EXAMPLE_SOURCE_GLOB = 'examples/angular/*/src/**/*.ts' +const DEPRECATED_EFFECT_OPTION = 'allowSignalWrites' +const DEPRECATED_EFFECT_OPTION_PATTERN = new RegExp( + `\\b${DEPRECATED_EFFECT_OPTION}\\s*:\\s*true\\b`, +) +const REPO_ROOT_RELATIVE_PATH = '../../../../..' +const SOURCE_FILE_ENCODING = 'utf-8' + +test('Angular examples do not pass deprecated effect options', async () => { + const repoRoot = resolve(import.meta.dirname, REPO_ROOT_RELATIVE_PATH) + const files = await glob(ANGULAR_EXAMPLE_SOURCE_GLOB, { cwd: repoRoot }) + + const matches: Array = [] + + for (const file of files) { + const source = await readFile(resolve(repoRoot, file), SOURCE_FILE_ENCODING) + if (DEPRECATED_EFFECT_OPTION_PATTERN.test(source)) { + matches.push(file) + } + } + + expect(matches, `${DEPRECATED_EFFECT_OPTION} is deprecated`).toEqual([]) +})