Sending text to fields for which no known locators.

Question:

https://sqa.stackexchange.com/questions/42251/how-to-interact-with-ngx-monaco-editor

Answer:

If you are not sure about the locator, then you can use the action class sendKeys method to interact with the field.

Here, it interacts with the active (currently focused ) element.

So the first step is to bring the element to focus, this can be done by just clicking it:

await browser.get('https://stackblitz.com/edit/ngx-monaco-editor-example')      
await browser.sleep(10000)
await  $('[class="view-line"]').click()
await browser.sleep(4000)

Now you can see the cursor is at the below place:

Now you can interact with the element using browser.actions():

await browser.actions().sendKeys('This is test').perform();

this will send input to the currently active element:

Now let us look deeper to find out the locator:

We now know that the sendKey using action works, so we can find the locator from the active element:

The outerHTML of the active element gives the locator:

await  $('[class="view-line"]').click()
let test = await browser.driver.switchTo().activeElement()
console.log("outer");
console.log(await test.getAttribute('outerHTML'))
//await test.sendKeys("a=1;c=a+10;") if you try this you can see even this sends data

Output:

<textarea data-mprt="6" class="inputarea" wrap="off" autocorrect="off" autocapitalize="off" autocomplete="off" spellcheck="false" aria-label="Editor content;Press Alt+F1 for Accessibility Options." role="textbox" aria-multiline="true" aria-haspopup="false" aria-autocomplete="both" style="font-size: 1px; line-height: 18px; top: 0px; left: 562px; width: 1px; height: 1px;"></textarea>

So the input element is the text area, and you can send data to this element. Try

$('textarea[class="inputarea"]').sendKeys('something');

Note: you can use this approach of getting outer HTML of the active element in cases where you are not sure about the element but browser actions work.

Summary:

So you can use two approaches:

1:

await elem.click()
await browser.actions().sendKeys('This is test').perform();

2:

await elem.click()
let field= await browser.driver.switchTo().activeElement()
await field.sendKeys("HI");

you can find the locator or element as:

await field.getAttribute('outerHTML');