버튼이 아닌 태그에 이벤트를 주었을 때

[oauch]

🚨 에러

해당 오류는 동작으로는 문제가 없는데 SonarCloud에서 이슈가 발생해서 작성합니다.

1. Avoid non-native interactive elements. If using native HTML is not possible, add an appropriate role and support for tabbing, mouse, keyboard, and touch inputs to an interactive content element.

2. Non-interactive elements should not be assigned mouse or keyboard event listeners.

해당 문제들은 전부 button이 아닌 태그에 onClick, onMouseDown과 같은 이벤트를 줄 때 발생한다고 한다.

[oauch]

해결방법

• role 속성을 추가하면 해결 할 수 있다.

role이란?

• 장애를 가진 사용자들을 위한 웹 콘텐츠 접근성을 개선하는 강력한 도구이다.
• 웹 사이트의 구조와 의미를 명확하게 표현할 수 있기 때문에
• 검색 엔진이 웹 사이트를 더 잘 이해할 수 있게 하여 웹 사이트의 접근성, 검색 엔진 최적화, 구조 및 의미를 개선하는 데 도움이 된다.

코드

role="presentation"

[miniposi]

오호... 전 원래 막혀있는 줄 알았는데 방법이 있었군요!