hi! is it possible to pass a reactive value as a prop (ex. in screen, length ref) in order to mount the component only once and watch the effects of the prop changes?

hey, this should work fine, but I assume you are not seeing the new length, so let me look a little closer at this. Is there any place I can play with this actual code (test + component), not the screenshot? It's probably just a small thing.

This is exactly what I've been searching for. To me it seams like the most basic scenario of testing. Yet I can't find any examples. @wonderful-match-15836 , what should I do to help you answer this question?

@nutritious-glass-59704 could you create a reproduction where it is not working? Here is an example of some code I just tried that works, and looks very like the example provided above. So we need more info to know why this isn't working in some particular case. That said, in general, for me, I rarely test like this. This feels like testing vue itself. I'd definitely mount the component using props, and mount it again with different props to test specific things. But in terms of the effect of props changing dynamically, I would prefer to test that through a parent component that's supposed to update the prop values based on user interaction, or the data it receives. But yeah, if you have cases like this, it oughta work. If it doesn't a reproduction that we can look at with known package versions etc would help narrow it down.

it('shows new value of a prop', () => {
      const name = ref('hello test')
      cy.mount(TestComponent, {
        props: {
          name,
        },
      })
      cy.contains('hello test').then(() => {
        name.value = 'new test'
        cy.contains('new test') // passes
      })
    })

@wonderful-match-15836 Thank you for your quick reply. Since then I've been trying to create the most basic test possible to demonstrate my issue. I am currently stuck trying to get the most basic test to work. I created a blank vue project with

npm init vue@latest

and selecting cypress, typescript, and nothing else I then created a cypress test for the included demo component

WelcomeItem

I added one property. The test and it is already failing. with the message 'Cannot convert undefined or null to object' The component works as expected in the app. It only fails in the test Can you please take a look at it? It is super simple. https://github.com/jewpaltz/cypress_component_testing/commit/f4c1d34e1aa6fa1c2d4b63efec111728c3891317 I am going to crosspost this with the main thread of the channel to see if anyone else can spot what is going on. Please respond there if you get a chance