problem in reloading iframe with updated src

So I have a window where there is an Iframe named containerframe and within that iframe I have another iframe named pcpFrame.

From pcpFrame Iframe I postMessage to raise a message event for the grandparent (parent iframe’s parent) using :
window.parent.parent.postMessage(message, '*');

In the grand-parent window I am listening to message event and execute following piece of code :

window.addEventListener('message', function (e) {
    // Get the sent data
    let iframe = window.document.getElementById("frmRightSide");
    console.log('data json', e.data)
    let msg = JSON.parse(e.data)
    if (msg?.refresh == true){
        alert("updating iframe");
        iframe.src = "https://codepen.io/pen/";
        // iframe.contentWindow.location.reload(true);
        alert("updated");
    }
});

Expected behavior :
Initially the parent iframe (called containerFrame) has pre-loaded webpage with src="https://www.youtube.com/watch?v=qz0aGYrrlhU" and after processing this message event I want to reload this parent iframe with updated src='https://codepen.io/pen'

Actually behavior :
What currently happens is that, this reloads the parent iframe (containerFrame) but instead of loading the iframe with updated src='https://codepen.io/pen/', it re-fetches the webpage with original iframe src='https://www.youtube.com/watch?v=qz0aGYrrlhU'

There are two strange things :

  1. After message event is processed (and not debugging) I saw some conflict through some console logging :
    console.log(iframe.src) // prints updated src for codepen page
    console.log(iframe.contentDocument.location) // prints previous src for youtube page
    similar thing gets reflected in the HTML elements panel too :
<iframe id="frmRightSide" width="100%" frameborder="0" scrolling="auto" style="z-index: -1; overflow-x: hidden;" onload="setIframeHeight(this)" height="1119.2px" src="https://codepen.io/pen/">
#document (https://www.youtube.com/watch?v=qz0aGYrrlhU)
<html>
<! –– rest of the code removed as no issue here ––>
</html>
</iframe>
  1. If I do this while debugging the callback of message event, iframe loads page from upated src, i.e. codepen webpage