Passing a postMessage to an iframe

🎈 Using Streamlit
1

Hi guys,

When I run the code below in console from the ‘top’ of the page, it has it’s intended effect: The embedded PDF viewer pdf.js zooms in.
This is being accomplished by an event listener in viewer.html waiting to hear “zoomIn” It then executes the api command for the viewer to zoom in.

Problem is, when I try to replicate this behavior using st.components nothing happens. Only alert1 fires, so for whatever reason the rest of the code seems to not be going off. Any idea what I’m doing wrong?

st.components.v1.html('''                      
           <script>
            alert("Alert 1");
            var nestedIframe = window.frames[0].frames[0];
            nestedIframe.postMessage("zoomIn", "*");
            alert("Alert 2");
            </script>
                ''')
2

Having the exact same issue, the alert will fire, but the postMessage seemed to be eaten up by something.

I also tried the following, another way to run JavaScript, the same thing happens

def post_message_to_iframe(message):
   
    my_js = f"""
    window.parent.postMessage("hello", "*");
    """

    my_html = f"<script>{my_js}</script>"
    html(my_html)
    

if st.button("Send messsage"):
    post_message_to_iframe("Hello world!")