MessageChannel ports variable is empty array

Question

I've the following snippet that trying to send message to inner iframe:

const { port1, port2 } = new MessageChannel();
port1.addEventListener('message', ({ data }: MessageEvent) => res(data));
contentWindow?.postMessage({ event: `the-event`, payload }, '*', [port2]);

And this snippet on the iframe side:

const onMessageListener = ({ data, ports }) => {
  const { event, payload } = data;
  if (event === 'the-event') {
    console.log(data, ports); // "ports" is empty array
    state.payload = payload;
  }
};
window.addEventListener('message', onMessageListener);

But i get empty array in the ports variable, any ideas?