Unable to get the text inside the monaco editor using protractor

问题

I am writing BDD tests for Monaco-editor using the protractor-cucumber framework. A while ago, I found about Monaco API's and how to set the value inside the editor programmatically. But this time, I am unable to get the text inside monaco editor using protractor. Here's a sample of my code:

browser.ignoreSynchronization = true;
        let driver = browser.driver;
        // iframe ids

       let iframeID = 'editorFrame';

       let editorSpanXpath = '//div[@id="editorContainer"]//div[contains(@class, "monaco- editor")]//div[contains(@class, "editor-scrollable")]'
      // switching to the iFrame to perform tasks inside it
        browser.switchTo().frame(iframeID);

    // clicking on a div inside the editor to ascertain that
    // the browser knows where to  run the script

        driver.findElement(by.xpath(editorSpanXPath)).click();
         browser.executeScript('this.monaco.editor.getModels()[0].getValue()').then(function(editorText){
               let replaceString = 'abracadbra' + editorText
               browser.executeScript('this.monaco.editor.getModels()[0].setValue("' + replaceString + '")');
        }
        );

The problem here is that the value of 'editorText' keeps coming up null. On running my BDD tests, the value inside the editor is replaced by 'abracadabranull'

The editor is initialized with some default text. And since the 'setValue' function is working, I figure that the browser driver has no trouble in getting the iFrame where the editor gets loaded.

Any help would be appreciated.

回答1:

In the end, it was a simple return statement that saved the day:

browser.ignoreSynchronization = true;
    let driver = browser.driver;
    // iframe ids

   let iframeID = 'editorFrame';

   let editorSpanXpath = '//div[@id="editorContainer"]//div[contains(@class, "monaco- editor")]//div[contains(@class, "editor-scrollable")]'
  // switching to the iFrame to perform tasks inside it
    browser.switchTo().frame(iframeID);

// clicking on a div inside the editor to ascertain that
// the browser knows where to  run the script

    driver.findElement(by.xpath(editorSpanXPath)).click();
     browser.executeScript('return this.monaco.editor.getModels()[0].getValue()').then(function(editorText){
           let replaceString = 'abracadbra' + editorText
           browser.executeScript(' return this.monaco.editor.getModels()[0].setValue("' + replaceString + '")');
    }
    );

Many thanks to this answer for pointing me in the right direction.

来源：https://stackoverflow.com/questions/41040985/unable-to-get-the-text-inside-the-monaco-editor-using-protractor

标签

protractor

monaco-editor