Chrome Version       : 61.0.3163.100
OS Version: OS X 10.12.6

What steps will reproduce the problem?
1. Open headless/headful browser with puppeteer
2. Goto the site without css (ex. http://info.cern.ch)
3. Print fontfamily

Test codes
```
// $ npm install puppeteer && node test-codes.js
const puppeteer = require('puppeteer');

const url = 'http://info.cern.ch';
const selector = 'h1';

const getFontProperty = async (page) => {
  const font = await page.evaluate((selector) => {
    const title = document.querySelector(selector);
    return getComputedStyle(title).font;
  }, selector);
  return font;
}

const printFontProperty = async (headless) => {
  const browser = await puppeteer.launch({headless: headless});
  const page = await browser.newPage();
  await page.goto(url);
  await page.screenshot({path: `headless-${headless}.png`});
  console.log(await getFontProperty(page));
  await browser.close();
}

(async () => {
  await printFontProperty(true);
  await printFontProperty(false);
})();
```


What is the expected result?
Default fonts in the screenshot are same between headless and headful.


What happens instead of that?
`Times New Roman` is used in headless, however `Hiragino Kaku Gothic ProN` is used in headful.


Font config (Chromium)
- Standard font: Hiragino Kaku Gothic ProN
- Serif font: Hiragino Mincho ProN
- Sans-serif font: Hiragino Kaku Gothic ProN
- Fixed-width font: Osaka


Reference
- https://github.com/GoogleChrome/puppeteer/issues/922


UserAgentString: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36



 

Deleted: headless-true.png 28.8 KB

	headless-true.png 28.8 KB View Download

Deleted: headless-false.png 35.1 KB

	headless-false.png 35.1 KB View Download