Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

PDF documents with transparent background cause page rendering to fail #6206

Closed
throwaway713 opened this issue Jul 14, 2015 · 1 comment
Closed

PDF documents with transparent background cause page rendering to fail #6206

throwaway713 opened this issue Jul 14, 2015 · 1 comment
Labels
other

Comments

@throwaway713
Copy link

Description

PDF pages sometimes fail to render completely, and instead result in an InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable. PDF documents with at least one page without a background (or have a transparent background), seem to be triggering this. This error does not occur when pages are rendered one at a time.

Versions

  • PDF.js - Stable (v1.1.114)
  • Browser - Firefox 35.0.1, IE 11.0.9600.17843
  • OS - Ubuntu 14.04 LTS, Windows 7 Build 7601

PDFs

  1. http://hdr.undp.org/sites/default/files/hdr14-report-en-1.pdf
  2. www.iso.org/iso/annual_report_2009.pdf

Code

For the first PDF:

<body>
<script src="pdf.js"></script>
<script>
  var d = PDFJS.getDocument('hdr14-report-en-1.pdf');
  function tryPage(pageNumber) {
    return function() {
      return d
        .then(function(pdf) { return pdf.getPage(pageNumber); })
        .then(function(page) {
          var c = document.createElement('canvas');
          var v = page.getViewport(0.7);
          c.width = v.width;
          c.height = v.height;

          var div = document.createElement('div');
          div.style.position = 'relative';
          div.style.display = 'inline-block';

          var txt = document.createElement('div');
          txt.appendChild(document.createTextNode(pageNumber));
          txt.style.position = 'absolute';
          txt.style.top = 0;
          txt.style.left = 0;

          div.appendChild(c);
          div.appendChild(txt);
          document.body.appendChild(div);

          return page.render({
            canvasContext: c.getContext('2d'),
            viewport: v,
          });
        });
    };
  }

  var ps = [];
  ps.push(tryPage(1)());

  // pages 13 27 45 have a transparent background
  ps.push(tryPage(13)());
  // ps.push(tryPage(27)());
  // ps.push(tryPage(45)());

  Promise.all(ps)
    .then(function() { console.log('done'); })
    .catch(console.error.bind(console));


  // this works without error
  // tryPage(1)().then(tryPage(13)).then(tryPage(27)).then(tryPage(45))

</script>
</body>

For the second PDF:

<body>
<script src="pdf.js"></script>
<script>
  var d = PDFJS.getDocument('annual_report_2009.pdf');
  function tryPage(pageNumber) {
    return function() {
      return d
        .then(function(pdf) { return pdf.getPage(pageNumber); })
        .then(function(page) {
          var c = document.createElement('canvas');
          var v = page.getViewport(0.7);
          c.width = v.width;
          c.height = v.height;

          var div = document.createElement('div');
          div.style.position = 'relative';
          div.style.display = 'inline-block';

          var txt = document.createElement('div');
          txt.appendChild(document.createTextNode(pageNumber));
          txt.style.position = 'absolute';
          txt.style.top = 0;
          txt.style.left = 0;

          div.appendChild(c);
          div.appendChild(txt);
          document.body.appendChild(div);

          return page.render({
            canvasContext: c.getContext('2d'),
            viewport: v,
          });
        });
    };
  }

  var ps = [];
  // page 30 has a transparent background
  // replacing i <= 30 with i < 30 works without error
  for (var i = 1; i <= 30; i++)
    ps.push(tryPage(i)());

  Promise.all(ps)
    .then(function() { console.log('done'); })
    .catch(console.error.bind(console));

</script>
</body>
@Snuffleupagus
Copy link
Collaborator

Closing, since this should be fixed by PR #6551 (the part about CachedCanvases).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
other
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@timvandermeij @Snuffleupagus @throwaway713