I am trying to add googletags multiple times on the page. In some places on the page ads are displayed correctly and in some places, I see the box as shown in the attached screenshot.

Code sample:

const slot = googletag.defineSlot(   options.addUnit,   options.sizes,   options.containerId, )?.addService(googletag.pubads()); googletag.pubads().enableSingleRequest(); // Disable initial load. googletag.pubads().disableInitialLoad(); // Start ad fetching googletag.enableServices(); googletag.pubads().refresh([slot]); 

The above code is called multiple times with some different slot level targeting parameters like 'pos'.

In total, I am calling it 8 times on the page and 4 times div elements are injected dynamically in the page. Sometimes I see one generic box sometimes two or at times 3, this behavior is random. See the second screenshot after I refresh the page.

I'm trying to set html content of a new element but when I check to see if slot.getHtml() gives me the html element (set below), it shows an empty string. Any idea why this could be happening?

var slot = googletag.defineSlot('/1234567/sports', [160, 600], 'ozge')   .addService(googletag.companionAds())   .addService(googletag.pubads())   .addService(googletag.content()); googletag.content().setContent(slot, '<h2>Custom content in ad slot.</h2>') 

I use the code snippet in this link to view the newly defined slot: https://gist.github.com/rdillmanCN/a70ec955d9a982127fefadabe8b898b5