Why the intercom widget disappear from the page?

I did a simple HTML page that includes the intercom widget, but when I open the page the widget disappears in less than a second. Does anyone know how to fix this or why it happens? The code I’m using:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Intercom Widget Example</title>
</head>
<body>
  <h1>Welcome to My Website</h1>
  <p>This is a simple webpage with an Intercom widget integrated.</p>

  <!-- Intercom Widget Code -->
  <script>
  window.intercomSettings = {
    api_base: "https://api-iam.intercom.io",
    app_id: "XXXXXXXX",
  };
</script>


<script>
'https://widget.intercom.io/widget/xxxxxxxx'
  (function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/xxxxxxxx';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(document.readyState==='complete'){l();}else if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();
</script>
</body>
</html>