mirror of
https://github.com/hanzoai/next.js.git
synced 2026-10-30 14:46:38 +00:00
Tim NeutkensandGitHub
e860cec656
### What? Migrate remaining direct `next-webdriver` test callers that have a `NextInstance` to `next.browser()`, and expose the shared `Playwright` browser type from `e2e-utils`. ### Why? `NextInstance.browser` should be the supported browser-opening interface for test fixtures, with `next-webdriver` kept as the private implementation detail. ### How? Updated affected development, e2e, and production tests to call `next.browser()` directly, passing `baseUrl` where tests intentionally target a manually spawned or proxied server. Shared helpers now receive browser callbacks from the test context, and browser types import `Playwright` from `e2e-utils` instead of deriving from `next.browser` or importing from private paths. <!-- NEXT_JS_LLM_PR -->
170 lines
5.3 KiB
TypeScript
170 lines
5.3 KiB
TypeScript
import { FileRef, nextTestSetup } from 'e2e-utils'
|
|
import { check } from 'next-test-utils'
|
|
import { join } from 'path'
|
|
import assert from 'assert'
|
|
|
|
describe('reload-scroll-back-restoration', () => {
|
|
const { next } = nextTestSetup({
|
|
files: {
|
|
pages: new FileRef(join(__dirname, 'pages')),
|
|
'next.config.js': new FileRef(join(__dirname, 'next.config.js')),
|
|
},
|
|
dependencies: {},
|
|
})
|
|
|
|
it('should restore the scroll position on navigating back', async () => {
|
|
const browser = await next.browser('/0')
|
|
await browser.eval(() => document.querySelector('#link').scrollIntoView())
|
|
|
|
// check browser restoration setting
|
|
const scrollRestoration = await browser.eval(
|
|
() => window.history.scrollRestoration
|
|
)
|
|
expect(scrollRestoration).toBe('manual')
|
|
|
|
const scrollPositionMemories: Array<{ x: number; y: number }> = []
|
|
scrollPositionMemories.push({
|
|
x: Math.floor(await browser.eval(() => window.scrollX)),
|
|
y: Math.floor(await browser.eval(() => window.scrollY)),
|
|
})
|
|
|
|
// check initial value
|
|
expect(scrollPositionMemories[0].x).not.toBe(0)
|
|
expect(scrollPositionMemories[0].y).not.toBe(0)
|
|
|
|
await browser.eval(`window.next.router.push('/1')`)
|
|
await browser.eval(() => document.querySelector('#link').scrollIntoView())
|
|
scrollPositionMemories.push({
|
|
x: Math.floor(await browser.eval(() => window.scrollX)),
|
|
y: Math.floor(await browser.eval(() => window.scrollY)),
|
|
})
|
|
await browser.eval(`window.next.router.push('/2')`)
|
|
|
|
// check restore value on history index: 1
|
|
await browser.back()
|
|
await check(
|
|
() => browser.eval(() => document.documentElement.innerHTML),
|
|
/routeChangeComplete/
|
|
)
|
|
|
|
await check(async () => {
|
|
assert.equal(
|
|
scrollPositionMemories[1].x,
|
|
Math.floor(await browser.eval(() => window.scrollX))
|
|
)
|
|
assert.equal(
|
|
scrollPositionMemories[1].y,
|
|
Math.floor(await browser.eval(() => window.scrollY))
|
|
)
|
|
return 'success'
|
|
}, 'success')
|
|
|
|
await browser.refresh()
|
|
|
|
await check(async () => {
|
|
const isReady = await browser.eval('next.router.isReady')
|
|
return isReady ? 'success' : isReady
|
|
}, 'success')
|
|
|
|
// check restore value on history index: 0
|
|
await browser.back()
|
|
await check(
|
|
() => browser.eval(() => document.documentElement.innerHTML),
|
|
/routeChangeComplete/
|
|
)
|
|
|
|
await check(async () => {
|
|
assert.equal(
|
|
scrollPositionMemories[0].x,
|
|
Math.floor(await browser.eval(() => window.scrollX))
|
|
)
|
|
assert.equal(
|
|
scrollPositionMemories[0].y,
|
|
Math.floor(await browser.eval(() => window.scrollY))
|
|
)
|
|
return 'success'
|
|
}, 'success')
|
|
})
|
|
|
|
it('should restore the scroll position on navigating forward', async () => {
|
|
const browser = await next.browser('/0')
|
|
await browser.eval(() => document.querySelector('#link').scrollIntoView())
|
|
|
|
// check browser restoration setting
|
|
const scrollRestoration = await browser.eval(
|
|
() => window.history.scrollRestoration
|
|
)
|
|
expect(scrollRestoration).toBe('manual')
|
|
|
|
const scrollPositionMemories: Array<{ x: number; y: number }> = []
|
|
scrollPositionMemories.push({
|
|
x: Math.floor(await browser.eval(() => window.scrollX)),
|
|
y: Math.floor(await browser.eval(() => window.scrollY)),
|
|
})
|
|
|
|
// check initial value
|
|
expect(scrollPositionMemories[0].x).not.toBe(0)
|
|
expect(scrollPositionMemories[0].y).not.toBe(0)
|
|
|
|
await browser.eval(`window.next.router.push('/1')`)
|
|
await browser.eval(() => document.querySelector('#link').scrollIntoView())
|
|
scrollPositionMemories.push({
|
|
x: Math.floor(await browser.eval(() => window.scrollX)),
|
|
y: Math.floor(await browser.eval(() => window.scrollY)),
|
|
})
|
|
await browser.eval(`window.next.router.push('/2')`)
|
|
await browser.eval(() => document.querySelector('#link').scrollIntoView())
|
|
scrollPositionMemories.push({
|
|
x: Math.floor(await browser.eval(() => window.scrollX)),
|
|
y: Math.floor(await browser.eval(() => window.scrollY)),
|
|
})
|
|
|
|
// check restore value on history index: 1
|
|
await browser.back()
|
|
await browser.back()
|
|
await browser.forward()
|
|
await check(
|
|
() => browser.eval(() => document.documentElement.innerHTML),
|
|
/routeChangeComplete/
|
|
)
|
|
|
|
await check(async () => {
|
|
assert.equal(
|
|
scrollPositionMemories[1].x,
|
|
Math.floor(await browser.eval(() => window.scrollX))
|
|
)
|
|
assert.equal(
|
|
scrollPositionMemories[1].y,
|
|
Math.floor(await browser.eval(() => window.scrollY))
|
|
)
|
|
return 'success'
|
|
}, 'success')
|
|
|
|
await browser.refresh()
|
|
|
|
await check(async () => {
|
|
const isReady = await browser.eval('next.router.isReady')
|
|
return isReady ? 'success' : isReady
|
|
}, 'success')
|
|
|
|
// check restore value on history index: 2
|
|
await browser.forward()
|
|
await check(
|
|
() => browser.eval(() => document.documentElement.innerHTML),
|
|
/routeChangeComplete/
|
|
)
|
|
|
|
await check(async () => {
|
|
assert.equal(
|
|
scrollPositionMemories[2].x,
|
|
Math.floor(await browser.eval(() => window.scrollX))
|
|
)
|
|
assert.equal(
|
|
scrollPositionMemories[2].y,
|
|
Math.floor(await browser.eval(() => window.scrollY))
|
|
)
|
|
return 'success'
|
|
}, 'success')
|
|
})
|
|
})
|