Fix: fallback font tag repetition (#20382)
partially fixes #20341 - Makes sure that font fallback does not get repeated for every request. - Adds a test for the same.
This commit is contained in:
parent
5324e8b6ee
commit
16e9de3565
2 changed files with 15 additions and 5 deletions
|
@ -139,7 +139,11 @@ class FontOptimizerMiddleware implements PostProcessMiddleware {
|
|||
}
|
||||
for (const key in this.fontDefinitions) {
|
||||
const url = this.fontDefinitions[key]
|
||||
if (result.indexOf(`<style data-href="${url}">`) > -1) {
|
||||
const fallBackLinkTag = `<link rel="stylesheet" href="${url}"/>`
|
||||
if (
|
||||
result.indexOf(`<style data-href="${url}">`) > -1 ||
|
||||
result.indexOf(fallBackLinkTag) > -1
|
||||
) {
|
||||
// The font is already optimized and probably the response is cached
|
||||
continue
|
||||
}
|
||||
|
@ -148,10 +152,7 @@ class FontOptimizerMiddleware implements PostProcessMiddleware {
|
|||
/**
|
||||
* In case of unreachable font definitions, fallback to default link tag.
|
||||
*/
|
||||
result = result.replace(
|
||||
'</head>',
|
||||
`<link rel="stylesheet" href="${url}"/></head>`
|
||||
)
|
||||
result = result.replace('</head>', `${fallBackLinkTag}</head>`)
|
||||
} else {
|
||||
result = result.replace(
|
||||
'</head>',
|
||||
|
|
|
@ -184,4 +184,13 @@ describe('Font optimization for unreachable font definitions.', () => {
|
|||
'<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@700"/>'
|
||||
)
|
||||
})
|
||||
it('should not inline multiple fallback link tag', async () => {
|
||||
await renderViaHTTP(appPort, '/stars')
|
||||
// second render to make sure that the page is requested more than once.
|
||||
const html = await renderViaHTTP(appPort, '/stars')
|
||||
expect(await fsExists(builtPage('font-manifest.json'))).toBe(true)
|
||||
expect(html).not.toContain(
|
||||
'<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Voces"/><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@700"/><link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Voces"/><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:wght@700"/>'
|
||||
)
|
||||
})
|
||||
})
|
||||
|
|
Loading…
Reference in a new issue