Renderless ValidationProvider with more than 1 child doesn't work as expected

[bauer00]

Versions

• vee-validate: 3.0.11
• vue: 2.6.10

Describe the bug According to the documentation (https://logaretm.github.io/vee-validate/guide/validation-provider.html#forcing-renderless) the ValidationProvider should only render the first child if there are more than 1 child and slim is set to true. Instead of rendering the 1st child it renders it as slim is set to false.

To reproduce Create a ValidationProvider with more than 1 child and set slim to true.

Expected behavior As the documentation describes it should only render the 1st child.

Additional context I think the problem is in this line of code: https://github.com/logaretm/vee-validate/blob/fab765db9e191fab0eaa922bbd2aed623a540187/src/components/Provider.ts#L182 According to this code it only renders the 1st child if slim is true and there is only 1 child.

[logaretm]

Yes, this is intended. Because Vue 2.x has a limitation that prevents rendering multiple root nodes for a component, the limitation doesn't apply to functional components though. That line exists to prevent such errors which will prevent the entire rendering of the template.

Vue 3.0 should have this limitation lifted and this will be the default mode for vee-validate from there onwards.

[bauer00]

According to the documentation and this example, if there are 2 children, only the first should be rendered, but that's not the case:

<ValidationProvider rules="required" v-slot="{ errors }" slim>
  <input v-model="value" type="text">
  <span>{{ errors[0] }}</span>
</ValidationProvider>

<!-- Only input is rendered, the span is dropped -->
<input type="text">