ARTICLE AD BOX
With Angular 21, I can't test (with vitest) a non-standalone component using the Async pipe. I get the following error:
X [ERROR] NG8004: No pipe found with name 'async'. To fix this, import the "AsyncPipe" class from "@angular/common" and add it to the "imports" array of the module declaring the component. [plugin angular-compiler] src/app/async-test/async-test.html:1:9: 1 │ <p>{{v | async }}</p> ╵ ~~~~~ Error occurs in the template of component AsyncTestComponent. src/app/async-test/async-test.ts:6:15: 6 │ templateUrl: './async-test.html', ╵ ~~~~~~~~~~~~~~~~~~~Here is the full code:
Test:
describe('AsyncTestComponent', () => { let component: AsyncTestComponent; let fixture: ComponentFixture<AsyncTestComponent>; beforeEach(async () => { await TestBed.configureTestingModule({ imports: [CommonModule, AsyncPipe ], declarations: [AsyncTestComponent] }) .compileComponents(); fixture = TestBed.createComponent(AsyncTestComponent); component = fixture.componentInstance; await fixture.whenStable(); }); it('should create', () => { expect(component).toBeTruthy(); }); });Component:
@Component({ selector: 'app-async-test', templateUrl: './async-test.html', styleUrl: './async-test.css', standalone: false }) export class AsyncTestComponent { protected readonly v = of(1); }HTML:
<p>{{v | async }}</p>All I did was: ng new --> add a non standalone component and use the async pipe in it then run ng test
Did someone else experienced the same issue?
