반응형

nodejs version 8 미만에서는 함수 호출 파라미터에 trailing comma를 허용하지 않는다. 함수 호출 파라미터에서 trailing comma를 제거한다.

// < v8
myFunction(param1, param2) // ok
myFunction(param1, param2,) // SyntaxError: Unexpected token )

// > v8
myFunction(param1, param2) // ok
myFunction(param1, param2,) // ok

 

참고: trailing comma 사용 이유

 

다음과 같은 코드가 있다고 가정한다.

myFunction({
  param1: "param1"
});

myFunction 의 파라미터 객체에 새로운 값을 추가로 전달해야할 경우 다음과 같이 기존 코드에서도 diff가 발생한다.

myFunction({
  param1: "param1", // diff -- ','
  param2: "param2" // diff -- '  param2: "param2"'
});

이런 경우 실질적으로 작업한 내용은 새로운 값 추가임에도 불구하고 기존 코드의 수정사항이 함께 표시되기때문에 집중이 분산되고, 수정했다고 표시되는 라인의 수도 그만큼 늘어나게 된다.

파라미터 객체의 값 뒤에 comma를 추가하면 기능상에도 문제가 없고, VCS에서도 추가된 부분에 대해서만 깔끔한 diff를 얻을 수 있다.

myFunction({
  param1: "param1",
});

// 작업 후,
myFunction({
  param1: "param1",
  param2: "param2", // diff - '  param2: "param2",'
});

 

번외: 취향차이

어떤 개발자는 위와 동일한 이유로 comma를 앞에 찍기도 한다.

myFunction({
  param1: "param1"
});

// 작업 후,
myFunction({
  param1: "param1"
  , param2: "param2" // diff -- '  , param2: "param2"'
});

깔끔한 diff라는 결과는 얻을 수 있지만, 키 값의 세로 정렬이 불일치하게 되므로 나는 별로 선호하지 않는다.

 

반응형
반응형

iPhone X 시리즈의 iOS 13.4 이전 버전에서 발생하는 이슈로 추정된다.

github.com/apache/cordova-ios/issues/417#issuecomment-603896486

 

Keyboard Dismissal Leaves Viewport Shifted in iOS 12 / XCode 10 · Issue #417 · apache/cordova-ios

Seeing a blocking issue after updating to XCode 10 related to keyboard displacement and then dismissal. When an input that would require webview centering is clicked, the viewport is repositioned t...

github.com

 

키보드가 사라질 때, 뷰포트의 위치가 위로 이동하는 현상이 발생한다.

뷰포트가 단순히 이동하여 내부에 포함된 엘리먼트가 함께 이동하는 것이아니라, 표출되는 엘리먼트는 제 자리에 놓여있는데 내부적으로 설정된 뷰표트의 값만 위로 이동하는 것이 문제이다.

즉, 표출되는 엘리먼트와 엘리먼트에 등록된 이벤트가 발생하는 위치가 상이해진다.

(엘리먼트를 누르면 이벤트가 발생하지 않고, 엘리먼트 상단의 빈 공간을 누르면 이벤트가 발생하는 등...)

 

해결 방법은 의외로 간단하다.

키보드 표출을 유발하는 input 엘리먼트에 대해 blur 이벤트가 발생하면 스크롤을 초기화 시킨다.

$(document).on('blur', 'input', function(){ window.scrollTo(0,NaN) });

github.com/apache/cordova-ios/issues/417#issuecomment-598116299

반응형
반응형

iOS에서 엘리먼트가 의도치않게 위아래로 드래그가 가능한 현상이 있다. 단일 레이어일 경우 그러려니 하고 넘어갈 수 있지만, 메인 레이어를 덮는 오버레이가 있고, 이를 드래그 할 경우 그 아래 깔린 엘리먼트들이 노출되기 때문에 보기에 좋지 않다.

이를 방지하려면 아래와 같이 스타일을 설정하면 된다.

 

position: fixed 엘리먼트의 경우 현상이 발생하지 않으므로 우선 fixed로 설정을 해준다.

html,
body {
  position: fixed;
  overflow: hidden;
}

다음과 같이 최상위 래퍼를 두고,

<html>
…
<body>
  <div class="mainwrapper">
    …
  </div>
</body>
</html>

최상위 래퍼에 스크롤 옵션을 복구한다.

body > .mainwrapper {
  width: 100vw;
  height: 100vh;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch; /* enables “momentum” (smooth) scrolling */
}

 

출처: https://www.bram.us/2016/05/02/prevent-overscroll-bounce-in-ios-mobilesafari-pure-css/

반응형

+ Recent posts