feat: support setting (non-essential) vue-meta options by user (#6432)

This commit is contained in:
Pim 2019-09-18 15:51:44 +02:00 committed by Pooya Parsa
parent ec6ef6e425
commit b17f331fe5
13 changed files with 49 additions and 48 deletions

View File

@ -6,6 +6,8 @@ export default () => ({
}
},
vueMeta: null,
head: {
meta: [],
link: [],

View File

@ -367,6 +367,7 @@ Object {
"silent": true,
},
},
"vueMeta": null,
"watch": Array [
"/var/nuxt/test/nuxt.config.js",
],

View File

@ -334,6 +334,7 @@ Object {
"silent": undefined,
},
},
"vueMeta": null,
"watch": Array [],
"watchers": Object {
"chokidar": Object {
@ -681,6 +682,7 @@ Object {
"silent": undefined,
},
},
"vueMeta": null,
"watch": Array [],
"watchers": Object {
"chokidar": Object {

View File

@ -43,14 +43,17 @@ Vue.component(NuxtChild.name, NuxtChild)
// Component: <Nuxt>`
Vue.component(Nuxt.name, Nuxt)
<% if (features.meta) { %>
<% if (features.meta) {
// vue-meta configuration
Vue.use(Meta, {
const vueMetaOptions = {
...nuxtOptions.vueMeta,
keyName: 'head', // the component option name that vue-meta looks for meta info on.
attribute: 'data-n-head', // the attribute name vue-meta adds to the tags it observes
ssrAttribute: 'data-n-head-ssr', // the attribute name that lets vue-meta know that meta info has already been server-rendered
tagIDKeyName: 'hid' // the property name that vue-meta uses to determine whether to overwrite or append a tag
})
}
%>
Vue.use(Meta, <%= JSON.stringify(vueMetaOptions) %>)<%= isTest ? '// eslint-disable-line' : '' %>
<% } %>
<% if (features.transitions) { %>

View File

@ -13,10 +13,11 @@ export default class SPARenderer extends BaseRenderer {
this.cache = new LRU()
this.vueMetaConfig = {
ssrAppId: '1',
...this.options.vueMeta,
keyName: 'head',
attribute: 'data-n-head',
ssrAttribute: 'data-n-head-ssr',
ssrAppId: '1',
tagIDKeyName: 'hid'
}
}

View File

@ -8,6 +8,15 @@
export default {
head: {
title: 'My title',
htmlAttrs: {
foo: 'baz'
},
headAttrs: {
bar: 'foo'
},
bodyAttrs: {
baz: 'bar'
},
meta: [
{ content: 'my meta' }
],

View File

@ -1,3 +0,0 @@
import { buildFixture } from '../../utils/build'
buildFixture('meta-attrs')

View File

@ -1,15 +0,0 @@
export default {
head: {
htmlAttrs: {
foo: 'baz'
},
headAttrs: {
bar: 'foo'
},
bodyAttrs: {
baz: 'bar'
}
}
}

View File

@ -11,6 +11,9 @@ export default {
total: true
}
},
vueMeta: {
ssrAppId: 'test-ssr-app-id'
},
router: {
base: '/test/',
middleware: 'noop',

View File

@ -0,0 +1,13 @@
<template>
<div>
<h1>Head page</h1>
</div>
</template>
<script>
export default {
head: {
noscript: [{ innerHTML: 'noscript' }]
}
}
</script>

View File

@ -82,13 +82,17 @@ describe('basic ssr', () => {
const window = await nuxt.server.renderAndGetWindow(url('/head'))
expect(window.document.title).toBe('My title - Nuxt.js')
const html = window.document.body.innerHTML
const html = window.document.querySelector('html').outerHTML
expect(html).toContain('<div><h1>I can haz meta tags</h1></div>')
expect(html).toContain('<script data-n-head="ssr" src="/body.js" data-body="true">')
const metas = window.document.getElementsByTagName('meta')
expect(metas[0].getAttribute('content')).toBe('my meta')
expect(consola.log).toHaveBeenCalledWith('Body script!')
expect(html).toContain('<html foo="baz" data-n-head="foo">')
expect(html).toContain('<head bar="foo" data-n-head="bar">')
expect(html).toContain('<body baz="bar" data-n-head="baz">')
})
test('/async-data', async () => {

View File

@ -1,25 +0,0 @@
import { loadFixture, getPort, Nuxt } from '../utils'
let nuxt = null
describe('meta-attrs', () => {
beforeAll(async () => {
const options = await loadFixture('meta-attrs')
nuxt = new Nuxt(options)
await nuxt.ready()
await nuxt.server.listen(await getPort(), '0.0.0.0')
})
test('/', async () => {
const { html } = await nuxt.server.renderRoute('/')
expect(html).toContain('<html data-n-head-ssr foo="baz" data-n-head="foo">')
expect(html).toContain('<head bar="foo" data-n-head="bar">')
expect(html).toContain('<body baz="bar" data-n-head="baz">')
})
// Close server and ask nuxt to stop listening to file changes
afterAll(async () => {
await nuxt.close()
})
})

View File

@ -182,6 +182,12 @@ describe('with-config', () => {
.rejects.toMatchObject({ statusCode: 404 })
})
test('/test/head', async () => {
const window = await nuxt.server.renderAndGetWindow(url('/test/head'))
const html = window.document.querySelector('head').innerHTML
expect(html).toContain('<noscript data-n-head="test-ssr-app-id">noscript</noscript>')
})
test('should ignore files in .nuxtignore', async () => {
await expect(rp(url('/test-ignore')))
.rejects.toMatchObject({ statusCode: 404 })