각도 테스트 방법JS 디렉티브
저는 AngularJs를 사용하는 Rails 3.2 앱을 만들고 있습니다.Angular에게 내가 필요한 것을 하게 할 수는 있지만, 나는 내가 하고 있는 것을 어떻게 테스트해야 할지 고민하고 있다.팬텀을 사용하여 재스민 스펙을 실행하고 있습니다.JS.
(관련) html은 다음과 같습니다.
<html id="ng-app" ng-app="app">
<div id="directive-element" class="directive-element">
</div>
</html>
javascript(cofeescript)는 다음과 같습니다.
window.Project =
App: angular.module('app', [])
Directive: {}
Project.Directive.DirectiveElement =
->
restrict: 'C'
link: (scope, element, attrs) ->
element.html 'hello world'
Project.App.directive 'directiveElement', Project.Directive.DirectiveElement
위의 코드는 의도한 대로 동작합니다.테스트가 문제예요.나는 그들을 전혀 일하게 할 수 없다.이것은 내가 시도했던 것 중 하나이다.이 글을 올리는 것은 주로 어딘가에서 대화를 시작하기 위해서입니다.
describe 'App.Directive.DirectiveElement', ->
it 'updates directive-element', ->
inject ($compile, $rootScope) ->
element = $compile('<div id="app" ng-app="app"><div id="directive'element" class="directive-element"></div></div>')
expect(element.text()).toEqual('hello world')
한편, 저는 AngularJs에 익숙하지 않기 때문에, 네임스페이스나 모듈 등에 관한 베스트 프랙티스가 있으면 가르쳐 주세요.
이걸 작동시키려면 어떻게 해야 하나요?
다음은 angular-ui/bootstrap에서 Alert 디렉티브를 테스트하는 방법입니다.
다음은 몇 가지 힌트입니다.
테스트 진행자에게 테스트할 모듈을 반드시 알려주십시오.
beforeEach(module('myModule')).지시문에 외부 templateUrls가 있는 경우 테스트 주자를 위해 미리 캐시해야 합니다.테스트 주자는 비동기적으로 실행할 수 없습니다.
GET템플릿입니다.부트스트랩에서는 빌드 스텝으로 템플릿을 javascript에 삽입하여 각 템플릿을 모듈로 만듭니다.사용하고 있습니다grunt-html2jsgrunt 태스크.테스트에서는
inject의 조력자beforeEach$compile, $rootScope 및 기타 필요한 서비스를 입력합니다.사용하다var myScope = $rootScope.$new()각 테스트의 새로운 스코프를 작성합니다.할수있습니다var myElement = $compile('<my-directive></my-directive>')(myScope);명령어 인스턴스를 만들고 해당 요소에 액세스할 수 있습니다.디렉티브가 독자적인 범위를 작성하고, 그 범위와 대조해 테스트하는 경우는, 다음의 조작에 의해서 그 디렉티브의 범위에 액세스 할 수 있습니다.
var directiveScope = myElement.children().scope()- 요소의 아이(지시문 자체)를 취득하여 그 범위를 취득합니다.테스트 타임아웃의 경우
$timeout.flush()보류 중인 모든 타임아웃을 종료합니다.테스트 약속의 경우 약속 해결 시 해당 약속이 호출되지 않음을 기억하십시오.
then다음 다이제스트까지 콜백합니다.따라서 테스트에서는 이 작업을 많이 수행해야 합니다.deferred.resolve(); scope.$apply();.
부트스트랩 리포에서 복잡도가 다양한 지시어에 대한 테스트를 찾을 수 있습니다.그냥 들여다봐src/{directiveName}/test/.
Angular Test Patterns가 도움이 될 수 있습니다. cofeescript와 javascript 모두에 예가 있습니다.
다음은 예제 지시문이 예상 출력을 렌더링하고 있는지 확인하기 위한 테스트 패턴입니다.
언급URL : https://stackoverflow.com/questions/12755421/how-to-test-angularjs-directives
'programing' 카테고리의 다른 글
| $ref 사용에 관한 JSON 스키마 (0) | 2023.03.29 |
|---|---|
| 녹아웃 기능이 있는 TypeScriptJS (0) | 2023.03.29 |
| 헤더 값: application/vnd.api+json (0) | 2023.03.29 |
| 악성코드가 CORS를 악용하기 위해 "Origin" 헤더를 스푸핑하는 것을 방지하려면 어떻게 해야 합니까? (0) | 2023.03.29 |
| gson이 사용자 지정 역직렬화에서 표준 역직렬화를 호출함 (0) | 2023.03.29 |