Search code examples
htmlgoogle-chromepdfhyperlinkcompatibility

New Tab Hyperlink to PDF


I noticed that if I create a hyperlink to a PDF with target="_blank" it doesn't open correctly. It opens up a new tab but doesn't load the PDF, it just shows a white screen. I'm using Google Chrome v.43. Has anyone else noticed this problem or found a fix?

I've tested this with Safari and with Firefox and both don't have any problems opening PDFs to a new tab. I've also tried disabling my add-ons in Chrome and using Incognito mode with no luck.

Test link: http://jsfiddle.net/fkfxoho0/

<a href="http://static.googleusercontent.com/media/www.google.com/en/us/webmasters/docs/search-engine-optimization-starter-guide.pdf" target="_blank">Optimization Starter Guide</a>

Video of Chrome v.42 and then the problem with v.43:
https://youtu.be/v_EAedODKfA


Solution

  • The issue appears to be caused by iframes with the sandbox attribute (like JSFiddle), as this issue does not happen with links outside such iframes. The issue can be reproduced outside of JSFiddle with the following HTML files.

    frame.html:

    <iframe sandbox="allow-same-origin allow-forms allow-popups allow-scripts" src="content.html"></iframe>
    

    content.html:

    <a href="https://www.adobe.com/enterprise/accessibility/pdfs/acro6_cg_ue.pdf">default</a>
    <a href="https://www.adobe.com/enterprise/accessibility/pdfs/acro6_cg_ue.pdf" target="_blank">_blank</a>
    <a href="https://www.adobe.com/enterprise/accessibility/pdfs/acro6_cg_ue.pdf" target="_top">_top</a>
    

    With these sandbox values, the default target, _blank, and _top all fail to render a PDF, with the default failing to render in the iframe, and _blank and _top opening a new tab which fails (_top opens a new tab because of sandboxing).

    If we add the allow-top-navigation sandbox value, we can make _top work as expected.

    <iframe sandbox="allow-same-origin allow-top-navigation allow-forms allow-popups allow-scripts" src="content.html"></iframe>
    

    However, the new tab opened by _blank still fails to render the PDF. Even if I add all of the sandbox relaxing properties on MDN, the issue is still present (not that I expected adding allow-pointer-lock to do anything).

    <iframe sandbox="allow-same-origin allow-top-navigation allow-forms allow-popups allow-scripts allow-pointer-lock" src="content.html"></iframe>
    

    The only way I can get _blank to work inside an iframe in Chrome 43 is to remove the sandbox attribute entirely.

    <iframe src="content.html"></iframe>
    

    Now the default target, _blank, and _top work as expected.

    Unfortunately, removing the sandbox attribute isn't much of a workaround. If you are using it in the first place, you probably have a need for it. I can't say for sure there isn't a security reason for blocking PDF files in a sandboxed iframe, but the user experience from this leads me to believe this is more-likely a bug.

    I've opened an a bug report for this issue, linking back to this question:

    https://code.google.com/p/chromium/issues/detail?id=505860

    UPDATE: Turns out this is a by-design security feature, so it probably won't be returning to the Chrome 42 behavior, but a new sandbox option may be added in the future to relax this security feature.

    UPDATE-2: The sandbox attribute that does allow this feature is 'allow-popups-to-escape-sandbox'. More info here