How to trigger a mouse click on Option Tag Element on Select tag HTML Element?

In scraping simulate a click in a list of element of a Select HTML tag is tricky. Here is a workaround to trigger the select value change.

const selectTag = document.querySelector('select');

const optionTags = [...selectTag.querySelectorAll('option')];
optionTags[0].selected = true;

Now your Select list contains a selected option. Then you can trigger a form submit or click on a button.

Sometimes the select list accept multiple selected value option.

References :

  • https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option#selected
  • https://developer.mozilla.org/fr/docs/Web/API/HTMLSelectElement/selectedIndex