Bug: wrapper.find({ ref }) cannot catch ref in v-for directive

[hiromi2424]

Describe the bug

wrapper.find({ ref }) returns correct ref when it is not in v-for directive.
wrapper.find({ ref }) does NOT return correct ref when it is in v-for directive.
wrapper.findComponent({ ref }) returns correct ref whenever it is in v-for directive or not.

To Reproduce

TestComponent.vue

<script setup>
const buttonNames = ['back', 'next'];
</script>

<template>
  <div v-for="buttonName in buttonNames" :key="buttonName">
    <button :ref="`button-${buttonName}`">{{ buttonName }}</button>
  </div>
</template>

TestComponent.spec.js (jest)

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

describe('TestComponent', () => {
  test('back button ref exists', () => {
    const wrapper = mount(TestComponent);
    const backButton = wrapper.find({ ref: 'button-back' });
    expect(backButton.text()).toBe('back');
  });
});

That test fails with:

Error: Cannot call text on an empty DOMWrapper.

Expected behavior

The test above passes and correct ref returns(as not array?)

Related information:

• @vue/test-utils version: 2.0.2
• Vue version: 3.2.37
• node version: v14.18.2
• npm (or yarn) version: npm 8.14.0

Additional context

Related code pointing to this bug:

test-utils/src/baseWrapper.ts

Lines 78 to 85 in e59981d

	const result = currentComponent.refs[selector.ref]
	if (result instanceof Node) {
	return createDOMWrapper(result)
	} else {
	return createWrapperError('DOMWrapper')
	}
	}

is not treat array returns.
On the other hand, findComponent() take care of v-for:

test-utils/src/baseWrapper.ts

Lines 157 to 160 in e59981d

	// When using ref inside v-for, then refs contains array of component instances
	if (Array.isArray(result)) {
	result = result.length ? result[0] : undefined
	}