element as first class citizen

[lutzj82]

I'd like to see the element become more of a first class citizen. What I mean by this, is that instead of:

driver.setValue('#someinputEl', 'value');

I'd like to more of the following:

driver.element('#someinputEl').setValue('value');

It actually works for any command that takes a single argument (selector), such as getText or getValue
I just think it reads easier, and allows me to create functions representing each element.

Thanks

[christian-bromann]

@lutzj82 this is almost the case. Thinks like

<div class="row">
  <div class="entry">
    <label>Product A</label>
    <button>Add to cart</button>
    <button>More Information</button>
  </div>
  <div class="entry">
    <label>Product B</label>
    <button>Add to cart</button>
    <button>More Information</button>
  </div>
  <div class="entry">
    <label>Product C</label>
    <button>Add to cart</button>
    <button>More Information</button>
  </div>
</div>

var row = yield client.element('.row .entry:nth-Child(1)');
yield row.click('button*=Add');

already work. I guess it should be possible to avoid the element argument if your last command call was the element command. It is just kinda hard to explain that to users like, you can do

client.click('#myelement');

but

var myelement = client.element('#myelement');
myelement.click();

works as well

[lutzj82]

I get it...I guess since there was support for element chaining, it seems like a logical extension. I agree that I don't want it to be confusing though.

[christian-bromann]

Moving into icebox. I get your point here but I don't 100% agree with you. One of the characteristics of E2E tests are that they get executed from the viewpoint of the user. Therefor:

The User -> clicks -> on elementA

which is exactly the reason why we have designed the API how it is:

browser. click ('#elementA')

However your argument makes sense when receiving attributes from certain elements (e.g. getCSSProperty, getLocation or isVisible). This could confuse other people though 😄 .. I will leave it as it is for now and keep it open so other people can comment on this.

[christian-bromann]

WebdriverIO (v4) now internally remembers the last result of a command. If you chain an element command with an action command it finds the element from the previous command and uses the result to execute the action. With that you can remove the selector (first parameter) and the command looks as simple as:

var elem = browser.element('#username');
elem.setValue('Max Mustermann');

which is basically the same thing as:

browser.element('#username').setValue('Max Mustermann');

or

browser.setValue('#username', 'Max Mustermann');