Interact with vue-multiselect programmatically

Question

Tried to open the select with these:

document.querySelector('.multiselect').click()
document.querySelector('.multiselect__tags').click()
document.querySelector('#languages').click()
document.querySelector('.multiselect__spinner').click()
document.querySelector('.multiselect__content-wrapper').click()

This one works by selecting the item directly but in my case the element needs to be visible so I have to open the drawer anyways.

document.querySelectorAll('.multiselect__option')[1].click()

In order to do so I tried iterating trough entire vue-multiselect node tree and sending a click to every single element :

items = items.querySelector('#languages-input')
items = items.querySelectorAll('*')

const timer = ms => new Promise(res => setTimeout(res, ms))

for(i = 0; i < items.length; i++) {
    console.log(items[i])
    items[i].click()
    await timer(1000)
}

Answer 1

The drawer is hidden using display: none.

In order to open the drawer:

drawer = document.querySelector('.multiselect__content-wrapper')
drawer.style.display = 'block'

To select/deselect items by index:

document.querySelectorAll('.multiselect__option')[0].click()