https://www.chromestatus.com/feature/5082396709879808
언로드 대화 상자 전에 사용자 제스처 필요
beforeunload 대화 상자는 표시하려는 프레임이 사용자 제스처 또는 사용자 상호 작용을받은 경우에만 표시됩니다 (또는 포함 된 프레임이 이러한 제스처를받은 경우). (beforeunload 이벤트의 전달은 변경되지 않으며 대화 상자 표시 여부 만 변경됩니다.)
여기에 우리가 직면하고있는 문제가 있습니다. 단일 페이지 앱에서 비즈니스 규칙은 사용자가 브라우저 뒤로 버튼을 클릭하면 사용자에게 경고하도록 지정합니다.
이 코드가 app.js에서 수행하는 작업은 다음과 같습니다.
componentDidMount = () => {
window.addEventListener('beforeunload', event => {
event.returnValue = `Are you sure you want to leave?`;
});
}
사용자가 페이지를 벗어나면 기본 경고 상자가 나타납니다.
그러나 Cypress 테스트 beforeEach에서는 각 테스트 전에 앱 흐름의 시작으로 돌아가는이 있습니다. beforeunload페이지를 떠나기 때문에 이벤트가 트리거 되지만 경고가 표시되지 않고 크롬 오류가 발생합니다.
언로드 대화 상자 전에 사용자 제스처 필요
누구든지 전에 이것을 실행하거나 해결 방법에 대한 단서가 있습니까?
지금 당장 생각할 수있는 유일한 것은 제거하는 beforeEach것이지만 테스트하려는 각 항목에 대해 개별 테스트가 필요합니다. 몇 페이지 테스트 파일이 아니라 ...
사용자가 상호 작용했는지 확인하기 위해 Chrome 작업을 비활성화 할 수 없어 간단한 해결 방법을 찾았습니다.
/* istanbul ignore next */
componentDidMount = () => {
if (process.env.NODE_ENV === 'production') {
window.addEventListener('beforeunload', onBrowserBack);
}
}
/* istanbul ignore next */
componentDidUpdate() {
// If another error modal is up, DO NOT trigger the beforeunload alert
if (process.env.NODE_ENV === 'production' && this.props.hasError) {
window.removeEventListener('beforeunload', onBrowserBack);
}
}
기본적으로 beforeunload 경고 모달은 이제 productionenv 에만 표시 되며 cypress 테스트 중에는 표시되지 않습니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다