`findAll` returns nothing when using a render function

[huuff]

Subject of the issue

findAll() returns nothing when the component is using a render function.

Steps to reproduce

This as TestComponent.vue:

<template>
<render></render>
</template>

<script setup lang="ts">
import { h } from 'vue';

const render = () => [
  h('a', {}, 'first'),
  h('a', {}, 'second'),
  h('a', {}, 'third'),
];
</script>

Then in TestComponent.spec.ts:

import { mount } from '@vue/test-utils';
import TestComponent from './TestComponent.vue';

describe('mcve', () => {
  test('should have all three anchors', () => {
    const wrapper = mount(TestComponent);

    expect(wrapper.findAll('a').length).toBe(3);
  });
});

Expected behaviour

The test should pass.

Actual behaviour

The test fails because findAll is unable to find the three anchors.

[LinusBorg]

Transferred to vue-test-utils-next as it's about Vue 3

[cexbrayat]

Hi @huuff

Thank you for providing a small repro. Which version of VTU are you using?

I think this may be the same as #1173 which appeared after releasing rc.18.

cc @xanf as he started to work on that

[huuff]

Yes, the version I'm using is rc.18. Here's an MCVE

[huuff]

Also, I just tested and it seems to also happen for rc.16

[huuff]

Found a (sort of) workaround. If your element is wrapped in some other element, you can first query for that one and then run the findAll.

Example element:

<template>
<render></render>
</template>

<script setup lang="ts">
import { h } from 'vue';

const render = () => [
  h('div', {}, [ 
    h('a', {}, 'first'),
    h('a', {}, 'second'),
    h('a', {}, 'third'),
  ]),
];
</script>

Then in the test:

import { mount } from '@vue/test-utils';
import TestComponent from './TestComponent.vue';

describe('mcve', () => {
  test('should have all three anchors', () => {
    const wrapper = mount(TestComponent);

    expect(wrapper.get("div").findAll('a').length).toBe(3);
  });
});

It's not entirely a workaround since it requires wrapping the wanted element in another, but it helped me.

[justin-schroeder]

Found a (sort of) workaround. If your element is wrapped in some other element, you can first query for that one and then run the findAll.

Really appreciate @huuff finding a fix for this while we wait for another publish. Had to rewrite a bunch of tests, but at least we're building again. 🙏

[Archetipo95]

@lmiller1990 Any ETA on when this fix will be on next release?

[lmiller1990]

Sure, this week. It's been a while. I was hoping to get #1293 done so we could move out of the release candidate stage, but I am not sure that will be happening, so we can do another release candidate.

Please ping me if this isn't done in a few days.