mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
Sebastian "Sebbie" SilbermannandGitHub
fe1c1c3fb2
Rarely flakes because the Router hasn't updated yet. [`@test.source.file:test/development/pages-dir/client-navigation/shallow-routing.test.ts [email protected]:pass `](https://app.datadoghq.com/ci/test/runs?query=test_level%3Atest%20%40test.source.file%3Atest%2Fdevelopment%2Fpages-dir%2Fclient-navigation%2Fshallow-routing.test.ts%20-%40test.status%3Apass&agg_m=count&agg_m_source=base&agg_q=%40test.name&agg_q_source=base&agg_t=count¤tTab=overview&eventStack=&fromUser=false&index=citest&top_n=10&top_o=top&viz=toplist&x_missing=true&start=1776022337626&end=1776627137626&paused=false) <img width="2496" height="906" alt="CleanShot 2026-04-19 at 21 32 45@2x" src="https://github.com/user-attachments/assets/50d6af2f-8dfe-4765-ab92-3e42985a9da4" />
124 lines
3.6 KiB
TypeScript
124 lines
3.6 KiB
TypeScript
/* eslint-env jest */
|
|
|
|
import { retry, waitFor } from 'next-test-utils'
|
|
import path from 'path'
|
|
import { nextTestSetup } from 'e2e-utils'
|
|
|
|
describe('Client navigation with shallow routing', () => {
|
|
const { next } = nextTestSetup({
|
|
files: path.join(__dirname, 'fixture'),
|
|
env: {
|
|
TEST_STRICT_NEXT_HEAD: String(true),
|
|
},
|
|
})
|
|
|
|
it('should update the url without running getInitialProps', async () => {
|
|
const browser = await next.browser('/nav/shallow-routing')
|
|
await browser
|
|
.elementByCss('#increase')
|
|
.click()
|
|
.elementByCss('#increase')
|
|
.click()
|
|
|
|
await retry(async () => {
|
|
const counter = await browser.elementByCss('#counter').text()
|
|
expect(counter).toBe('Counter: 2')
|
|
})
|
|
|
|
const getInitialPropsRunCount = await browser
|
|
.elementByCss('#get-initial-props-run-count')
|
|
.text()
|
|
expect(getInitialPropsRunCount).toBe('getInitialProps run count: 1')
|
|
|
|
await browser.close()
|
|
})
|
|
|
|
it('should handle the back button and should not run getInitialProps', async () => {
|
|
const browser = await next.browser('/nav/shallow-routing')
|
|
await browser
|
|
.elementByCss('#increase')
|
|
.click()
|
|
.elementByCss('#increase')
|
|
.click()
|
|
|
|
await retry(async () => {
|
|
const counter = await browser.elementByCss('#counter').text()
|
|
expect(counter).toBe('Counter: 2')
|
|
})
|
|
|
|
await browser.back()
|
|
|
|
await retry(async () => {
|
|
const counter = await browser.elementByCss('#counter').text()
|
|
expect(counter).toBe('Counter: 1')
|
|
})
|
|
|
|
const getInitialPropsRunCount = await browser
|
|
.elementByCss('#get-initial-props-run-count')
|
|
.text()
|
|
expect(getInitialPropsRunCount).toBe('getInitialProps run count: 1')
|
|
|
|
await browser.close()
|
|
})
|
|
|
|
it('should run getInitialProps always when rending the page to the screen', async () => {
|
|
const browser = await next.browser('/nav/shallow-routing')
|
|
|
|
const counter = await browser
|
|
.elementByCss('#increase')
|
|
.click()
|
|
.elementByCss('#increase')
|
|
.click()
|
|
.elementByCss('#home-link')
|
|
.click()
|
|
.waitForElementByCss('.nav-home')
|
|
.back()
|
|
.waitForElementByCss('.shallow-routing')
|
|
.elementByCss('#counter')
|
|
.text()
|
|
expect(counter).toBe('Counter: 2')
|
|
|
|
const getInitialPropsRunCount = await browser
|
|
.elementByCss('#get-initial-props-run-count')
|
|
.text()
|
|
expect(getInitialPropsRunCount).toBe('getInitialProps run count: 2')
|
|
|
|
await browser.close()
|
|
})
|
|
|
|
it('should keep the scroll position on shallow routing', async () => {
|
|
const browser = await next.browser('/nav/shallow-routing')
|
|
await browser.eval(() =>
|
|
document.querySelector('#increase').scrollIntoView()
|
|
)
|
|
const scrollPosition = await browser.eval('window.pageYOffset')
|
|
|
|
expect(scrollPosition).toBeGreaterThan(3000)
|
|
|
|
await browser.elementByCss('#increase').click()
|
|
await waitFor(500)
|
|
const newScrollPosition = await browser.eval('window.pageYOffset')
|
|
|
|
expect(newScrollPosition).toBe(scrollPosition)
|
|
|
|
await browser.elementByCss('#increase2').click()
|
|
await waitFor(500)
|
|
const newScrollPosition2 = await browser.eval('window.pageYOffset')
|
|
|
|
expect(newScrollPosition2).toBe(0)
|
|
|
|
await browser.eval(() =>
|
|
document.querySelector('#invalidShallow').scrollIntoView()
|
|
)
|
|
const scrollPositionDown = await browser.eval('window.pageYOffset')
|
|
|
|
expect(scrollPositionDown).toBeGreaterThan(3000)
|
|
|
|
await browser.elementByCss('#invalidShallow').click()
|
|
await waitFor(500)
|
|
const newScrollPosition3 = await browser.eval('window.pageYOffset')
|
|
|
|
expect(newScrollPosition3).toBe(0)
|
|
})
|
|
})
|