Skip to content

Commit

Permalink
test(next/script): add more cases to strict mode test
Browse files Browse the repository at this point in the history
  • Loading branch information
SukkaW committed Aug 29, 2022
1 parent e671270 commit f7ecda9
Showing 1 changed file with 102 additions and 104 deletions.
206 changes: 102 additions & 104 deletions test/integration/script-loader/test/index.test.js
Expand Up @@ -23,78 +23,78 @@ let appPort
const runTests = (isDev = false) => {
// TODO: We will refactor the next/script to be strict mode resilient
// Don't skip the test case for dev mode (strict mode) once refactoring is finished
if (!isDev) {
it('priority afterInteractive', async () => {
let browser
try {
browser = await webdriver(appPort, '/')
await waitFor(1000)

async function test(id) {
const script = await browser.elementById(id)
const dataAttr = await script.getAttribute('data-nscript')
const endScripts = await browser.elementsByCss(
`#__NEXT_DATA__ ~ #${id}`
)
it('priority afterInteractive', async () => {
let browser
try {
browser = await webdriver(appPort, '/')
await waitFor(1000)

// Renders script tag
expect(script).toBeDefined()
expect(dataAttr).toBeDefined()
async function test(id) {
const script = await browser.elementById(id)
const dataAttr = await script.getAttribute('data-nscript')
const endScripts = await browser.elementsByCss(
`#__NEXT_DATA__ ~ #${id}`
)

// Script is inserted at the end
expect(endScripts.length).toBe(1)
}
// Renders script tag
expect(script).toBeDefined()
expect(dataAttr).toBeDefined()

// afterInteractive script in page
await test('scriptAfterInteractive')
// afterInteractive script in _document
await test('documentAfterInteractive')
} finally {
if (browser) await browser.close()
// Script is inserted at the end
expect(endScripts.length).toBe(1)
}
})

it('priority lazyOnload', async () => {
let browser
try {
browser = await webdriver(appPort, '/page3')
// afterInteractive script in page
await test('scriptAfterInteractive')
// afterInteractive script in _document
await test('documentAfterInteractive')
} finally {
if (browser) await browser.close()
}
})

await browser.waitForElementByCss('#onload-div')
await waitFor(1000)
it('priority lazyOnload', async () => {
let browser
try {
browser = await webdriver(appPort, '/page3')

const logs = await browser.log('browser')
const filteredLogs = logs.filter(
(log) =>
!log.message.includes('Failed to load resource') &&
!log.message === 'error' &&
!log.message === 'Event'
)
expect(filteredLogs.length).toBe(0)
await browser.waitForElementByCss('#onload-div')
await waitFor(1000)

async function test(id) {
const script = await browser.elementById(id)
const dataAttr = await script.getAttribute('data-nscript')
const endScripts = await browser.elementsByCss(
`#__NEXT_DATA__ ~ #${id}`
)
const logs = await browser.log('browser')
const filteredLogs = logs.filter(
(log) =>
!log.message.includes('Failed to load resource') &&
!log.message === 'error' &&
!log.message === 'Event'
)
expect(filteredLogs.length).toBe(0)

// Renders script tag
expect(script).toBeDefined()
expect(dataAttr).toBeDefined()
async function test(id) {
const script = await browser.elementById(id)
const dataAttr = await script.getAttribute('data-nscript')
const endScripts = await browser.elementsByCss(
`#__NEXT_DATA__ ~ #${id}`
)

// Script is inserted at the end
expect(endScripts.length).toBe(1)
}
// Renders script tag
expect(script).toBeDefined()
expect(dataAttr).toBeDefined()

// lazyOnload script in page
await test('scriptLazyOnload')
// lazyOnload script in _document
await test('documentLazyOnload')
} finally {
if (browser) await browser.close()
// Script is inserted at the end
expect(endScripts.length).toBe(1)
}
})

// lazyOnload script in page
await test('scriptLazyOnload')
// lazyOnload script in _document
await test('documentLazyOnload')
} finally {
if (browser) await browser.close()
}
})

if (!isDev) {
it('priority beforeInteractive', async () => {
const html = await renderViaHTTP(appPort, '/page1')
const $ = cheerio.load(html)
Expand Down Expand Up @@ -161,21 +161,23 @@ const runTests = (isDev = false) => {
if (browser) await browser.close()
}
})
}

it('onload fires correctly', async () => {
let browser
try {
browser = await webdriver(appPort, '/page4')
await waitFor(3000)
it('onload fires correctly', async () => {
let browser
try {
browser = await webdriver(appPort, '/page4')
await waitFor(3000)

const text = await browser.elementById('text').text()
const text = await browser.elementById('text').text()

expect(text).toBe('aaabbbccc')
} finally {
if (browser) await browser.close()
}
})
expect(text).toBe('aaabbbccc')
} finally {
if (browser) await browser.close()
}
})

if (!isDev) {
it('priority beforeInteractive with inline script', async () => {
const html = await renderViaHTTP(appPort, '/page5')
const $ = cheerio.load(html)
Expand Down Expand Up @@ -205,47 +207,43 @@ const runTests = (isDev = false) => {
if (browser) await browser.close()
}
})
}

it('Does not duplicate inline scripts', async () => {
let browser
try {
browser = await webdriver(appPort, '/')

// Navigate away and back to page
await browser.waitForElementByCss('[href="/page5"]')
await browser.click('[href="/page5"]')
await browser.waitForElementByCss('[href="/"]')
await browser.click('[href="/"]')
await browser.waitForElementByCss('[href="/page5"]')
await browser.click('[href="/page5"]')
it('Does not duplicate inline scripts', async () => {
let browser
try {
browser = await webdriver(appPort, '/')

await browser.waitForElementByCss('.container')
await waitFor(1000)
// Navigate away and back to page
await browser.waitForElementByCss('[href="/page5"]')
await browser.click('[href="/page5"]')
await browser.waitForElementByCss('[href="/"]')
await browser.click('[href="/"]')
await browser.waitForElementByCss('[href="/page5"]')
await browser.click('[href="/page5"]')

const text = await browser.elementById('text').text()
await browser.waitForElementByCss('.container')
await waitFor(1000)

expect(text).toBe('abc')
} finally {
if (browser) await browser.close()
}
})
const text = await browser.elementById('text').text()

it('Error message is shown if Partytown is not installed locally', async () => {
const { stdout, stderr } = await nextBuild(
appWithPartytownMissingDir,
[],
{
stdout: true,
stderr: true,
}
)
const output = stdout + stderr
expect(text).toBe('abc')
} finally {
if (browser) await browser.close()
}
})

expect(output.replace(/\n|\r/g, '')).toMatch(
/It looks like you're trying to use Partytown with next\/script but do not have the required package\(s\) installed.Please install Partytown by running:.*?(npm|pnpm|yarn) (install|add) (--save-dev|--dev) @builder.io\/partytownIf you are not trying to use Partytown, please disable the experimental "nextScriptWorkers" flag in next.config.js./
)
it('Error message is shown if Partytown is not installed locally', async () => {
const { stdout, stderr } = await nextBuild(appWithPartytownMissingDir, [], {
stdout: true,
stderr: true,
})
}
const output = stdout + stderr

expect(output.replace(/\n|\r/g, '')).toMatch(
/It looks like you're trying to use Partytown with next\/script but do not have the required package\(s\) installed.Please install Partytown by running:.*?(npm|pnpm|yarn) (install|add) (--save-dev|--dev) @builder.io\/partytownIf you are not trying to use Partytown, please disable the experimental "nextScriptWorkers" flag in next.config.js./
)
})

it('onReady fires after load event and then on every subsequent re-mount', async () => {
let browser
Expand Down

0 comments on commit f7ecda9

Please sign in to comment.