사파리 비동기 함수에서 window.open 우회하기

문제

Safari에서는 비동기 함수안에서 window.open 호출 시 팝업이 차단될 수 있다.

약간의 trick을 이용해 팝업을 열 수 있다.

예시

팝업 X

// 비동기함수를 통해 URL을 받아와서 팝업을 열때 차단된다.
const url = await fetchUrl();
window.open(url, 'popupName', "width=500, height=600")

팝업 X

// 빈 url은 비동기 호출 전에 만들어야한다.
const url = await fetchUrl();
const popup = window.open(undefined, 'popupName', "width=500, height=600")
popup.location.href = url

팝업 O

// 빈 url 생성 후 url 변경. 
const popup = window.open(undefined, 'popupName', "width=500, height=600")
const url = await fetchUrl();
popup.location.href = url