How to use the @vue/test-utils.mount function in @vue/test-utils

it('should render column sizes correctly', () => {
    // default
    const wrapper = mount({
      render () {
        return (
          
            Hello
          
        )
      }
    })
    expect(wrapper.findAll('.va-col-sm-2.va-control-label').length).toBe(1)
    expect(wrapper.findAll('.va-col-sm-10.va-flex').length).toBe(1)

    // custom label-col
    const wrapper2 = mount({
      render () {
        return (

test('create with tab items', () => {
    wrapper = mount(Tabs, {
      propsData: {},
      slots: {
        default: [Tab, Tab, Tab]
      }
    })

    expect(wrapper.name()).toBe('wv-tabs')
    expect(wrapper.classes()).toContain('wv-tabs')
  })

test('testing computesRequired rule (here required_if)', async () => {
  Validator.localize('en');
  await flushPromises();

  const wrapper = mount({
    computed: {
      ...mapValidationState('vee')
    },
    methods: {
      ...mapValidationActions(['validate'])
    },
    template: `
      <div>
        <input id="f1" name="f1" type="text">
        <input id="f1-continues" name="f1-continues" type="text">
        <input id="f2" name="f2" type="text">
        <span id="f1-errors">{{ vee.for('f1').errors[0] }}</span>
        <span id="f1-continues-errors">{{ vee.for('f1-continues').errors[0] }}</span>
        <span id="f2-errors">{{ vee.for('f2').errors[0] }}</span>
      </div>
    `

it('should select the `value` key, but display its value as the text of the option', () => {
      const items = { a: 'label A', b: 'label B', c: 'label C' }
      const value = 'b'

      const wrapper = mount(InputSelect, {
        propsData: {
          name: 'test',
          items,
          label: 'testing',
          value
        }
      })
      const input = wrapper.find('.InputSelect__input')
      expect(input.text()).toBe(items[value])
    })
  })

it('auto-hide works', async () => {
    jest.useFakeTimers()
    const wrapper = mount(BToast, {
      attachToDocument: true,
      stubs: {
        transition: false
      },
      propsData: {
        static: true,
        noAutoHide: false,
        visible: true,
        title: 'title'
      },
      slots: {
        default: 'content'
      }
    })

    expect(wrapper.isVueInstance()).toBe(true)

it('renders menu', () => {
    wrapper = mount(AssessmentItemToolbar, {
      propsData: {
        displayMenu: true,
        menuActionsConfig: [
          AssessmentItemToolbarActions.ADD_ITEM_ABOVE,
          AssessmentItemToolbarActions.ADD_ITEM_BELOW,
          AssessmentItemToolbarActions.DELETE_ITEM,
        ],
      },
    });

    expect(wrapper.html()).toMatchSnapshot();
  });

test('should change slide', () => {
    const wrapper = mount(VueCarousel, {
      localVue,
      propsData: {
        images,
        intervalDuration: 10,
      },
    });

    expect(wrapper.vm.currentSlide).toBe(0);

    wrapper.vm.changeSlide();
    expect(wrapper.vm.currentSlide).toBe(1);

    wrapper.vm.changeSlide();
    expect(wrapper.vm.currentSlide).toBe(2);

    wrapper.vm.changeSlide();

it('should not have class fade or slide when prop no-animation=true and fade=true', async () => {
    const wrapper = mount(BCarousel, {
      localVue: localVue,
      attachToDocument: true,
      propsData: {
        fade: true,
        noAnimation: true
      }
    })

    expect(wrapper.isVueInstance()).toBe(true)
    await waitNT(wrapper.vm)
    await waitRAF()

    expect(wrapper.classes()).toContain('carousel')
    expect(wrapper.classes()).not.toContain('slide')
    expect(wrapper.classes()).not.toContain('carousel-fade')

const mountComponent = (propsData = {}, data = {}) => {
    if (wrapper) {
      throw new Error('tried to call mountComponent without d');
    }
    wrapper = mount(SidebarDatePicker, {
      stubs: {
        DatePicker: true,
      },
      propsData,
      data: () => data,
    });
  };

...listProps,
  };
  const issue = {
    title: 'Testing',
    id: 1,
    iid: 1,
    confidential: false,
    labels: [],
    assignees: [],
    ...listIssueProps,
  };
  if (!Object.prototype.hasOwnProperty.call(listProps, 'issuesCount')) {
    list.issuesCount = 1;
  }

  const component = mount(BoardList, {
    localVue,
    propsData: {
      disabled: false,
      list,
      issues: [issue],
      canAdminList: true,
      ...componentProps,
    },
    store,
    provide: {
      groupId: null,
      rootPath: '/',
      weightFeatureAvailable: false,
      boardWeight: null,
    },
  });