Open third party Live chat on the same page without opening a separate window

Target Environment: WordPress VIP
header.php

goal: click icon div to open third party chat, toggle to close if needed, chat icon to persist acrross all pages.

Hi

I’ve been tasked with integrating a 3rd Party Chat app in our site. I want it to perform like a traditional chat in-page chat app (in a div) , however, the shared script uses js the window.open method and open the chat into a separate window. I’ve tried unsuccefully to use , tags.
Suspect this shouldnt be to hard but I can’t figure it out. I hope I have enough information here.

Thanks in advance!
The code I am replacing is straight forward yet opens into a new window but I need the window to look like a modern chat

     script type="text/javascript "
   const chatFunc = () => {
          var x = screen.width - 550;
          var y = screen.height - 800;
          var params = 'height=550,width=375,popup=yes,left='+x+',top='+y;
          var Url = 'thridpartychat link';
          **window.open(Url, '', params);** // this seems to be the issue
          }
  script
    
<div id="test" class="chat" onClick="chatFunc()" data-toggle="tooltip" data-placement="top" title="Chat" style=""> </div>

My attempt:

    <div id="test" class="chat fas fa-comment-dots fa-7x embed-responsive" data-toggle="tooltip" data-placement="top" title="Chat now!" style="">
  <iframe id="chatIframe" class="embed-responsive-item" style="border:none" seamless>
      </iframe>
</div>

var x = screen.width - 550;
var y = screen.height - 800;
var params = "height=550,width=375,popup=yes,left=" + x + ",top=" + y;

var Url =
  "[link to third Party Chat]";

var test = document.getElementById('test');

test.addEventListener("click", function() {
  // Get Iframe - I had exception catch here -didnt work

  var iframe = document.getElementById('chatIframe');
  // Assign Attr-Used Object.assign at one point to no avail
  iframe.setAttribute('left', '+' + x + '+');
  iframe.setAttribute('top', '+' + y, );
  iframe.setAttribute('height', '550');
  iframe.setAttribute('weight', '375');
  iframe.setAttribute('src', 'Url');

  this.parentNode.appendChild(iframe);

  this.parentNode.removeChild(this);
});

Here is how I want the chat to look :
Goal Chat Window