diff --git a/test/basic.dom.test.js b/test/basic.dom.test.js index 9e3b881a67..6a3198e134 100644 --- a/test/basic.dom.test.js +++ b/test/basic.dom.test.js @@ -1,20 +1,12 @@ import test from 'ava' import { resolve } from 'path' -import puppeteer from 'puppeteer' -import { Nuxt, Builder } from '../index.js' +import { Nuxt, Builder } from '../index' +import * as browser from './helpers/browser' const port = 4003 const url = (route) => 'http://localhost:' + port + route let nuxt = null -let browser -const open = async (path) => { - const page = await browser.newPage() - await page.goto(url(path)) - await page.waitForFunction('!!window.$nuxt') - page.html = () => page.evaluate(() => window.document.documentElement.outerHTML) - return page -} // Init nuxt.js and create server listening on localhost:4003 test.before('Init Nuxt.js', async t => { @@ -33,34 +25,30 @@ test.before('Init Nuxt.js', async t => { await nuxt.listen(port, 'localhost') }) -test.before('Start Puppeteer', async t => { - // https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#puppeteerlaunchoptions - browser = await puppeteer.launch({ - args: ['--no-sandbox', '--disable-setuid-sandbox'] - }) +test.before('Start browser', async t => { + await browser.start() }) test('/stateless', async t => { - const page = await open('/stateless') - const h1 = await page.$eval('h1', (h1) => h1.textContent) - const loading = await page.evaluate(() => window.$nuxt.$loading.$data) + const page = await browser.page(url('/stateless')) + const loading = await page.nuxt.loadingData() t.is(await page.title(), 'Nuxt.js') - t.is(h1, 'My component!') + t.is(await page.$text('h1'), 'My component!') t.is(loading.show, false) t.is(loading.percent, 0) await page.close() }) test('/css', async t => { - const page = await open('/css') + const page = await browser.page(url('/css')) t.is(await page.$eval('.red', (red) => red.textContent), 'This is red') t.is(await page.$eval('.red', (red) => window.getComputedStyle(red).color), 'rgb(255, 0, 0)') await page.close() }) test('/stateful', async t => { - const page = await open('/stateful') + const page = await browser.page(url('/stateful')) const html = await page.html() t.true(html.includes('

The answer is 42

')) await page.close() @@ -207,7 +195,6 @@ test.after('Closing server and nuxt.js', t => { nuxt.close() }) -test.after('Close Puppeteer', async t => { - await browser.close() - browser = null +test.after('Stop browser', async t => { + await browser.stop() }) diff --git a/test/children.path.test.js b/test/children.path.test.js new file mode 100644 index 0000000000..fcdc2d90d5 --- /dev/null +++ b/test/children.path.test.js @@ -0,0 +1,80 @@ +import test from 'ava' +import { resolve } from 'path' +import { Nuxt, Builder } from '../index.js' +import * as browser from './helpers/browser' + +const port = 4005 +const url = (route) => 'http://localhost:' + port + route + +let nuxt = null + +// Init nuxt.js and create server listening on localhost:4000 +test.before('Init Nuxt.js', async t => { + const options = { + rootDir: resolve(__dirname, 'fixtures/children'), + dev: false + } + nuxt = new Nuxt(options) + await new Builder(nuxt).build() + + await nuxt.listen(port, 'localhost') +}) +test.before('Start browser', async t => { + await browser.start() +}) + +let page +const dates = {} + +test('Loading /patch and keep ', async t => { + page = await browser.page(url('/patch')) + + const h1 = await page.$text('h1') + t.true(h1.includes('patch:')) + const h2 = await page.$text('h2') + t.is(h2, 'Index') + dates.patch = await page.$text('[data-date-patch]') +}) + +test('Navigate to /patch/1', async t => { + await page.nuxt.navigate('/patch/1') + const loading = await page.nuxt.loadingData() + t.is(loading.show, true) + await page.nuxt.waitForNavigation() + + const h2 = await page.$text('h2') + t.true(h2.includes('_id:')) + dates.id = await page.$text('[data-date-id]') + + t.is(dates.patch, await page.$text('[data-date-patch]')) +}) + +test('Navigate to /patch/2', async t => { + await page.nuxt.navigate('/patch/2', true) + const date = await page.$text('[data-date-id]') + + t.is(dates.patch, await page.$text('[data-date-patch]')) + t.true(+dates.id < +date) + dates.id = date +}) + +test('Navigate to /patch/2?test=true', async t => { + await page.nuxt.navigate('/patch/2?test=true', true) + t.is(dates.patch, await page.$text('[data-date-patch]')) + t.is(dates.id, await page.$text('[data-date-id]')) +}) + +test('Navigate to /patch/2#test', async t => { + await page.nuxt.navigate('/patch/2#test', true) + t.is(dates.patch, await page.$text('[data-date-patch]')) + t.is(dates.id, await page.$text('[data-date-id]')) +}) + +// Close server and ask nuxt to stop listening to file changes +test.after('Closing server and nuxt.js', t => { + nuxt.close() +}) +test.after('Stop browser', async t => { + await page.close() + await browser.stop() +}) diff --git a/test/fixtures/children/layouts/patch.vue b/test/fixtures/children/layouts/patch.vue index 3fa8ff94b8..4900a5be00 100644 --- a/test/fixtures/children/layouts/patch.vue +++ b/test/fixtures/children/layouts/patch.vue @@ -5,9 +5,11 @@
  • /patch
  • /patch/1
  • /patch/2
  • +
  • /patch/2#test
  • /patch/2/child
  • /patch/2/child/1
  • /patch/2/child/1?query=true
  • +
  • /patch/2/child/1?query=true#test
  • diff --git a/test/fixtures/children/pages/patch.vue b/test/fixtures/children/pages/patch.vue index 0c56e113b2..c4cfa21c6f 100644 --- a/test/fixtures/children/pages/patch.vue +++ b/test/fixtures/children/pages/patch.vue @@ -1,6 +1,6 @@ diff --git a/test/fixtures/children/pages/patch/_id.vue b/test/fixtures/children/pages/patch/_id.vue index 4f83f42169..dc5940e40c 100644 --- a/test/fixtures/children/pages/patch/_id.vue +++ b/test/fixtures/children/pages/patch/_id.vue @@ -1,6 +1,6 @@ diff --git a/test/fixtures/children/pages/patch/_id/child/_slug.vue b/test/fixtures/children/pages/patch/_id/child/_slug.vue index ed5491dfc1..c82d3aa74d 100644 --- a/test/fixtures/children/pages/patch/_id/child/_slug.vue +++ b/test/fixtures/children/pages/patch/_id/child/_slug.vue @@ -1,13 +1,54 @@ diff --git a/test/helpers/browser.js b/test/helpers/browser.js new file mode 100644 index 0000000000..168a0809c5 --- /dev/null +++ b/test/helpers/browser.js @@ -0,0 +1,41 @@ +import puppeteer from 'puppeteer' + +let browser = null + +export async function start() { + // https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#puppeteerlaunchoptions + browser = await puppeteer.launch({ + args: ['--no-sandbox', '--disable-setuid-sandbox'] + }) +} + +export async function stop() { + if (!browser) return + await browser.close() +} + +export async function page(url) { + if (!browser) throw new Error('Please call start() before page(url)') + const page = await browser.newPage() + await page.goto(url) + await page.waitForFunction('!!window.$nuxt') + page.html = () => page.evaluate(() => window.document.documentElement.outerHTML) + page.$text = (selector) => page.$eval(selector, (el) => el.textContent) + page.$nuxt = await page.evaluateHandle('window.$nuxt') + + page.nuxt = { + async navigate(path, wait = false) { + await page.evaluate(($nuxt, path) => $nuxt.$router.push(path), page.$nuxt, path) + if (wait) { + await this.waitForNavigation() + } + }, + loadingData() { + return page.evaluate(($nuxt) => $nuxt.$loading.$data, page.$nuxt) + }, + waitForNavigation() { + return page.waitForFunction('window.$nuxt.$loading.$data.show === false') + } + } + return page +}