배포 후 같은 방에 모든 팀원이 접속을 하여 작업을 해 보던 중 발생한 문제
내가 작업을 한다 → 모두에게 적용이 됨 → 현호가 그다음 작업을 한다 → 나 빼고 다 적용됨 → 민형이가 작업을 한다 → 나와 현호에게는 적용이 안됨 → 남희가 작업을 한다 → 아무도 적용이 되지 않는다.
에러 시나리오를 한 번 더, 조금 더 단순화해서 적어 보면 아래와 같다고 할 수 있음
A랑 B 창을 열고, 같은 링크에서 작업을 함 A가 노드를 조작하고, B의 화면에 내용이 반영이 됨 그 다음에 B가 노드를 조작하면 A의 화면에 반영이 안 됨 그 이후 A나 B가 노드를 조작하면 둘 다 자기 화면에만 반영이 됨
이벤트가 들어오지만 화면상에 반영이 되지 않는다는 건, 분명 이벤트 리스너가 꺼졌기 때문에 발생하는 문제일 것이라고 생각했고 이벤트 리스너를 끄는 부분이 어디에 있는지를 생각해 보다가… handleSocketEvent 함수를 의심하게 됨
원인은 여기에 있는 것 같음
A와 B의 화면이 mount됨 → updateNode에 대한 event가 등록됨 (listen 하는 중, 그리고 해당 listener는 상시로 부착되어 있어야 함)
A가 노드를 조작함
→ handleSocketEvent 함수를 활용하여 updateNode 이벤트를 처리함
→ 여기서 작업 이전에 updateNode에 대한 리스너를 off함, 모든 리스너가 사라지다 보니 mount될 때 등록해 뒀던 리스너 사라짐
→ 그 이후에 사실 socket이 바뀌지는 않으니까 사라진 핸들러가 재등록되지는 않음
→ 그러므로 다른 사람의 작업에 대한 updateNode 이벤트가 들어오기는 해도, 화면상 변화가 나타나지 않음
→ 이게 문제였다…