it cannot keep up with the angular renaissance (cy.mount()) does not work yet with input signals, and requires me to write wierd code to make it work somehow
tsconfig cannot be configured to support global type safety for jasmine and cypress within the components folder (and putting the components folder outside the app is kinda wierd, for the same reasons we put the spec.ts files there as well
jasmine signal support is out of the box, because they didnt write wrappers around angular testing fixture, which makes us easily accessable fixture.componentRef.setInput('hideMenuButton', true)
the same however cannot be done in cypress. The mount will work yes, but there is a race-condition between the mount and the tests which cannot be "await" which, anyways would cause bad boiletplate code.
wierd code example:
cy.mount(Header, {
providers: [provideAppName(), provideRouter([])],
componentProperties: {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
hideMenuButton: signal(false) as any
}
})
// OR
.then(x => {
x.fixture.componentRef.setInput(...) // works
x.fixture.detectChanges() // bad side effects
}).as('setup') // doesnt work, and cannot be await
we are assigning a signal to the variable, which is of type InputSignal. However input signals cannot be used outside the injection context, therefore use something elsew. This works only because input signals are are similar (but read only). But they dont have to be, which makes it prone to error.
fixture.componentRef.setInput('hideMenuButton', true)wierd code example:
we are assigning a signal to the variable, which is of type InputSignal. However input signals cannot be used outside the injection context, therefore use something elsew. This works only because input signals are are similar (but read only). But they dont have to be, which makes it prone to error.