Package Scope
@use-funnel/browser
Bug description
스텝이 진행된 상태에서 새로고침 시 현재 스텝을 렌더링하지만 history.search와 history.state는 초기화됩니다. 여기서 다시 새로고침하면 history가 깨끗한 상태이기 때문에 첫번째 스텝을 렌더링합니다.
useFunnel 코드를 디버깅하면서 찾은 원인은 reactStrictMode가 활성화된 상태에서 cleanup 이 실행되면서 history.state가 초기화되는 것이었습니다.
Expected behavior
reactStrictMode가 켜져있는 개발 환경에서도 프로덕션 환경과 동일하게 동작(새로고침 시 step과 context를 유지)해야 합니다.
To Reproduce
Next 15 app router 환경에서 reactStrictMode를 활성화하면 발생합니다.
next/dymanic의 ssr: false를 사용하고 있기 때문에 hydration과 관련된 문제는 아닙니다.
Possible Solution
문서에는 명시되어 있지 않지만 useFunnel 훅에 disableCleanup 옵션이 있습니다. 이를 활성화하면 개발 환경에서도 production과 동일하게 cleanup하지 않고 동작합니다. 도큐먼트에서 이에 대한 안내가 추가적으로 필요할 것 같습니다.
그리고 cleanup은 상태 초기화를 위해 window.history.replaceState를 사용하는데요. 이렇게 명시적이지 않은 history 동작이 내부에서 일어나면 의도치 않은 사이드 이펙트가 우려됩니다.
퍼널이 최종적으로 완료되는 시점에 unmount와 동시에 history.pushState를 실행하는 경우가 많은데 이 경우 시점적으로 문제를 일으킬 가능성이 있지 않을까요?
searchParams와 history.state는 다음 push 액션에 포함하지 않으면 어차피 사라지기 때문에 별도의 cleanup은 필요없지 않을까 싶기도 합니다.
etc.
No response
Package Scope
@use-funnel/browser
Bug description
스텝이 진행된 상태에서 새로고침 시 현재 스텝을 렌더링하지만
history.search와history.state는 초기화됩니다. 여기서 다시 새로고침하면 history가 깨끗한 상태이기 때문에 첫번째 스텝을 렌더링합니다.useFunnel 코드를 디버깅하면서 찾은 원인은 reactStrictMode가 활성화된 상태에서
cleanup이 실행되면서 history.state가 초기화되는 것이었습니다.Expected behavior
reactStrictMode가 켜져있는 개발 환경에서도 프로덕션 환경과 동일하게 동작(새로고침 시 step과 context를 유지)해야 합니다.
To Reproduce
Next 15 app router 환경에서
reactStrictMode를 활성화하면 발생합니다.next/dymanic의ssr: false를 사용하고 있기 때문에 hydration과 관련된 문제는 아닙니다.Possible Solution
문서에는 명시되어 있지 않지만 useFunnel 훅에
disableCleanup옵션이 있습니다. 이를 활성화하면 개발 환경에서도 production과 동일하게cleanup하지 않고 동작합니다. 도큐먼트에서 이에 대한 안내가 추가적으로 필요할 것 같습니다.그리고 cleanup은 상태 초기화를 위해
window.history.replaceState를 사용하는데요. 이렇게 명시적이지 않은 history 동작이 내부에서 일어나면 의도치 않은 사이드 이펙트가 우려됩니다.퍼널이 최종적으로 완료되는 시점에 unmount와 동시에 history.pushState를 실행하는 경우가 많은데 이 경우 시점적으로 문제를 일으킬 가능성이 있지 않을까요?
searchParams와 history.state는 다음 push 액션에 포함하지 않으면 어차피 사라지기 때문에 별도의 cleanup은 필요없지 않을까 싶기도 합니다.
etc.
No response