onkeyup 이벤트 관련 함수 두번 호출되는 문제

상황

• 채팅방에서 메시지를 입력후 엔터키를 눌러도 전송버튼을 누른 효과가 발생하도록 구현 중이었다.
• 눌린 키가 엔터키라면, 전송버튼 클릭 이벤트를 발생시키도록 코드를 작성했는데..

    function clickSubmit(e){
    	if(e.code === 'Enter') {
    		document.querySelector('#submitBtn').click();
    	}
    }

• 영어, 특수문자 입력에서는 이상이 없는데
  한글만 입력하면 함수가 두번 호출되는 것처럼 보인다.
  

원인 및 해결

• 특정 환경에서 한글을 처리하는 과정 중에 발생할 수 있는 문제라고 한다.
• 아래 코드를 추가함으로써 위의 현상을 없앨 수 있었다.

    function clickSubmit(e){
    	//한글 입력시 두번 호출되는 현상을 방지하기 위해 추가
    	if (e.isComposing || e.keyCode === 229) return;
    	
    	if(e.code === 'Enter') {
    		document.querySelector('#submitBtn').click();
    	}
    }
    

---

[참고]

• https://4sii.tistory.com/473
• https://minjung-jeon.github.io/IME-keyCode-229-issue/