I can’t get the right access to the elements inside the IFRAME tag

Faced with such a problem. I am creating an extension for the backend of one service. There was a need to integrate information from one page into another. I decided to use the IFRAME tag to access the page, get the table from there by its ID and already integrate the data of this table into the first one. Here’s the code.



let bonustable = document.getElementById('bonustable')
let iframe = document.createElement('iframe')
iframe.src = 'somepage.html'
bonustable.before(iframe)
iframe.contentWindow.onload = () => {
    console.log('frame is loaded')
    let table = iframe.contentDocument.getElementById('transactions-grid')
    console.log(table)
  }

I expect to see all the internal HTML inside the “transactions-grid” element in the console, but I don’t see it. Only the opening and closing tag. Although there are a bunch of TD tags inside to the innerText that needs access.
I’ve tried
table = window.frames['ifr'].contentDocument.getElementById('transactions-grid').getElementsByTagName('td')[0] but this returns undefined. Can you tell me why this might be?