HTML `dialog` Element Not Closing Properly in Edge with Async Functions
I'm having trouble with I'm building a feature where I'm optimizing some code but I need some guidance on I've searched everywhere and can't find a clear answer. I tried several approaches but none seem to work... I'm experiencing issues with the HTML `<dialog>` element not closing as expected in Microsoft Edge. I've implemented a simple modal dialog that opens when a button is clicked, and I intend to close it when the user clicks a confirm button inside the dialog. However, when I call the close method, it seems to have no effect, and the dialog remains visible. I've tested this on Edge 18 and 20, and both versions exhibit the same behavior. Here’s a simplified version of my code: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Dialog Example</title> </head> <body> <button id="openDialog">Open Dialog</button> <dialog id="myDialog"> <p>Are you sure you want to proceed?</p> <button id="confirm">Confirm</button> <button id="cancel">Cancel</button> </dialog> <script> const dialog = document.getElementById('myDialog'); document.getElementById('openDialog').addEventListener('click', () => { dialog.showModal(); }); document.getElementById('confirm').addEventListener('click', async () => { await new Promise(resolve => setTimeout(resolve, 1000)); // Simulate async operation dialog.close(); // This does not work in Edge }); document.getElementById('cancel').addEventListener('click', () => { dialog.close(); }); </script> </body> </html> ``` I’ve tried removing the async call to see if it affects the dialog behavior, but it still does not respond properly when the confirm button is clicked. I also checked if there were any JavaScript errors in the console, but everything looks fine. The scenario seems isolated to Edge as it works perfectly fine in Chrome and Firefox. Is there a known scenario with the `<dialog>` element in Edge or any workarounds to ensure it closes properly? Any insights would be greatly appreciated! I'm working on a service that needs to handle this. What am I doing wrong? This is part of a larger CLI tool I'm building. I'd really appreciate any guidance on this. I recently upgraded to Html stable. What's the correct way to implement this? My team is using Html for this service. What am I doing wrong? I'm using Html 3.10 in this project.