이 글은 아래 사이트 내용을 참조 합니다.

http://druckit.wordpress.com/2013/08/22/sencha-touch-2-x-and-google-chrome-29/

안녕하세요.
Chrome 29  버전에서의 Sencha Touch 2.2.x  버그 소식을 전합니다.

[환경]

  • Google Chrome 29 버전 (데스크탑 버전 및 모바일 버전 모두)
  • Sencha Touch 2.2.x

보통 Chrome 자동 업그레이드를 설정 하시기 때문에, 다들 29버전을 사용 하실 겁니다.
해당 버전에서 실제와 다르게 보이는 증상이 있는데요.

어차피 Mobile 브라우저는 정상동작하긴 하지만, 개발 도중이라서 불편하지요.
아래와 같이 조치 하시면 정상으로 보이게 됩니다.
(모바일도 기본 브라우저가 아닌 크롬에서 보시게 되면 문제가 발생 합니다.)

[조치]

  • 파일 위치 : /touch2/resources/themes/stylesheets/sencha-touch/base/mixins/_Class.scss
  • 조치 : 위 파일의 st-box 부분을 아래와 같이 변경하세요.
@mixin st-box($important: no) {
    @if $important == important {
        display: flex !important;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
    } @else {
        display: flex;
        display: -webkit-box;
        display: -ms-flexbox;
    }
}

참고로 저는

잠시 Safari를 꺼냅니다. ^^

또한, Sencha Touch 2.3 Beta2 에서는 문제가 해결되어 있습니다.

참고하세요.

8월 27일 추가로 덧붙입니다.
위 조치 방법대로 _Class.scss 파일을 compass 로 컴파일 하면 간단히 해결되지만,
Sass & Compass 컴파일 환경이 갖춰 있지 않다면 무척 불편한 작업일 것입니다.

그런 분들을 위해 컴파일 된  app.css 파일을 배포 합니다.

감사합니다.