From bb9427ee743a556761105dd0c4e7e474e922aee6 Mon Sep 17 00:00:00 2001 From: Ahad Birang Date: Sun, 24 Nov 2019 16:01:21 +0330 Subject: [PATCH] feat(vue-renderer): support evaluation in templates (#6505) --- examples/custom-template/app.html | 13 +++++ examples/custom-template/nuxt.config.js | 5 ++ examples/custom-template/package.json | 12 +++++ examples/custom-template/pages/index.vue | 5 ++ packages/vue-renderer/src/renderer.js | 3 +- .../custom-app-template/nuxt.config.js | 5 +- .../custom-app-template/test/mytemplate.html | 5 ++ test/unit/custom-app-template.test.js | 50 +++++++++++++++---- 8 files changed, 87 insertions(+), 11 deletions(-) create mode 100644 examples/custom-template/app.html create mode 100644 examples/custom-template/nuxt.config.js create mode 100644 examples/custom-template/package.json create mode 100644 examples/custom-template/pages/index.vue diff --git a/examples/custom-template/app.html b/examples/custom-template/app.html new file mode 100644 index 0000000000..7ca7bf601f --- /dev/null +++ b/examples/custom-template/app.html @@ -0,0 +1,13 @@ + + + {{ HEAD }} + {% if (ENV.NODE_ENV === 'dev') { %} + + {% } else if (ENV.NODE_ENV === 'production') { %} + + {% } %} + + + {{ APP }} + + \ No newline at end of file diff --git a/examples/custom-template/nuxt.config.js b/examples/custom-template/nuxt.config.js new file mode 100644 index 0000000000..dcb73ae944 --- /dev/null +++ b/examples/custom-template/nuxt.config.js @@ -0,0 +1,5 @@ +module.exports = { + env: { + NODE_ENV: process.env.NODE_ENV + } +} diff --git a/examples/custom-template/package.json b/examples/custom-template/package.json new file mode 100644 index 0000000000..947bf1ab11 --- /dev/null +++ b/examples/custom-template/package.json @@ -0,0 +1,12 @@ +{ + "name": "example-custom-template", + "dependencies": { + "nuxt": "latest" + }, + "scripts": { + "dev": "nuxt", + "build": "nuxt build", + "start": "nuxt start", + "post-update": "yarn upgrade --latest" + } +} diff --git a/examples/custom-template/pages/index.vue b/examples/custom-template/pages/index.vue new file mode 100644 index 0000000000..bd5ee17b4b --- /dev/null +++ b/examples/custom-template/pages/index.vue @@ -0,0 +1,5 @@ + diff --git a/packages/vue-renderer/src/renderer.js b/packages/vue-renderer/src/renderer.js index edef50565a..c10af74b84 100644 --- a/packages/vue-renderer/src/renderer.js +++ b/packages/vue-renderer/src/renderer.js @@ -354,7 +354,8 @@ export default class VueRenderer { parseTemplate (templateStr) { return template(templateStr, { - interpolate: /{{([\s\S]+?)}}/g + interpolate: /{{([\s\S]+?)}}/g, + evaluate: /{%([\s\S]+?)%}/g }) } diff --git a/test/fixtures/custom-app-template/nuxt.config.js b/test/fixtures/custom-app-template/nuxt.config.js index bf38e4a8da..ec8138d666 100644 --- a/test/fixtures/custom-app-template/nuxt.config.js +++ b/test/fixtures/custom-app-template/nuxt.config.js @@ -1,3 +1,6 @@ export default { - appTemplatePath: './test/mytemplate.html' + appTemplatePath: './test/mytemplate.html', + env: { + tracker: 'ga' + } } diff --git a/test/fixtures/custom-app-template/test/mytemplate.html b/test/fixtures/custom-app-template/test/mytemplate.html index 58ae46aa69..d1ae3fc195 100644 --- a/test/fixtures/custom-app-template/test/mytemplate.html +++ b/test/fixtures/custom-app-template/test/mytemplate.html @@ -2,6 +2,11 @@ {{ HEAD }} + {% if (ENV.tracker === 'ga') { %} + + {% } else if (ENV.tracker === 'heap') { %} + + {% } %} {{ APP }} diff --git a/test/unit/custom-app-template.test.js b/test/unit/custom-app-template.test.js index 9a9c177920..bb61660ec7 100644 --- a/test/unit/custom-app-template.test.js +++ b/test/unit/custom-app-template.test.js @@ -1,25 +1,57 @@ import { getPort, loadFixture, Nuxt } from '../utils' -let port -let nuxt = null +let options describe('custom-app-template', () => { beforeAll(async () => { - const options = await loadFixture('custom-app-template') - nuxt = new Nuxt(options) + options = await loadFixture('custom-app-template') + }) + + test('Home page with google analytics', async () => { + const nuxt = new Nuxt(options) await nuxt.ready() - port = await getPort() + const port = await getPort() await nuxt.server.listen(port, '0.0.0.0') - }) - test('/', async () => { + const { html } = await nuxt.server.renderRoute('/') expect(html).toContain('

My Template

') expect(html).toContain('

Custom!

') + expect(html).toContain('Google Analytics') + + await nuxt.close() }) - // Close server and ask nuxt to stop listening to file changes - afterAll(async () => { + test('Home page with heap analytics', async () => { + const nuxt = new Nuxt(options) + options.env.tracker = 'heap' + await nuxt.ready() + + const port = await getPort() + await nuxt.server.listen(port, '0.0.0.0') + + const { html } = await nuxt.server.renderRoute('/') + expect(html).toContain('

My Template

') + expect(html).toContain('

Custom!

') + expect(html).toContain('Heap Analytics') + + await nuxt.close() + }) + + test('Home page with no analytics', async () => { + const nuxt = new Nuxt(options) + options.env.tracker = '-' + await nuxt.ready() + + const port = await getPort() + await nuxt.server.listen(port, '0.0.0.0') + + const { html } = await nuxt.server.renderRoute('/') + expect(html).toContain('

My Template

') + expect(html).toContain('

Custom!

') + expect(html).not.toContain('google Analytics') + expect(html).not.toContain('Heap Analytics') + await nuxt.close() }) })