구성 요소 테스트 {link-to}} 도우미가있는 Ember-CLIER

Question

나는 3 가지의 매우 간단한 테스트가 있다고 생각합니다.

1) 구성 요소를 확인 속성은 (엠버-CLI가 자동으로

2) 'user.index'경로로 이동하는 클래스를 클릭은 (그것이 {{링크에}})

의)이 생성 렌더링

3) 'brands.index'경로로 이동하는 클래스를 클릭은 (는 그러나, {{링크하는}} 나는 브라우저에서 클릭하면)

내가 경로에 액세스 할 확인할 수 있어요 테스트가 실패합니다. 'brands.index'테스트는 'brands-link'가 클릭되었음을 지정 함에도 불구하고 'users.index'를 계속 기대합니다.

도움이 될 것입니다.

import { 
    moduleForComponent, 
    test 
    } from 'ember-qunit'; 

moduleForComponent('navigation-bar', 'NavigationBarComponent', { 
    // specify the other units that are required for this test 
    // needs: ['component:foo', 'helper:bar'] 
}); 

test('it renders', function() { 
    expect(2); 

    // creates the component instance 
    var component = this.subject(); 
    equal(component._state, 'preRender'); 

    // appends the component to the page 
    this.append(); 
    equal(component._state, 'inDOM'); 
}); 

test('it can navigate to users', function() { 
    expect(3); 

    var component = this.subject(); 
    equal(component._state, 'preRender'); 

    this.append(); 
    equal(component._state, 'inDOM'); 

    click('.users-link'); 

    andThen(function() { 
    equal(currentRouteName(), 'users.index'); 
    }); 
}); 

test('it can navigate to brands', function() { 
    expect(3); 

    var component = this.subject(); 
    equal(component._state, 'preRender'); 

    this.append(); 
    equal(component._state, 'inDOM'); 

    click('.brands-link'); 

    andThen(function() { 
    equal(currentRouteName(), 'brands.index'); 
    }); 
}); 

그리고 구성 요소 템플릿은 다음과 같습니다 : 다음과 같이

테스트

은

<nav class="navbar navbar-default" role="navigation"> 
    <div class="container-fluid"> 
     <div class="navbar-header"> 
      <a class="navbar-brand" href="#"> 
       <!--<img alt="Brand" src="...">--> 
      </a> 
     </div> 
     <ul class="nav navbar-nav"> 
      {{#link-to 'users' tagName='li' classNames='users-link'}}<a href="#">Users</a>{{/link-to}} 
      {{#link-to 'brands' tagName='li' classNames='brands-link'}}<a href="#">Brands</a>{{/link-to}} 
     </ul> 
    </div> 
</nav> 

Answer 1

난 당신이 moduleForComponent 도우미를 사용할 때 당신은 당신의 엠버 앱가 부팅이 없기 때문에이 믿는다 . link-to 도우미는 라우터가 필요합니다. 라우터가 필요합니다. 앱이 실제로 부팅되지 않은 경우 (즉, module 도우미를 사용하고 을 beforeEach 블록에 호출하는 경우).

여기서는 최상의 해결책이 확실하지 않습니다 ...이 구성 요소를 사용하는 경로에 대해 일반적인 통합 테스트를 수행 할 수 있지만 다소 번거롭기는합니다.

Answer 2

문제는 단위 테스트를 수행하는 파일에서 통합 테스트를 수행하려는 것입니다. 이 읽기 : http://emberjs.com/guides/testing/

을이 같은 것을 할 필요가 통합 테스트의 경우 :

import Ember from 'ember'; 
import startApp from '../helpers/start-app'; 

var App, server; 

module('My First Integration Test', { 
    setup: function() { 
    App = startApp(); 
    }, 
    teardown: function() { 
    Ember.run(App, 'destroy'); 
    server.shutdown(); 
    } 
}); 

test('test something', function() { 
}); 

을 코드 조정이 필요합니다 당신의 라이브러리의 버전에 따라 다릅니다.