2012-05-17 3 views
0

얘들 아를 통해 (모델 instanceof를 모델), 변수의 세트로 인해 명확하게하기 어렵다 그것에 도착해야합니다. 함께 작업하고있는 프레임 워크를 빨리 설명해 드리겠습니다.Backbone.js 크롬 확장

나는 모든 것을 관리하기 위해 jQuery를, jQuery를-UI 및 백본

확장에 대한 전체 JS 스위트 커피 스크립트로 작성하고 내가 레일을 사용하고있어 자산 파이프 라인을 사용하여 크롬 확장을 짓고 있어요. 즉, 내 확장 코드를 배포 할 때 rake assets:precompile을 실행하고 결과 압축 JS를 내 확장 디렉토리에 복사한다는 것을 의미합니다.

이 접근법에 대한 좋은 점은 실제로 라이브러리를 포함하여 내 Rails 앱 내부에서 확장 js를 실행할 수 있다는 것입니다. 이것은 js를 내용 스크립트로 주입하는 내 확장 기능 background.js 파일과 기본적으로 동일합니다.

어쨌든 최근에 발생한 문제는 내 친구 사이트에서 내 확장 프로그램을 테스트 해본 결과입니다 (whiskeynotes.com).

주목해야 할 점은 백본 모델이 각 컬렉션에 추가 될 때 엉망이되고 있다는 것입니다. 그래서 뭔가

this.collection.add(new SomeModel)

처럼 내 모델의 일부 넌센스 버전을 만들었습니다.

이 코드는 결국 내가 확장을 테스트했습니다하는 대부분의 사이트에서, 결과는하지만 내 친구의 사이트에 !(model instance Model)은 참으로 평가, 정상,

_prepareModel: function(model, options) {                           
    options || (options = {}); 
    if (!(model instanceof Model)) { 
    var attrs = model; 
    options.collection = this; 
    model = new this.model(attrs, options); 
    if (!model._validate(model.attributes, options)) model = false; 
    } else if (!model.collection) { 
    model.collection = this; 
    } 
    return model; 
}, 

이제 백본의 prepareModel 코드로 실행 실제로 올바른 클래스의 인스턴스 임에도 불구하고. 결과는 모델의 속성이 모델 컬렉션 (이상한 권리?)에 대한 참조 인 모델의 엉망진창입니다. 말할 필요도없이 모든 종류의 미친 일들이 일어났습니다.

왜 이런 일이 발생하는지는 나를 넘어선 것입니다. 그러나이 라인을 (!(model instanceof Model))으로 변경하면 (!(model instanceof Backbone.Model))가 문제를 해결하는 것으로 보입니다. 아마도 Flot 라이브러리 (jQuery 그래프 라이브러리)와 'Model'을 자체 버전으로 만들었지 만 소스를 살펴보면 인스턴스가 생성되지 않는다고 생각했습니다. 나는 이것이 왜 일어날 지 궁금하다. 그리고이 작은 변화를 백본 소스에 추가하는 것이 합리적입니까?

는 업데이트 :

는 그냥 "수정"실제로 작동하지 않는 것을 깨달았다. 또한 백본을 추가 할 수 있습니다. 모델은 래핑 객체에 네임 스페이스를 두어 선언문이 다음과 같이 보이도록합니다. class SomeNamespace.SomeModel extends Backbone.Model

답변

0

숙녀와 신사 나는이 문제를 해결했으며 내 이전 가설과는 아무런 관련이 없다고 확신합니다. Chrome 확장 프로그램 개발에 관심이있는 사용자는 앞으로도 계속 문제를 해결할 수 있으므로 계속 읽으십시오.

사용자가 원래 초기화 한 웹 사이트 내에서 탐색 할 때마다 (브라우저 동작을 통해 URL 막대 옆에 작은 확장 아이콘으로 표시됨) 콘텐츠 확장 스크립트를 실행하고 싶었습니다. 이 효과를 얻으려면 크롬을 사용했습니다. chrome.webNavigation.onDOMContentLoaded.addListener(function(details) api.

내가 몰랐던 것은 웹 페이지, 트윗 버튼, g +, 페이 스북이 좋아하는 등으로로드 된 모든 단일 프레임에서 실제로이 사실이 발생했다는 것입니다. 따라서 기본적으로 내 콘텐츠 스크립트는이 프레임들 각각에로드되고 있습니다. 사물과 사건으로 모든 종류의 혼란을 야기합니다. details.frameId === 0에 대한 확인을 추가하면 문제가 해결되었습니다. 아휴! 듣기 주셔서 감사합니다!

0

Chrome 확장 매니페스트에서 콘텐츠 스크립트가 상단 프레임에서만 실행되도록 지정할 수도 있습니다. 단순히 콘텐츠 스크립트에 all_frames 속성을 지정하십시오. 즉

{ 
    "name": "My extension", 
    ... 
    "content_scripts": [ 
    { 
     "matches": ["http://www.google.com/*"], 
     "css": ["mystyles.css"], 
     "js": ["jquery.js", "myscript.js"], 
     "all_frames": false 
    } 
    ], 
... 
} 

Chrome developer documentation reference