4

Chrome 87 and Microsoft Edge 87 updated on my computer today and now I'm seeing odd behavior when trying to view web pages embedded within our intranet through iFrames. The embedded web pages are https secured and were working totally fine on Chrome 86.

The behavior that happens is when a web page loads with an iFrame using a chromium based browser, the page will load fine. If you click on a link within the iFrame page, the content within the iFrame disappears. If you hover your mouse over the content of the iFrame, you can see the mouse pointer change into a hand when you hover over where a link must be on the page, even though you can't see any content.

Also when this behavior occurs and the content inside the iFrame is invisible, if you open Chrome Developer tools and then inspect the iFrame element, it will reappear.

Was curious if anyone has seen such behavior, or has any ideas on why content within an iFrame viewed with a chromium 87 based web browser will be invisible.

Thanks!

JoeRDG
  • 85
  • 2
  • 8
  • I didn't see such behavior on chromium 87 based browser. You can refer to my test result, the pages are all https: https://i.stack.imgur.com/KFSSB.gif. It also works well on Chrome 87. What is your exact version of Edge? Mine is 87.0.664.47. Please check if there's any update of the browser and try to update to the latest version. If the issue persists, you can provide your screenshot and give [a reproducible code snippet](https://stackoverflow.com/help/minimal-reproducible-example) so that we can have a test. – Yu Zhou Nov 25 '20 at 03:04
  • See my comment below to Adiano's answer. It has a link to a bug filed on chromium.org. Bug filer also listed an example link of the behavior we're seeing. I am running version 87.0.4280.66 of Chrome and 87.0.664.47 of Microsoft Edge. – JoeRDG Nov 25 '20 at 12:14
  • Here is the link to the bug filed on chromium.org: [link](https://bugs.chromium.org/p/chromium/issues/detail?id=1149059&q=iframe&can=2) – JoeRDG Nov 25 '20 at 16:33
  • I can reproduce the issue with that link on Edge 87.0.664.47. I also tested on Edge Can 89.0.713.0 and Edge Dev 88.0.702.0, the issue has gone. It looks like the issue will be fixed in higher version. I suggest that you can also provide feedback about this issue in Edge using Send feedback (Alt+Shift+I). – Yu Zhou Nov 26 '20 at 08:27
  • We can reproduce that in our Google Sheets extension quite easily. When you resize the window – iframe content will reappear again. – Alinaki Nov 29 '20 at 20:52

3 Answers3

0

I confirm that Chrome DEV actual version works ... (is this an answer ?!?) For those who use Chrome in business (as our guests ...) this is a big problem and also a DEV version ... can be acceptable in some cases ...

Adriano Mari - Multidata Prato

  • I have been using Google Chrome Canary and verify the issue above has been resolved. We just can't install this software on hundred's of user's computers in the meantime. Like the commenter Alinaki said above, we're having people resize the page to make the iFrame visible again until Chromium fixes this permanently. – JoeRDG Nov 30 '20 at 18:17
0

As other users have mentioned, this seems to be a rendering bug with Chromium.

While perhaps not the most elegant solution, forcing the page to redraw after the iframe has loaded is likely the best solution until Google get's their issue sorted.

$(function() { // Temporary workaround for Chromium iframe load issue
    $('iframe').on('load', function() {
        $(this).hide(0).show(0);
    })
}) 
user995551
  • 401
  • 1
  • 3
  • 8
0
  • As per chromium Bug website, Iframe blank issue observed in following versions and you get fixed starting from chrome 88.

     Issue observed in:
     Chrome 86: 86.0.4240.198
     Chrome Beta: 87.0.4280.60
    
     Issue *not* observed in:
     Chrome Dev: 88.0.4315.5
     Chrome Canary: 88.0.4324.2
     Chromium latest
    

  • If security is not concern for you, you can go to chrome flag and enable exprimental web platform flag til time Chrome 88 release officially.

chrome://flags/#enable-experimental-web-platform-features

  • If you have control over iframe page content, then you can add following tag inside iframe page.

    <canvas id="canvas" width="1px" height="1px"></canvas>

After the page loads, execute the following Javascript:

      window.setTimeout(function() {
          var c=document.getElementById("canvas");
          var ctx=c.getContext("2d");
          ctx.moveTo(0,0);
          ctx.lineTo(1,1);
          ctx.stroke();
      }, 200);
yash
  • 2,101
  • 2
  • 23
  • 32