Search code examples
javascriptangularjstestingprotractorend-to-end

Insert value to div

I have HTML + Angular looks like this:

<div ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.colDef.name" class="ui-grid-cell ng-scope ui-grid-coluiGrid-15T" ng-class="{ 'ui-grid-row-header-cell': col.isRowHeader }" ui-grid-cell="">
    <div class="ui-grid-cell-contents ng-binding ng-scope ui-grid-cell-focus" tabindex="-1">33</div>
</div>

and it looks like:

enter image description here

And I need to add / change value whihch is between divs (in this example it's number 33) How ever i try to sendkey that it's not helping. I double check if my XPATH is correct but still...

var pkValue = "11";
element(by.xpath('(/html/body/div[2]/div/div/div[2]/form/fieldset[2]/div[2]/div/div/div[2]/div[2]/div/div/div/div[3]/div)')).sendKeys(pkValue);

Is there something I'm missing or if I need to do something else for this?

Solution

  • You need to set an innerHTML using executeScript():

    var elm = element(by.xpath('(/html/body/div[2]/div/div/div[2]/form/fieldset[2]/div[2]/div/div/div[2]/div[2]/div/div/div/div[3]/div)'));

browser.executeScript("arguments[0].innerHTML = '11';", elm.getWebElement());

    Also, think about changing the xpath you are using - this one (an absolute one starting from the html root element) is very fragile.