응용 프로그램 경로 모달 렌더링을위한 Qunit

Question

내 응용 프로그램 경로에는 모달 열기 및 닫기를 렌더링하는 방법에 대한 ember 웹 사이트의 코드가 있습니다. https://guides.emberjs.com/v1.10.0/cookbook/user_interface_and_interaction/using_modal_dialogs/

export default Ember.Route.extend({ 
    actions: { 
     openModal: function(name, controllerName) { 
     this.render(name, { 
      into: 'application', 
      outlet: 'modal', 
      controller: controllerName 
     }); 
     }, 
     closeModal: function() { 
     this.disconnectOutlet({ 
      outlet: 'modal', 
      parentView: 'application' 
     }); 
     } 
    } 
}); 

나는 렌더링 작업에 대한 단위 테스트를 수행하는 방법의 예를 찾기 위해 노력했지만 많은 문서를 찾을 수 없습니다.

응용 프로그램 경로에 대한 내 단위 테스트에서는 경로에서 동작을 트리거하고 발생하는 상황을 확인하기 위해 내가 가진 것과 내가 얻은 오류가 있음을 알 수 있습니다. 누구나 제공 할 수있는 지침을 주셔서 감사합니다.

test('route open modal', function(assert) { 
    let route = this.subject(); 
    route.send('openModal', 'cancel-modal'); 
    assert.ok(route); 
}); 


Died on test #1  at Module.callback (http://localhost:4200/exampleApp/assets/tests.js:1113:24) 
    at Module.exports (http://localhost:4200/exampleApp/assets/vendor.js:140:32) 
    at requireModule (http://localhost:4200/exampleApp/assets/vendor.js:32:18) 
    at TestLoader.require (http://localhost:4200/exampleApp/assets/test-support.js:7124:7) 
    at TestLoader.loadModules (http://localhost:4200/exampleApp/assets/test-support.js:7116:14) 
    at Function.TestLoader.load (http://localhost:4200/exampleApp/assets/test-support.js:7146:22) 
    at http://localhost:4200/exampleApp/assets/test-support.js:7030:18: Cannot read property 'state' of undefined@ 31 ms 
Source:  
TypeError: Cannot read property 'state' of undefined 
    at parentRoute (http://localhost:4200/exampleApp/assets/vendor.js:41309:64) 
    at buildRenderOptions (http://localhost:4200/exampleApp/assets/vendor.js:41371:27) 
    at Class.render (http://localhost:4200/exampleApp/assets/vendor.js:41191:27) 
    at Class.openModal (http://localhost:4200/exampleApp/assets/exampleApp.js:1118:14) 
    at Class.send (http://localhost:4200/exampleApp/assets/vendor.js:40471:39) 
    at Class.superWrapper [as send] (http://localhost:4200/exampleApp/assets/vendor.js:54491:22) 
    at Object.<anonymous> (http://localhost:4200/exampleApp/assets/tests.js:1115:11) 
    at runTest (http://localhost:4200/exampleApp/assets/test-support.js:3471:30) 
    at Test.run (http://localhost:4200/exampleApp/assets/test-support.js:3457:6 

Answer 1

두 가지.

1. 오래된 솔루션을 사용 중입니다. 링크 된 문서 페이지는 2 년 전입니다.

   대신 모달 대화 상자에 현대적인 애드온을 사용하십시오. 개인적으로는 liquid-tether을 선호하지만 many other solutions available이 있습니다.

2. 무언가를 렌더링하는 동안 단위 테스트를 사용 중입니다. 단위 테스트는 메서드를 실행하고 반환 값을 확인하기위한 것입니다. 렌더링되는 모달 대화 상자를 테스트하려면 수락 테스트가 필요합니다.