Jasmine を使用して、HTML データ値が AngularJS によって正しく信頼されていることを確認したいと思います。
コード
以下のコードはarticle
、外部 API を介して を取得し、Angular を使用して$sce
に保持されている html コンテンツを信頼しarticle.Body
ます。
getArticle: ->
defer = @$q.defer()
@getContent(url).then (result) =>
article = result.data
article.Body = @$sce.trustAsHtml article.Body
defer.resolve article
defer.promise
このコードは機能し、ステップ実行すると、データが返され、html プロパティarticle.Body
が正しく信頼されていることがわかります。ここで、これを確認する単体テストを書きたいと思います。
単体テスト
ジャスミン単体テストでの私の試みは次のとおりです。
describe 'when getArticle is called with valid articleId', ->
it "should call getContent and return article with trusted html", ->
getContentDefer = @$q.defer()
spyOn(@contentService, 'getContent').andReturn getContentDefer.promise
article = {Id:'1', Body: '<div>test</div>'}
@contentService.getArticle(article.Id).then (response) =>
expect(response.Body instanceof TrustedValueHolderType).toBeTruthy()
getContentDefer.resolve {data:article}
@$rootScope.$digest()
response.Body
返された が AngularJS タイプのインスタンスであることを確認しようとしていることがわかりますTrustedValueHolderType
。これが良いアイデアかどうかはわかりませんが、とにかくうまくいかず、次のエラーが表示されます。
ReferenceError: TrustedValueHolderType is not defined
article.Body
が信頼できる html であるか、単なる html 文字列であるかを判断するために使用できる、きちんとした方法 (おそらくブール値フラグ) があることを望んでいました。
アップデート
以下の受け入れられた回答(@avowkindに感謝)から、必要なヒントが得られました。トリックは、元の html 値を取得して返す$sce.getTrustedHtml()
メソッドを使用することです。TrustedValueHolderType
完全。
単体テストに合格
ddescribe 'getArticle', ->
it "should return an article with trusted html", ->
getContentDefer = @$q.defer()
spyOn(@contentService, 'getContent').andReturn getContentDefer.promise
body = '<div>test</div>'
article = {Id:'1', Body: body}
@contentService.getArticle(article.Id, @token).then (response) =>
expect(@$sce.getTrustedHtml(response.Body)).toEqual(body)