CODEWITHSUNDEEP
javascriptangularjsseleniumselenium-webdriverprotractor
taguenizy
taguenizy

Reputation: 2265

Protractor change size of element

I can give the size of the element with the getSize method but I can't figure how to change the height (for instance) of that element.

Just to provide some more context I want to test if the end user can resize a textarea element. Should I just set the height or is their a way to simulate user interaction with the element.

Thanks in advance

Solution
My implementation looks like this: 

myElement.getSize().then(function(result){ 
    browser.driver.actions()
      .mouseMove(inputElement, {x: result.width-1, y: result.height-1})
      .mouseDown()
      .mouseMove(inputElement, {y: newHeight })
      .mouseUp()
      .perform()
});

This allows me simulate user interaction resizing the textarea element.

Upvotes: 2

Views: 1361

Answers (1)

AdityaReddy
AdityaReddy

Reputation: 3645

You can use browser.executeScript() to modify height of an element in Protractor.Something like below should work for you 

 browser.executeScript('$("div").height(500)').then(function(){
        $("div").getSize().then(function(eleSize){
            console.log('element size: '+eleSize);
            expect(eleSize.height).toEqual(500);
        });
    })

You can professionalize this passing the element as an argument to browser.executeScript()

And if you really want to simulate end-user action of clicking & dragging the text box boundaries, yes its possible.The Key is to create a action sequence and browser.action()can be leveraged

In case you are interested , I have tried something similar - drawing a signature using protractor

Upvotes: 2

Related Questions