9743708a24
Previously a couple of different attempts at fixing this problem has been rejected, given how *crucial* this code is for the correct function of the viewer, since no one has thus far provided any evidence that the problem actually affects the default viewer[1] nor an example using the viewer components directly (without another library on top). The fact that none of the prior patches contained even a *simple* unit-test probably contributed to the unwillingness of a reviewer to sign off on the suggested changes. However, it turns out that it's possible to create a reduced test-case, using the default viewer, that demonstrates the error[2]. Since this utilizes a hidden `<iframe>`, please note that this error will thus affect Firefox as well. Note that while errors are thrown when the hidden `<iframe>` loads, the default viewer doesn't break completely since rendering does start working once the `<iframe>` becomes visible (although the errors do break the initial Toolbar state). Before making any changes here, I carefully read through not just the immediately relevant code but also the rendering code in the viewer (given it's dependence on `getVisibleElements`). After concluding that the changes should be safe in general, the default viewer was tested without any issues found. (The above being much easier with significant prior experience of working with the viewer code.) Finally the patch also adds new unit-tests, one of which explicitly triggers the relevant code-path and will thus fail with the current `master` branch. This patch also makes `PDFViewerApplication` slightly more robust against errors during document opening, to ensure that viewer/document initialization always completes as expected. Please keep in mind that even though this patch prevents an error in `getVisibleElements`, it's still not possible to set the initial position/zoom level/sidebar view etc. when the viewer is hidden since rendering and scrolling is completely dependent[3] on being able to actually access the DOM elements. --- [1] And hence the PDF Viewer that's built-in to Firefox. [2] Copy the HTML code below and save it as `iframe.html`, and place the file in the `web/` folder. Then start the server, with `gulp server`, and navigate to http://localhost:8888/web/iframe.html ```html <!DOCTYPE html> <html> <head> <title>Iframe test</title> <script> window.onload = function() { const button = document.getElementById('button1'); const frame = document.getElementById('frame1'); button.addEventListener('click', function(evt) { frame.hidden = !frame.hidden; }); }; </script> </head> <body> <button id="button1">Toggle iframe</button> <br> <iframe id="frame1" width="800" height="600" src="http://localhost:8888/web/viewer.html" hidden="true"></iframe> </body> </html> ``` [3] This is an old, pre-exisiting, issue that's not relevant to this patch as such (and it's already being tracked elsewhere). |
||
|---|---|---|
| .github | ||
| docs | ||
| examples | ||
| extensions | ||
| external | ||
| l10n | ||
| src | ||
| test | ||
| web | ||
| .editorconfig | ||
| .eslintignore | ||
| .eslintrc | ||
| .gitattributes | ||
| .gitignore | ||
| .gitmodules | ||
| .mailmap | ||
| .travis.yml | ||
| AUTHORS | ||
| EXPORT | ||
| gulpfile.js | ||
| LICENSE | ||
| package-lock.json | ||
| package.json | ||
| pdfjs.config | ||
| README.md | ||
| systemjs.config.js | ||
PDF.js 
PDF.js is a Portable Document Format (PDF) viewer that is built with HTML5.
PDF.js is community-driven and supported by Mozilla Labs. Our goal is to create a general-purpose, web standards-based platform for parsing and rendering PDFs.
Contributing
PDF.js is an open source project and always looking for more contributors. To get involved, visit:
- Issue Reporting Guide
- Code Contribution Guide
- Frequently Asked Questions
- Good Beginner Bugs
- Projects
Feel free to stop by #pdfjs on irc.mozilla.org for questions or guidance.
Getting Started
Online demo
Browser Extensions
Firefox
PDF.js is built into version 19+ of Firefox.
Chrome
- The official extension for Chrome can be installed from the Chrome Web Store. This extension is maintained by @Rob--W.
- Build Your Own - Get the code as explained below and issue
gulp chromium. Then open Chrome, go toTools > Extensionand load the (unpackaged) extension from the directorybuild/chromium.
Getting the Code
To get a local copy of the current code, clone it using git:
$ git clone https://github.com/mozilla/pdf.js.git
$ cd pdf.js
Next, install Node.js via the official package or via nvm. You need to install the gulp package globally (see also gulp's getting started):
$ npm install -g gulp-cli
If everything worked out, install all dependencies for PDF.js:
$ npm install
Finally, you need to start a local web server as some browsers do not allow opening
PDF files using a file:// URL. Run:
$ gulp server
and then you can open:
Please keep in mind that this requires an ES6 compatible browser; refer to Building PDF.js for usage with older browsers.
It is also possible to view all test PDF files on the right side by opening:
Building PDF.js
In order to bundle all src/ files into two production scripts and build the generic
viewer, run:
$ gulp generic
This will generate pdf.js and pdf.worker.js in the build/generic/build/ directory.
Both scripts are needed but only pdf.js needs to be included since pdf.worker.js will
be loaded by pdf.js. The PDF.js files are large and should be minified for production.
Using PDF.js in a web application
To use PDF.js in a web application you can choose to use a pre-built version of the library
or to build it from source. We supply pre-built versions for usage with NPM and Bower under
the pdfjs-dist name. For more information and examples please refer to the
wiki page on this subject.
Including via a CDN
PDF.js is hosted on several free CDNs:
- https://www.jsdelivr.com/package/npm/pdfjs-dist
- https://cdnjs.com/libraries/pdf.js
- https://unpkg.com/pdfjs-dist/
Learning
You can play with the PDF.js API directly from your browser using the live demos below:
More examples can be found in the examples folder. Some of them are using the pdfjs-dist package, which can be built and installed in this repo directory via gulp dist-install command.
For an introduction to the PDF.js code, check out the presentation by our contributor Julian Viereck:
More learning resources can be found at:
Questions
Check out our FAQs and get answers to common questions:
Talk to us on IRC (Internet Relay Chat):
- #pdfjs on irc.mozilla.org
File an issue:
Follow us on twitter: @pdfjs