Apps Script HTML Code Failing for Shared Users

Apologies for the beginner question.

I have an app script that creates a user popup selection menu when my Google Sheet is edited. The selection menu was created in HTML. This works exactly as intended when I edit the spreadsheet from my own account. However, when a shared user does the same thing, withFailureHandler gets executed.

Here’s my Code.gs:

function doGet(e){
  
  var html = HtmlService.createHtmlOutputFromFile('Index')
  
      .setWidth(250)
      .setHeight(200);
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
      .showModalDialog(html, 'Animal');  
}
      
function displayMessage(selection){
  
SpreadsheetApp.getUi().alert("Your selection was: "+selection);

}

And here’s the Index.html:

 <form>
 Select animal:
 <br><br>
 <div class="custom-select">
 <select id="myList" onchange="selectionMade()">
   <option>Selection Option</option>
   <option>Cat</option>
   <option>Dog</option>  
   <option>Horse</option>
 
 </select>

<script>

function selectionMade(selection) {
 
  var mylist = document.getElementById("myList");
  var selection = mylist.options[mylist.selectedIndex].text;
  google.script.run
     .withSuccessHandler(function(data,element){window.alert("executed");})
     .withFailureHandler(function(msg,element){window.alert("failed"); })
     .displayMessage(selection);
}

</script>

I’m looking for the script to return the selection value to the spreadsheet for shared users the same one is does when I use it from my account.

Thanks in advance.