Integration of gradio UI in a HTML page

Intermediate
1

WHen i try to embed the gradio interface in an HTML iframe and i call it i’m getting the error:
File “C:\Users\docian\PycharmProjects\medical_assistant\venv\lib\site-packages\fastapi\routing.py”, line 301, in app
raw_response = await run_endpoint_function(
File “C:\Users\docian\PycharmProjects\medical_assistant\venv\lib\site-packages\fastapi\routing.py”, line 212, in run_endpoint_function
return await dependant.call(**values)
File “C:\Users\docian\PycharmProjects\medical_assistant\venv\lib\site-packages\gradio\routes.py”, line 1066, in queue_join
return await queue_join_helper(body, request, username)
File “C:\Users\docian\PycharmProjects\medical_assistant\venv\lib\site-packages\gradio\routes.py”, line 1084, in queue_join_helper
success, event_id = await blocks._queue.push(
File “C:\Users\docian\PycharmProjects\medical_assistant\venv\lib\site-packages\gradio\queueing.py”, line 240, in push
async with self.pending_message_lock:
AttributeError: aenter

embedding is done like that:

<section id="chatbot" class="container">
    <h2>Chatbot</h2>
    <iframe id="gradio-iframe" src="" width="100%" height="600px"></iframe>
    <script>
        // Fetch the dynamically assigned Gradio port from the server
        fetch('/gradio_port')
            .then(response => response.json())
            .then(data => {
                document.getElementById('gradio-iframe').src = `http://localhost:${data.port}/`;
            })
            .catch(error => console.error('Error fetching Gradio port:', error));
    </script>
</section>

i have no clue what’s the matter. that interface exposed alone works like charm