分度器でさらにWYSIWYGエディタを選択するには？

Question

私は2ページ目のWYSIWYGエディタを持っています。最初に選択してソースコードを入力してから、2番目のWYSIWYGエディタを選択してソースコードを入力しますが、最初のWYSIWYGエディタでソースコードを入力しますか？

そのために私のコードは：

// First WYGWYSI editor 
    element.all(by.css("div[role='application']")).get(0).element(by.cssContainingText("span","Tools")).click(); 
    element(by.cssContainingText('span','Source code')).click(); 
    element(by.css("div[role='application'] textarea")).sendKeys("HTML code"); 
    element(by.css("div[role='application']")).element(by.partialButtonText("Ok")).click(); 

    // Second WYGWYSI editor 
    element.all(by.css("div[role='application']")).get(1).element(by.cssContainingText("span","Tools")).click(); 
    element(by.cssContainingText('span','Source code')).click(); 
    element(by.css("div[role='application'] textarea")).sendKeys("HTML1 code"); 
    element(by.css("div[role='application']")).element(by.partialButtonText("Ok")).click(); 

これは、実際にここで何が起こっているかを示すために、上記のコードにインラインコメントを追加http://prntscr.com/feyton

Answer 1

私のWYSIWYGエディタです：

// First WYGWYSI editor 
// -- Click on the application 0 
element.all(by.css("div[role='application']")).get(0).element(by.cssContainingText("span","Tools")).click(); 

// -- Clicked on source code 
element(by.cssContainingText('span','Source code')).click(); 

// -- Sends keys to the first editor and clicks "Ok". Since 
// element(by.css("div[role='application']")) has multiple matching 
// elements, return the first one. 
element(by.css("div[role='application'] textarea")).sendKeys("HTML code"); 
element(by.css("div[role='application']")).element(by.partialButtonText("Ok")).click(); 

// Second WYGWYSI editor 
// -- Click onthe application. The second one! 
element.all(by.css("div[role='application']")).get(1).element(by.cssContainingText("span","Tools")).click(); 

// -- Oh no! We click on the first <span> with text Source code. This is 
// is (guessing) the first editor. 
element(by.cssContainingText('span','Source code')).click(); 
element(by.css("div[role='application'] textarea")).sendKeys("HTML1 code"); 
// -- Click on the first "Ok" button (we did not click the second button with Ok). 
element(by.css("div[role='application']")).element(by.partialButtonText("Ok")).click(); 

何おそらくべき起こったことは、私たちが最初に興味のあるエディタで、エディタのコンテキストで要素を選択する必要があります。

let firstEditor = element.all(by.css("div[role='application']")).get(0); 
let secondEditor = element.all(by.css("div[role='application']")).get(1); 

// First WYGWYSI editor 
firstEditor.element(by.cssContainingText("span","Tools")).click(); 
firstEditor.element(by.cssContainingText('span','Source code')).click(); 
firstEditor.element(by.css("textarea")).sendKeys("HTML code"); 
firstEditor.element(by.partialButtonText("Ok")).click(); 

// Second WYGWYSI editor 
secondEditor.element(by.cssContainingText("span","Tools")).click(); 
secondEditor.element(by.cssContainingText('span','Source code')).click(); 
secondEditor.element(by.css("textarea")).sendKeys("HTML1 code"); 
secondEditor.element(by.partialButtonText("Ok")).click();