안드로이드 태블릿에서 window.open 팝업 이슈

🐞 Android 태블릿 Chrome 앱에서 window.open() 후 white screen 현상

대환장인 이유는

1. console에 에러 로그도 안 뜸
2. 왼쪽에 태블릿 화면이 나타나야 하지만 나타나지도 않음
3. 새로고침했을 때 or url란을 클릭했을 때 or 화면을 길게 클릭했을 때에는 다시 잘 나타남

아 어쩌란 말이냐 트위스트 추면서

최초 window.open 시 약 3초 후 화면이 하얗게 질려버리는 현상에 약 24시간 정도 괴로와 한 듯

---

🔍 문제 요약

• 현상: window.open()으로 새 탭/창을 연 뒤 약 2~3초 후 화면이 하얗게(white screen) 변함
• 기기 환경: Android OS 기반 태블릿
• 브라우저: Chrome 앱
• 발생 시점: 2025년 5월 6일 업데이트 이후
• 확인일: 2025년 5월 14일 기준, 해결되지 않음, 공식 답변 없음

---

⚙️  시도한 조치 및 무관했던 요소들

• window.open()의 target을:
  • 빈 문자열 ("")
  • _blank
  • 무작위 이름
    모두 테스트 → 동일 증상
• popup features:
  • 생략
  • 빈 문자열
  • 명시적 지정 (width, height 등)
    → 모두 동일 증상
• URL 형식:
  • 상대 경로 (/some/path)
  • 절대 경로 (https://domain.com/path)
    → 동일 증상

---

✅ 유일하게 정상 동작한 방식

window.open(...);

// 자식 창에서 
window.onload = function () {
    window.location.href = "/정상작동하는뷰.do?...";
};

• 즉, 초기 페이지에서 곧바로 window.location.href를 사용해 강제 리디렉션할 경우에는 white screen이 발생하지 않음
• 이는 브라우저가 초기 렌더링을 생략하고 새 페이지로 전환하기 때문에, 렌더링 타이밍 충돌을 피하는 것으로 보임

---

🔧 어떻게 버르장머리를 고쳤는가

var ua = navigator.userAgent;
var isAndroid = /Android/.test(ua);
var isTablet = !/Mobile/.test(ua); // 'Mobile'이 없으면 태블릿으로 간주
var isChrome = /Chrome\/[\d.]/.test(ua) && /Safari\/[\d.]/.test(ua) && !/Edge\/[\d.]/.test(ua); // 크롬 브라우저인지 판별
var isPopup = !!window.opener && window.opener !== window;
var isAndroidTabletChrome = isAndroid && isTablet && isChrome;

if (isAndroidTabletChrome && isPopup) {
	if (performance.navigation.type !== 1 && window.name !== '__reloaded__') {
		window.name = '__reloaded__';
		location.replace(location.href);
	}
}

• 현재 발견된 결함은 2025.05.06. 업데이트 이후 Android OS 기반 태블릿, 크롬 앱에서 나타나므로 이 조건들을 userAgent로 구분, 최초 1회에 한하여 페이지가 reload될 수 있도록 함.

일단 표준에 넣어야하는지는 몰궛슈