Cypress shows hidden elements as visible

[lyz-code]

I'm writing my first Cypress test ( ᐛ )و, I'm testing a webpage that contains a list of 3 Vue elements, where only one meets the criteria of v-show and it's the only one displayed in the browser.

    <v-list
      v-for="element in elements"
      :key="element.v_id"
      v-show="element.show && !finished"
    >
    <PreviewArticle v-bind="element" />
    </v-list>

The PreviewArticle component has an element with the data-cy='author' tag

        <v-chip text="author" data-cy="author" class="mr-1">
          {{ author }}
        </v-chip>

I'm trying to assert that the author element matches a string with:

cy.get('[data-cy=author]').should('have.text', data[0].author)

But the assertion is failing with the error:

expected '[ <span.v-chip.v-theme--light.v-chip--density-default.v-chip--size-default.v-chip--variant-contained-text.mr-1>, 2 more... ]' to have text 'First Author', but the text was ' First Author Second Author Third Author'

The workaround I've found is to instead search for the parent component (PreviewArticle), which is the one that has the show attribute and filter by it:

      cy.get('[data-cy=article]').filter('[show=true]')
        .should('have.length', 1)
        .find('[data-cy=author]').should('include.text', data[0].author)

Why does Cypress mark as visible elements that have the show attribute set to false, or what am I doing wrong?