JavaScript: Opening window in new tab and changing its document contents

In my on-going Blogger Blog Feed to HTML Book program, I earlier used the approach of opening a new window for the blogbook with a placeholder page, waiting for 1 second for the new window to be loaded (using setTimeout function), and after 1 second had passed, updating the document body contents of the blogbook page (in the new window) with the generated blogbook contents.

I later explored better solutions to knowing when the new window page had been loaded than the timeout which is a trial-and-error method.

Comment: "put an onload handler on the popup window which can call a function on the parent telling it that it is loaded" (posted 18 years ago!) in how to tell if a popup has fully loaded, seems to provide a solution. It worked when I tried it out in a test program.

But the solution in section Accessing popup from window in this article, of having a handler function for new window's onload event in the parent window JS code, did not work when I tried it out.

I then modified my Blogger Blog Feed to HTML Book program to use the first solution mentioned above, and it worked well. It also resolved the refresh page problem for the blogbook page window. Earlier the refresh resulted in the dynamically composed/written blog book to disappear and the placeholder contents to be shown. Now the refresh triggers the same on load handler which calls the function on the parent window to update the blogbook page, and so refresh results in same blogbook to be reloaded.

....

In the earlier version of my on-going Blogger Blog Feed to HTML Book program, on netlify at times, the blog book tab opened but its placeholder contents were not replaced by the blogbook even though the main form page reported success in loading script. Usually this did not happen once the blog book tab was already open; it happened, at times, when the blog book tab was first opened. On localhost this problem did not happen (at least I had not seen it happen in the recent past).

I was speculating that one reason for this error could be that the 1 second timeout used by the earlier version of the program to wait for blog book tab to be opened and loaded may not be enough at times on netlify, and if the blog book tab had not been loaded when the 1 sec timeout fired, then the main form JS code of assigning new HTML content to blog book tab's document.body.innerHTML may have failed. However, I did check the console log of the main form in at least one such case where blog book did not get loaded in blog book page, and IFIRC the console log showed the expected feed object related message/data and did not report any error related to assignment to blog book's page document.body.innerHTML. If the blog book page had not finished loading, document.body would probably have been undefined ... Hmm. I am not sure. Maybe there was a tiny time window where document.body was defined but Blog Book tab/page placeholder contents itself had not been loaded. In that case, the Blog Book tab/page contents would initially have got assigned the blog book HTML but later would have got replaced by placeholder content. But I did not notice any flash of Blogbook content getting replaced by placeholder which is what one would expect to happen in such a case.

Now the program loads the blog book on load of the blogbook tab/window and the 1 second timeout is no longer used. I don't know if the earlier netlify problem mentioned above will recur. That remains to be seen.