Nuxt/test/dev/basic.dev.test.js

203 lines
6.3 KiB
JavaScript
Raw Normal View History

2018-11-15 15:50:55 +00:00
import path from 'path'
2019-10-21 08:16:04 +00:00
import jsdom from 'jsdom'
import consola from 'consola'
2019-03-20 09:17:53 +00:00
import { Builder, BundleBuilder, getPort, loadFixture, Nuxt, rp, waitFor } from '../utils'
2017-06-16 12:49:35 +00:00
2018-03-18 23:41:14 +00:00
let port
2023-10-16 21:23:38 +00:00
const url = route => 'http://127.0.0.1:' + port + route
2016-12-21 19:51:43 +00:00
let nuxt = null
let builder = null
2018-05-06 19:29:59 +00:00
let transpile = null
let output = null
let loadersOptions
let vueLoader
let postcssLoader
2016-12-21 19:51:43 +00:00
2018-03-18 19:31:32 +00:00
describe('basic dev', () => {
beforeAll(async () => {
const config = await loadFixture('basic', {
2018-03-29 07:11:34 +00:00
dev: true,
debug: true,
2018-03-29 07:11:34 +00:00
buildDir: '.nuxt-dev',
build: {
filenames: {
app: ({ isDev }) => {
return isDev ? 'test-app.js' : 'test-app.[contenthash].js'
},
chunk: 'test-[name].[contenthash].js'
},
2018-05-06 19:29:59 +00:00
transpile: [
2018-11-15 15:50:55 +00:00
'@scoped/packageA',
'@scoped\\packageB',
'vue.test.js',
/vue-test/,
({ isModern }) => isModern ? 'modern-test' : 'normal-test'
2018-05-06 19:29:59 +00:00
],
loaders: {
cssModules: {
2019-06-15 10:13:05 +00:00
modules: {
localIdentName: '[hash:base64:6]'
}
}
},
extend ({ module: { rules }, output: wpOutput }, { isClient, loaders }) {
2018-05-06 19:29:59 +00:00
if (isClient) {
const babelLoader = rules.find(loader => loader.test.test('.jsx'))
transpile = file => !babelLoader.exclude(file)
output = wpOutput
loadersOptions = loaders
vueLoader = rules.find(loader => loader.test.test('.vue'))
const cssLoaders = rules.find(loader => loader.test.test('.css')).oneOf[0].use
postcssLoader = cssLoaders[cssLoaders.length - 1]
2018-05-06 19:29:59 +00:00
}
}
2019-10-21 08:16:04 +00:00
},
hooks: {
'vue-renderer:ssr:context': ({ nuxt }) => {
nuxt.logs = [{ type: 'log', args: ['This is a test ssr log'] }]
}
},
render: {
ssrLog: 'collapsed'
2018-03-29 07:11:34 +00:00
}
})
2019-03-20 09:17:53 +00:00
2018-03-18 23:41:14 +00:00
nuxt = new Nuxt(config)
2019-03-20 09:17:53 +00:00
await nuxt.ready()
builder = new Builder(nuxt, BundleBuilder)
2019-03-20 09:17:53 +00:00
await builder.build()
2019-03-20 09:17:53 +00:00
await waitFor(2000) // TODO: Find a better way
2018-03-18 23:41:14 +00:00
port = await getPort()
2023-10-16 21:23:38 +00:00
await nuxt.server.listen(port, '127.0.0.1')
2018-03-18 23:41:14 +00:00
})
2018-03-18 19:31:32 +00:00
test('Check build:done hook called', () => {
2018-08-20 14:20:45 +00:00
expect(builder.__hook_built_called__).toBe(true)
})
test('Config: build.transpile', () => {
2018-05-14 07:22:44 +00:00
expect(transpile('vue-test')).toBe(true)
2018-11-15 15:50:55 +00:00
expect(transpile(path.normalize('node_modules/test.js'))).toBe(false)
expect(transpile(path.normalize('node_modules/vue-test'))).toBe(true)
expect(transpile(path.normalize('node_modules/vue.test.js'))).toBe(true)
expect(transpile(path.normalize('node_modules/test.vue.js'))).toBe(true)
expect(transpile(path.normalize('node_modules/@scoped/packageA/src/index.js'))).toBe(true)
expect(transpile(path.normalize('node_modules/@scoped/packageB/src/index.js'))).toBe(true)
expect(transpile(path.normalize('node_modules/normal-test'))).toBe(true)
2018-05-06 19:29:59 +00:00
})
2018-03-18 19:31:32 +00:00
test('Config: build.filenames', () => {
expect(output.filename).toBe('test-app.js')
expect(output.chunkFilename).toBe('test-[name].[contenthash].js')
expect(consola.warn).toBeCalledWith(
'Notice: Please do not use contenthash in dev mode to prevent memory leak'
)
})
test('Config: build.loaders', () => {
expect(Object.keys(loadersOptions)).toHaveLength(12)
expect(loadersOptions).toHaveProperty(
'file', 'fontUrl', 'imgUrl', 'pugPlain', 'vue',
'css', 'cssModules', 'less', 'sass', 'scss', 'stylus', 'vueStyle'
)
const { cssModules, vue } = loadersOptions
2019-06-15 10:13:05 +00:00
expect(cssModules.modules.localIdentName).toBe('[hash:base64:6]')
expect(vueLoader.options).toBe(vue)
})
test('Config: preset-env and cssnano are at then end of postcss plugins', () => {
const plugins = postcssLoader.options.postcssOptions.plugins.map((plugin) => {
return plugin.postcssPlugin
}).filter(Boolean)
expect(plugins).toEqual([
'postcss-import',
'postcss-url',
'nuxt-test',
'postcss-preset-env'
])
})
2018-03-18 19:31:32 +00:00
test('/stateless', async () => {
const window = await nuxt.server.renderAndGetWindow(url('/stateless'))
2018-03-18 19:31:32 +00:00
const html = window.document.body.innerHTML
2018-11-08 09:41:24 +00:00
expect(html).toContain('<h1>My component!</h1>')
2019-03-11 13:22:09 +00:00
// Check render:routeDone hook called
expect(nuxt.__hook_render_routeDone__).toBe('/stateless')
2019-03-11 13:22:09 +00:00
window.close()
})
2018-03-18 19:31:32 +00:00
// test('/_nuxt/test.hot-update.json should returns empty html', async t => {
// try {
// await rp(url('/_nuxt/test.hot-update.json'))
// } catch (err) {
// t.is(err.statusCode, 404)
// t.is(err.response.body, '')
// }
// })
2019-03-11 13:22:09 +00:00
test('/__open-in-editor (open-in-editor)', async () => {
const { body } = await rp(url('/__open-in-editor?file=pages/index.vue'))
expect(body).toBe('')
})
2019-03-11 13:22:09 +00:00
test('/__open-in-editor should return error (open-in-editor)', async () => {
await expect(rp(url('/__open-in-editor?file='))).rejects.toMatchObject({
response: {
statusCode: 500,
body: 'launch-editor-middleware: required query param "file" is missing.'
}
})
})
test('/error should return error stack trace (Youch)', async () => {
2021-06-02 14:58:25 +00:00
await expect(nuxt.server.renderAndGetWindow(url('/error')))
.rejects.toThrow('Resource was not loaded. Status: 500')
})
2019-03-11 13:22:09 +00:00
test('/error should return json format error (Youch)', async () => {
const opts = {
headers: {
accept: 'application/json'
}
}
await expect(rp(url('/error'), opts)).rejects.toMatchObject({
response: {
statusCode: 500,
headers: {
'content-type': 'text/json; charset=utf-8'
}
}
})
})
2019-10-21 08:16:04 +00:00
test('/ should display ssr log in collapsed group', async () => {
const virtualConsole = new jsdom.VirtualConsole()
const groupCollapsed = jest.fn()
const groupEnd = jest.fn()
const log = jest.fn()
virtualConsole.on('groupCollapsed', groupCollapsed)
virtualConsole.on('groupEnd', groupEnd)
virtualConsole.on('log', log)
await nuxt.server.renderAndGetWindow(url('/'), {
virtualConsole
})
expect(groupCollapsed).toHaveBeenCalledWith(
'%cNuxt SSR',
'background: #2E495E;border-radius: 0.5em;color: white;font-weight: bold;padding: 2px 0.5em;'
)
expect(groupEnd).toHaveBeenCalled()
expect(log).toHaveBeenCalledWith('This is a test ssr log')
})
2018-03-18 19:31:32 +00:00
// Close server and ask nuxt to stop listening to file changes
2018-03-30 09:20:16 +00:00
afterAll(async () => {
await builder.close()
2018-03-18 19:31:32 +00:00
})
2016-12-21 19:51:43 +00:00
})