Passing arguments from Streamlit to JavaScript

Custom Components
2

After applying and tweaking the snippet (Code snippet: create Components without any frontend tooling (no React, Babel, Webpack, etc)) I came up with this code:


import { Color } from "three";
import { IfcViewerAPI } from "web-ifc-viewer";

function sendMessageToStreamlitClient(type, data) {
    const message = { ...data, isStreamlitMessage: true, type };
    window.parent.postMessage(message, "*");
}

function init() {
    sendMessageToStreamlitClient("streamlit:componentReady", {apiVersion: 1});
}

function setFrameHeight(height) {
    sendMessageToStreamlitClient("streamlit:setFrameHeight", {height});
}

const viewer = new IfcViewerAPI({container: document.getElementById('viewer-container'), backgroundColor: new Color(0xffffff)});
viewer.axes.setAxes();
viewer.grid.setGrid();

async function loadIfc(url) {
    const model = await viewer.IFC.loadIfcUrl(url);
    await viewer.shadowDropper.renderShadow(model.modelID);
    viewer.context.renderer.postProduction.active = true;
}

function onDataFromPython(event) {
    if (event.data.type !== "streamlit:render") return;
    const url = event.data.args.url;
    if(url){
        loadIfc(url);
    }
}

// Hook things up!
window.addEventListener("message", onDataFromPython);
init();

// Hack to autoset the iframe height.
window.addEventListener("load", function() {
    window.setTimeout(function() {
        setFrameHeight(document.documentElement.clientHeight)
    }, 0);
});

According to console my model is being opened (parsing usinf IFC4 Schema) but no IFCjs viewer is being displayed inside streamlit. I have tested the viewer running it independently in Live Server and it is fine. It appears that the last function:

window.addEventListener("load", function() {
    window.setTimeout(function() {
        setFrameHeight(document.documentElement.clientHeight)
    }, 0);
});

Is not loading correctly. I can get the viewer to appear only if I provide hard coded height in setFrameHeight, e.g. setFrameHeight(300), but I cannot figure out how to autoset iframe height.