Cypress 15 angular testing: componentProperties don't seem to be set anymore when mounting.

[jcompagner]

Current behavior

All our test are failing when we move from Cypress 14 to Cypress 15

This looks like because componentProperties in the mount call are not set on the component.

so we have a wrapper component:

class WrapperComponent {
text = 'MyButton';
}

then we have:
const configWrapper: MountConfig = {
declarations: [XXXX],
imports: [ YYYY]
}
and

configWrapper.componentProperties = {
text: 'MyButton2'
}

then we do

cy.mount(WrapperComponent, configWrapper).then((wrapper) => {

but the text is still "MyButton" not "MyButton2"

we have that will all the properties that we set, the things we init directly in the class are there but the componentProperties are not set over it.

after that if we do:

wrapper.component.text = 'MyButton2';
wrapper.fixture.detectChanges();

then it works
then the component that is wrapped by the component that gets that text property as its own, the onChanges() is called with that change. The initial onchanges of angular is always the class defined values. never the componentProperties defined values.

Desired behavior

that it works like Cypress 14

Test code to reproduce

see here:
https://github.com/Servoy/bootstrapcomponents/blob/master/components/projects/bootstrapcomponents/src/button/button.cy.ts#L65

checking out that project you can run that with npm run cy:open (or run)

that "servoyApi" object has to be set before the component is constructed but we do want to spy on it, so the mound should use the servoyApi object that is set and spyed on in the componentProperties.servoyApi
But that doesn't work anymore so a lot of stuff goes wrong

Cypress Version

15

Node version

v22.15.0

Operating System

windows

Debug Logs

Other

No response

[jcompagner]

ok i debugged it through and got to this code in cypress:

/**
 * Gets the componentInstance and Object.assigns any componentProperties() passed in the MountConfig
 *
 * @param {MountConfig} config TestBed configuration passed into the mount function
 * @param {ComponentFixture<T>} fixture Fixture for debugging and testing a component.
 * @returns {T} Component being mounted
 */
function setupComponent(config, fixture) {
    let component = fixture.componentInstance;
    const injector = fixture.componentRef.injector;
    if (config === null || config === void 0 ? void 0 : config.componentProperties) {
        if (component instanceof WrapperComponent) {
            component = Object.assign(component, config.componentProperties);
        }
        getComponentInputs(fixture.componentRef.componentType).forEach((key) => {
            var _a;
            // only assign props if they are passed into the component
            if ((_a = config === null || config === void 0 ? void 0 : config.componentProperties) === null || _a === void 0 ? void 0 : _a.hasOwnProperty(key)) {
                // @ts-expect-error
                const passedInValue = config === null || config === void 0 ? void 0 : config.componentProperties[key];
                registerSignalEventsIfNeeded(key, passedInValue, component[key], injector, fixture);
                detectAndRegisterOutputSpyToSignal(config, component, key, injector);
                fixture.componentRef.setInput(key, isSignal(passedInValue) ? passedInValue() : passedInValue);
            }
        });
        getComponentOutputs(fixture.componentRef.componentType).forEach((key) => {

if i read the doc then it should assign the component properties to the component instance that are passed by
problem is it has an instance of around it of WrapperComponent... (and that is a bit confusing because we also use that name but it is not the same class, that WrapperComponent is something internal of Cypress it seems)

an then it does component input and output, but that is not what our WrapperComponent has, that one just has properties not in and output (thats not needed, they are not in an output they are just properties that are set on input (or outputs) of the component it wraps...
So why is there that instanceof? should all wrapper components that we make extend a cypress one?

[jcompagner]

it seems that this commit did change this:

886878b#diff-b52806abeed26c5c8c9df62a666aacb84f0dfb066f83de4396b37d8d2f2106caL415

so why is that and how should this now work?

[jcompagner]

ah that same fix i guess is also in everything after 14.5.2 because 14.5.3 or higher also doesn't work for us anymore