fix: match Chrome's font fallback behavior (#15486)

* fix: match Chrome's font fallback behavior

Fixes #15481

* add a cache

* add test

* another test

* fix tests

* arial -> dejavu sans on linux apparently?
This commit is contained in:
Jeremy Apthorp 2018-11-08 06:51:51 -08:00 committed by John Kleinschmidt
parent ca2d74e118
commit 7e0e12b8a3
7 changed files with 264 additions and 0 deletions

View file

@ -10,6 +10,7 @@ const ChildProcess = require('child_process')
const { ipcRenderer, remote } = require('electron')
const { closeWindow } = require('./window-helpers')
const { resolveGetters } = require('./assert-helpers')
const { emittedOnce } = require('./events-helpers')
const { app, BrowserWindow, ipcMain, protocol, session, webContents } = remote
const isCI = remote.getGlobal('isCi')
const features = process.atomBinding('features')
@ -1312,3 +1313,59 @@ describe('chromium feature', () => {
})
})
})
describe('font fallback', () => {
async function getRenderedFonts (html) {
const w = new BrowserWindow({ show: false })
try {
const loaded = emittedOnce(w.webContents, 'did-finish-load')
w.loadURL(`data:text/html,${html}`)
await loaded
w.webContents.debugger.attach()
const sendCommand = (...args) => new Promise((resolve, reject) => {
w.webContents.debugger.sendCommand(...args, (e, r) => {
if (e) { reject(e) } else { resolve(r) }
})
})
const { nodeId } = (await sendCommand('DOM.getDocument')).root.children[0]
await sendCommand('CSS.enable')
const { fonts } = await sendCommand('CSS.getPlatformFontsForNode', { nodeId })
return fonts
} finally {
w.close()
}
}
it('should use Helvetica for sans-serif on Mac, and Arial on Windows and Linux', async () => {
const html = `<body style="font-family: sans-serif">test</body>`
const fonts = await getRenderedFonts(html)
expect(fonts).to.be.an('array')
expect(fonts).to.have.length(1)
expect(fonts[0].familyName).to.equal({
'win32': 'Arial',
'darwin': 'Helvetica',
'linux': 'DejaVu Sans' // I think this depends on the distro? We don't specify a default.
}[process.platform])
})
it('should fall back to Japanese font for sans-serif Japanese script', async function () {
if (process.platform === 'linux') {
return this.skip()
}
const html = `
<html lang="ja-JP">
<head>
<meta charset="utf-8" />
</head>
<body style="font-family: sans-serif">test 智史</body>
</html>
`
const fonts = await getRenderedFonts(html)
expect(fonts).to.be.an('array')
expect(fonts).to.have.length(1)
expect(fonts[0].familyName).to.equal({
'win32': 'Meiryo',
'darwin': 'Hiragino Kaku Gothic ProN'
}[process.platform])
})
})