Почему только в последнем сафари для select не работает onclick, но работает onchange

Есть группа карточек, в каждой стоит select. Выбраное значение селекта js передает в div. Связка select + js не работает в последней версии (15.6)сафари, если использовать onclick. В остальных браузерах (яндекс, хром), в том числе в сафари на айфоне, работает. На многих сайтах для иллюстрации совместной работы select + js приводится примерно такой код:

<select id="mySelect_1" onclick="myFunction(1)">
    <option value="" disabled selected hidden>Выберите фрукт</option>
    <option value="Банан">Банан</option>
    <option value="Яблоко">Яблоко</option>
    <option value="Персик">Персик</option>
</select>
 
<select id="mySelect_2" onclick="myFunction(2)">
    <option value="" disabled selected hidden>Выберите овощ</option>
    <option value="Помидор">Помидор</option>
    <option value="Огурец">Огурец</option>
    <option value="Лук">Лук</option>
</select> 

<div id="show_1"></div>
<div id="show_2"></div>

   
function myFunction(id) {
      let val = document.getElementById("mySelect_"+id);
      let show = document.getElementById("show_"+id);
      
      val.addEventListener("change", (val) => {
          show.textContent = val.target.value;
    });
   }

Если заменить onclick="myFunction(1)" на onchange="myFunction(1)" и внести некоторые правки в js, то код работает везде. Почему так?

<select id="mySelect_1" onchange="myFunction(1)">
    <option value="" disabled selected hidden>Выберите фрукт</option>
    <option value="Банан">Банан</option>
    <option value="Яблоко">Яблоко</option>
    <option value="Персик">Персик</option>
</select>

<select id="mySelect_2" onchange="myFunction(2)">
    <option value="" disabled selected hidden>Выберите овощ</option>
    <option value="Помидор">Помидор</option>
    <option value="Огурец">Огурец</option>
    <option value="Лук">Лук</option>
</select>


<p id="show_1"></p>
<p id="show_2"></p>

function myFunction(id) {
  let value = document.getElementById("mySelect_"+id).value;
  let x = document.getElementById("show_"+id)
  x.innerHTML = "Selected Value: " + value;
}