testing-library/angular-testing-library

Add API for defer blocks

Closed this issue · 5 comments

Christian24 commented

Hello,

defer blocks are now in developer preview with Angular 17. There seem to be new features in component fixtures. Are there already plans how to support this in testing-library?

The API Angular provides for this seems to be pretty straightforward, so maybe it should just be wrapped?

timdeschryver commented

Thanks for bringing this up, I wasn't aware of this yet.
This should already be possible because render returns the component fixture.
When this lib is upgraded to v17, we'll include an example.

Christian24 commented

Maybe we could make it a bit easier even:

maybe render could return a new field deferBlocks? Or a function getDeferBlocks()? I don't know if falling back completely to component fixtures is the way to go.

timdeschryver commented

Yea, ideally we have an API for that but in the meantime using fixture is a way to do this.
Sadly I don't see an easy way to query a defer block, instead of getDeferBlocks() I was thinking to expose a method that does the following:

// renderDeferState or renderDefer or renderDeferBlock or renderBlock 😅
// or rerender/set/...?
const { renderDeferState } = render(AppComponent);

// set the defer state of the first defer block
await renderDeferState(DeferBlockState.Complete)


// set a specific defer block using the index
await renderDeferState(DeferBlockState.Complete, 2)
timdeschryver commented

@Christian24 what do you think of the API introduced in #418 ?

Christian24 commented