[Vuejs]-Testing Library (VueJS) – Rendering multiple components in a it block

by

0👍

I’m not sure what multiple components you are trying to render in one it block but if what you are trying to do is rendering multiple OBCheckbox in one it block, then probably you can do something like this.

import { screen, render } from '@testing-library/vue';

it('should return selected items value', () => {
    render({
        template:`
            <div>
                <your_component :label="'label1'" :value="'value1'"/>                
                <your_component :label="'label2'" :value="'value2'"/>
                <your_component :label="'label3'" :value="'value3'"/>
            </div>
        `,
        components:{ your_component }
    })

    // assuming the label of the component is associated with its input by input's id
    const selectedCheckbox = screen.getByRole('checkbox', { name: 'label1' })
    expect(selectedCheckbox).toBe(...)
})

Leave a comment