TIL-21-02-04

람다식이 ie 지원 안 되는 문제

// 일반함수
setTimeout(() => {
	$(".visual-group .swiper-button-autoplay > button").focus();
}, 100);

//화살표함수(arrow-function)
setTimeout(() => {
	$(".news-type03 .swiper-button-autoplay > button").focus();
}, 100);

1) 문제

스크립트에 IE가 지원하지 않는 람다식(화살표 함수)가 들어가 있어 같은 function 내에 다른 팝업이 동작하지 않았다.

2) 원인

중요한 main 페이지였는데, 모바일 접근성 동작만 확인하고 그에 따라 영향있을 만한 다른 function은 확인하지 않았다.

충분한 테스트없이 동작이 된다고만 해서 반영했다.

안전하지 않게 스크립트를 상단에 선언했다.

3) 개선 방법

반영 전엔 충분히 테스트할 것. 다른 요소에 영향있을법한 기능이 추가된다면 해당 페이지의 모든 요소 기능도 테스트할 것.

추가되는 스크립트 기능은 하단에 배치해서 최소한 기존 기능들은 영향이 없도록 주의할 것.

그리고 ie! 에서 반드시 테스트!

4) 프론트(HTML, CSS, JS)의 브라우저 지원을 확인하는 사이트

• https://caniuse.com/ciu/comparison

반영 페이지 누락, 이미지 경로 잘못 설정, 이미지 오타 미확인

1) 문제

코로나19 정부지원 페이지를 누락했고 이미지 경로도 개발로 잘못 올림. 이미지 오타도 미리 확인하지 못함.

2) 원인

퍼블이 준 문구를 그대로 복붙하고, 반영 필요한 페이지들도 사전에 미리 파악해두지 않았다.

처음 하는 작업인데도 내맘대로 간단한 작업이라 판단하고 안일하게 진행했다.

3) 개선 방법

어떤 작업도 간단하고 쉬운 건 없다. 중요한 작업이라고 늘 인식하고 작업 전 분석을 철저히 할 것.