이유 없는 Script Error

React 로 개발 하던 중

ios 계열에서는 에러가 나지 않으나 android 에서만 에러가 나는 경우가 발생. 

에러 증상은 아래와 같다.

1. 처음 로딩 시에만 발생
2. 스크립트 에러가 발생
3. 정확한 위치는 알려주지 않음
4. android 에서만 발생

보통 이런 경우에는 에러 찾는 방법은 아래와 같다

1. 의심가는 스크립트를 찾아서 하나씩 지워보고 에러 나는 지 확인
2. 스크립트 지워보고 안되면 retrun() 쪽에서 하나씩 태그를 지워가면서 확인

예상외의 에러가 나는 경우가 많아서 디스플레이 되는 시간차 때문인가 싶었지만 

에러 원인은 

Key prop 누락

이였다. 

{publicBlinds.map((pb) => (
    <React.Fragment key={pb.id}> // <--- 이 부분 누락
        <PublicBlindList
            publicBlinds={publicBlinds}
            onExpire={handleExpire}
        />
    </React.Fragment>
))}

map 으로 데이터를 그리던 중 발생한 에러였는데 찾기가 어려웠다. 

그래도 잘 찾아서 다행.