report.print() does not print entire iframe, some parts are missing.

[ItAccounts]

I have an asp.net page. I am embedding my powerbi report:

var config = {
type: 'report',
tokenType: 1,

accessToken: token,
pageView: 'fitToWidth',
embedUrl: embedurl,
id: reportid,

permissions: 7,
settings: {
   filterPaneEnabled: true,
   background: 0, //set 1 to remove grey background.
   navContentPaneEnabled: true,
   layoutType: 1,
   customLayout: {
      displayOption: 2
   }
}
};

var reportContainer = document.getElementById('reportContainer');
var report = powerbi.embed(reportContainer, config);

I have print button: 

<button type="button" class="btn btn-danger dropdown-toggle" style="margin-left:3px;" onclick="myfunction()">
   <span> Print page </span>
</button>

and function to print:

function myfunction() {
   var repcon = document.getElementById('reportContainer');
   var rep = powerbi.get(reportContainer);

   rep.print();
}

My problem is, it is not printing all the iframe but a part of it only, like 300% zoomed-in print. Same problem with this person: https://stackoverflow.com/questions/42049025/embedded-media-on-iframe-zooms-in-windows-print/4205217...

I am using Chrome. Could not find a way to handle it. Also explained here: https://stackoverflow.com/questions/55067770/how-to-disable-mediaprint-while-printing-content-of-ifr...

Any help would be appreciated. Regards.

[lm1982]

Any update on this issue?

how come microsoft is ignoring this problem?

[pbdev]

Any progress on this? I have the same problem with a React based application and the problem persists on all browsers. Media queries don't seem to have any effect on the parent div or the iframe. I haven't found any solution for this, only people who are struggling with the same problem.