사전 컴파일 핸들 템플릿</p> <p>우리의 프로젝트는 신속하게 크기가 증가하고있다

Question

밥상을 테스트하고 난 좋은 JS-시민하고 너무 늦기 전에 구현 테스팅을 얻고 싶었다. 우리는 Backbone Layoutmanager와 Handlebars 템플릿을 포함한 백본을 사용하여 프론트 엔드를 만들고 있습니다. 그리고 Jasmine을 사용하여 Jasmine-Jquery와 Sinon을 사용하여 백본 기반 응용 프로그램을 테스트하는 방법에 대한 블로그 게시물을 excellent으로 읽었습니다. 그렇게해라.

그러나 우리는 RequireJS 모듈을 사용하고, Layoutmanager를 사용하여 백본을 확장하고, Handlebars 템플릿을 프리 컴파일하기 때문에 조금 비정규 적입니다. 우리는이 라이브러리의 생성자에 의해 비동기식으로 as is suggested 템플릿을 프리 컴파일하고 있습니다. 그리고 비동기 jQuery/Ajax 호출이 작동하지 않으면 모든 유형의 비동기 jQuery/Ajax 호출이 작동하지 않는다는 것을 깨닫기 전에 긴 하루의 더 좋은 부분을 보냈습니다. 애플 리케이션 재스민을 사용하여. $.ajax(...) 호출을 async: false과 동기화하려고 시도하지 않았고 LayoutManager JS 소스를 파고 들자면 모든 것이 비동기로 발생한다는 것을 알았습니다.

그래서 어쨌든 이것은 내가 결국 사전 컴파일 작업을 결국 방법은 다음과 같습니다

Backbone.LayoutManager.configure({ 
    manage: false, 

    prefix: "app/templates/", 

    fetch: function(path) { 
     var done; 
     var that = this; 

     // Concatenate the file extension. 
     path = path + ".html"; 

     runs(function() { 
      if (!JST[path]) { 
       done = that.async() 

       return $.ajax({ url: app.root + path, async: false }).then(
        //Successhandler 
        function(contents) { 
         JST[path] = Handlebars.compile(contents); 
         JST[path].__compiled__ = true; 
         done(JST[path]); 
        }, 
        //Errorhandler 
        function(jqXHR, textStatus, errorThrown) { 
         //Feil ved lasting av template 
         //TODO logg feil på en eller annen måte 
        } 
       ); 
      } 
      // If the template hasn't been compiled yet, then compile. 
      if (!JST[path].__compiled__) { 
       JST[path] = Handlebars.compile(JST[path]); 
       JST[path].__compiled__ = true; 
      } 
     }); 

     waitsFor(function() { 
      return done; 
     }, "loading template", 500); 
     return JST[path]; 
    }, 

    // Override render to use Handlebars 
    render: function(template, context) { 
     return template(context); 
    } 

}); 

솔루션은 runs 및 waitFor을에 비동기 논리를 포장했다. 질문 지금

: 그냥 비동기 호출을 래핑하는 app.js를 복제하는 저를 강제하기 때문에 나는,이 최적의 솔루션입니다 생각하지 않습니다. 이 문제에 대한 더 나은 접근법이 있습니까?

충분히 공정하지 않다면이 게시물에서 다른 누군가가 배웠 으면합니다.

Answer 1

불행히도 app.js의 복제를 피할 수있는 해결책을 찾지 못했습니다. 그러나이 파일은 거의 변경되지 않으므로 실제로 문제가되지 않습니다. 나는 그러나 위의 처리 비동기 일부 개선을 만들었습니다, 더 강력한 만드는 :

waitsFor(function() { 
     return JST[path] && JST[path].__compiled__; 
    }, "loading template", 1000); 
    return JST[path]; 

이 선 done(JST[path]);은 다음

을 제거 할 수 있습니다.

테스트가 더 안정적으로 실행됩니다. 이전에는 템플릿이 제대로로드되지 않아 이전에 테스트가 실패하는 경우가있었습니다.

답변으로 수락하십시오.