PhantomJS 2.0 text not selectable when rendered to PDF

Question

Before few days I compiled PhantomJS 2.0 from source on Linux Debian. It compiled successfully, unfortunately there is a problem with web-fonts - when rendered to PDF, you can NOT select the text in the PDF, it's like a image. I'm using the following CSS code to set the fonts:

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url("/public/styles/fonts/lato-300.ttf"); }

@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url("/public/styles/fonts/lato-400.ttf"); }

The font are getting rendered, but the text is not select-able. However if I don't set any font-family and just leave the default browser font the text is select-able and everything is fine.

I have tried using SVG, WOFF and TTF formats - the result is the same. This issue doesn't exists in 1.9, but I can't use 1.9 because of missing features. I can NOT also copy the font files from 1.9 branch to 2.0, because they're using different version of QT/webkit.

Answer 1

For webfonts (like google fonts) to work properly on the render one needs to install them on the running system. Otherwise QT will render the page as bitmap because the fonts are not available.

I ended switching the page to fonts that are available to the system locally, which produces much better (native) results.