Skip to content

Commit

Permalink
fix: avoid lost the state when navigate to the same URL
Browse files Browse the repository at this point in the history
  • Loading branch information
koichik committed Jul 23, 2022
1 parent 3dfeb6b commit fcd93eb
Show file tree
Hide file tree
Showing 3 changed files with 176 additions and 80 deletions.
109 changes: 74 additions & 35 deletions src/history/RecoilHistorySyncJSONNext.test.tsx
Expand Up @@ -82,28 +82,40 @@ describe('<RecoilHistorySyncJSONNext />', () => {
)
})

describe('then, navigate (pushstate)', () => {
describe('then, navigate to the same URL (replacestate)', () => {
beforeEach(() => {
act(() => {
mockRouter.push('/next')
global.history.state.key = 'test2'
mockRouter.replace('/')
})
})

it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe('Foo')
it('should be rendered with same value', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
})

describe('then, backward', () => {
describe('then, navigate to the new URL (pushstate)', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
mockRouter.push('/next')
global.history.state.key = 'test2'
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe('Foo')
})

describe('then, backward', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
})
})
})
})
Expand Down Expand Up @@ -178,30 +190,43 @@ describe('<RecoilHistorySyncJSONNext />', () => {
expect(getByTestId('bar').textContent).toBe('FooBar')
})

describe('then, navigate (pushstate)', () => {
describe('then, navigate to the same URL (replacestate)', () => {
beforeEach(() => {
act(() => {
mockRouter.push('/next')
global.history.state.key = 'test2'
mockRouter.replace('/')
})
})

it('should be restored default values', async () => {
expect(getByTestId('bar').textContent).toBe('Foo')
expect(getByTestId('baz').textContent).toBe('Foo')
it('should be rendered with same values', async () => {
expect(getByTestId('baz').textContent).toBe('FooBaz')
expect(getByTestId('bar').textContent).toBe('FooBar')
})

describe('then, backward', () => {
describe('then, navigate to the new URL (pushstate)', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
mockRouter.push('/next')
global.history.state.key = 'test2'
})
})

it('should be restored updated values', async () => {
expect(getByTestId('bar').textContent).toBe('FooBar')
expect(getByTestId('baz').textContent).toBe('FooBaz')
it('should be restored default values', async () => {
expect(getByTestId('bar').textContent).toBe('Foo')
expect(getByTestId('baz').textContent).toBe('Foo')
})

describe('then, backward', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
})
})

it('should be restored updated values', async () => {
expect(getByTestId('bar').textContent).toBe('FooBar')
expect(getByTestId('baz').textContent).toBe('FooBaz')
})
})
})
})
Expand Down Expand Up @@ -296,32 +321,46 @@ describe('<RecoilHistorySyncJSONNext />', () => {
expect(getByTestId('bar').textContent).toBe('BarBar')
})

describe('then, navigate (pushstate)', () => {
describe('then, navigate to the same URL (replacestate)', () => {
beforeEach(() => {
act(() => {
mockRouter.push('/next')
global.history.state.key = 'test2'
mockRouter.replace('/')
})
})

it('should be restored initial values', async () => {
expect(getByTestId('foo').textContent).toBe('Foo')
expect(getByTestId('bar').textContent).toBe('Bar')
expect(getByTestId('baz').textContent).toBe('Baz')
it('should be rendered with same values', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
expect(getByTestId('bar').textContent).toBe('BarBar')
expect(getByTestId('baz').textContent).toBe('BazBaz')
})

describe('then, backward', () => {
describe('then, navigate to the new URL (pushstate)', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
mockRouter.push('/next')
global.history.state.key = 'test2'
})
})

it('should be restored initial values', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
expect(getByTestId('bar').textContent).toBe('BarBar')
expect(getByTestId('baz').textContent).toBe('BazBaz')
expect(getByTestId('foo').textContent).toBe('Foo')
expect(getByTestId('bar').textContent).toBe('Bar')
expect(getByTestId('baz').textContent).toBe('Baz')
})

describe('then, backward', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
})
})

it('should be restored initial values', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
expect(getByTestId('bar').textContent).toBe('BarBar')
expect(getByTestId('baz').textContent).toBe('BazBaz')
})
})
})
})
Expand Down
130 changes: 90 additions & 40 deletions src/history/RecoilHistorySyncTransitNext.test.tsx
Expand Up @@ -80,28 +80,40 @@ describe('<RecoilHistorySyncTransitNext />', () => {
)
})

describe('then, navigate (pushstate)', () => {
describe('then, navigate to the same URL (replacestate)', () => {
beforeEach(() => {
act(() => {
mockRouter.push('/next')
global.history.state.key = 'test2'
mockRouter.replace('/')
})
})

it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe('Foo')
it('should be rendered with same value', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
})

describe('then, backward', () => {
describe('then, navigate to the new URL (pushstate)', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
mockRouter.push('/next')
global.history.state.key = 'test2'
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe('Foo')
})

describe('then, backward', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe('FooFoo')
})
})
})
})
Expand Down Expand Up @@ -161,28 +173,42 @@ describe('<RecoilHistorySyncTransitNext />', () => {
)
})

describe('then, navigate (pushstate)', () => {
describe('then, navigate to the same URL (replacestate)', () => {
beforeEach(() => {
act(() => {
mockRouter.push('/next')
global.history.state.key = 'test2'
mockRouter.replace('/')
})
})

it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe(date1.toISOString())
it('should be rendered with same value', async () => {
expect(getByTestId('foo').textContent).toBe(date2.toISOString())
})

describe('then, backward', () => {
describe('then, navigate the new URL (pushstate)', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
mockRouter.push('/next')
global.history.state.key = 'test2'
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe(date2.toISOString())
it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe(date1.toISOString())
})

describe('then, backward', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe(
date2.toISOString()
)
})
})
})
})
Expand Down Expand Up @@ -241,28 +267,40 @@ describe('<RecoilHistorySyncTransitNext />', () => {
)
})

describe('then, navigate (pushstate)', () => {
describe('then, navigate to the same URL (replacestate)', () => {
beforeEach(() => {
act(() => {
mockRouter.push('/next')
global.history.state.key = 'test2'
mockRouter.replace('/')
})
})

it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe('Foo')
it('should be rendered with same value', async () => {
expect(getByTestId('foo').textContent).toBe('Bar,Baz')
})

describe('then, backward', () => {
describe('then, navigate to the new URL (pushstate)', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
mockRouter.push('/next')
global.history.state.key = 'test2'
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe('Bar,Baz')
it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe('Foo')
})

describe('then, backward', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe('Bar,Baz')
})
})
})
})
Expand Down Expand Up @@ -324,28 +362,40 @@ describe('<RecoilHistorySyncTransitNext />', () => {
)
})

describe('then, navigate (pushstate)', () => {
describe('then, navigate to the same URL (replacestate)', () => {
beforeEach(() => {
act(() => {
mockRouter.push('/next')
global.history.state.key = 'test2'
mockRouter.replace('/')
})
})

it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe('foo,Foo')
it('should be rendered with same value', async () => {
expect(getByTestId('foo').textContent).toBe('bar,Bar,baz,Baz')
})

describe('then, backward', () => {
describe('then, navigate to the new URL (pushstate)', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
mockRouter.push('/next')
global.history.state.key = 'test2'
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe('bar,Bar,baz,Baz')
it('should be restored default value', async () => {
expect(getByTestId('foo').textContent).toBe('foo,Foo')
})

describe('then, backward', () => {
beforeEach(() => {
act(() => {
global.history.state.key = 'test1'
mockRouter.push('/') // back() is not supported yet
})
})

it('should be restored updated value', async () => {
expect(getByTestId('foo').textContent).toBe('bar,Bar,baz,Baz')
})
})
})
})
Expand Down

0 comments on commit fcd93eb

Please sign in to comment.