如何在e2e測試中訪問和操作結構指令

背景：我希望能夠對給定路線的Angular2屏幕的所有可能配置進行置換，並使用量角器對屏幕進行截圖：http://www.protractortest.org/#/debugging。如何在e2e測試中訪問和操作結構指令

問題：我似乎無法找到在e2e測試期間訪問指令（例如，如ng）的方法。

是否可以訪問e2e測試中的ng-if指令？
- 如果是：有沒有辦法來操縱指令？通過操縱我的意思是影響指令的評估，而不改變指令所依賴的輸入。

可能的解決途徑：這裏是我如何存取權限的路由器爲例，能夠瀏覽到特定的路線：

it('should get the router',() => { 
browser.executeScript(() => { 
    const ng = window['ng']; 
    const root = document.getElementsByTagName('app-root')[0]; 
    const router = ng.probe(root) 
    .injector.get(ng.coreTokens.Router); 
    const routes = router.config; 
    ... 
    ... 
    return []; 
}).then(ret=> console.log(ret)); 
});

思想：

也許有可能以某種方式使用ng.probe獲取ng-if指令

我會對我的問題提供任何提示。

來源

2017-06-08 Raoul

做什麼？ – yurzui

檢查這個plunker https://plnkr.co/edit/4TU2iIZmZf410fa09gtW?p=preview（看看index.html） – yurzui

我想能夠訪問頁面上的所有結構指令，所以我想ngIf將是一個很好的開始。你的潛行者看起來很有希望，我仔細看看它，並嘗試適應我的e2e測試。之後，il給你反饋。 Thx的帖子 – Raoul

如下你可以這樣做：

HTML

<button id="find">Find ngIf directives and show all</button>

腳本你想獲得頁面上的所有`ngIf`指令

var findComments = function(el) { 
    var arr = []; 
    for(var i = 0; i < el.childNodes.length; i++) { 
     var node = el.childNodes[i]; 
     if(node.nodeType === 8) { 
      arr.push(node); 
     } else { 
      arr.push.apply(arr, findComments(node)); 
     } 
    } 
    return arr; 
}; 


function findNgIfDirectives() { 
    var commentNodes = findComments(document); 
    const ng = window['ng']; 
    commentNodes.forEach(function(node) { 
    var debugNode = ng.probe(node); 
    var ngIf = (debugNode.providerTokens[0]); 
    var ngIfInstance = debugNode.injector.get(ngIf); 

    ngIfInstance.ngIf = true; 
    }); 

} 
document.getElementById('find').addEventListener('click', findNgIfDirectives)

Plunker Example

來源

2017-06-08 12:55:26 yurzui

如何在e2e測試中訪問和操作結構指令

回答

相關問題