Chain operations after several elements have been retrieved

Question

For testing we have to fill a complex page using intern/leadfoot. Each part of the page is taken care off by a separate function which receives the necessary elements and input data.

Now we have the problem, that actions on these elements in the subfunctions can not be chained anymore, since they are elements and not commands.

Is it somehow possible to again chain the operations? I tried a lot with creating a new command using setContext() or with custom commands but did not succeed so far.

let inputs;
return this.remote
  .get('some/url')
  .findAllByTagName('input') // Finds two input elements
  .then(inputElements=> inputs = inputElements)
  .then(()=> Promise.all([
      inputs[0].clearValue(), // I would like to be able to write: inputs[0].clearValue().type('a')
      inputs[1].clearValue(),
  ]))
  .then(()=> Promise.all([
      inputs[0].type('a'),
      inputs[1].type('b'),
  ]))

Answer 1

Elements share many of the same methods as Commands, but they have different APIs. A primary difference is that Command methods representing actions return Commands (a Command is promise-like, and resolves when the action finishes), but Element methods representing actions do not return Elements (an Element is not promise-like). This means that you can't directly chain many Element methods.

For the situation described in the question, you could do something like the following:

function clearAndType(input, value) {
    return remote.then(function (_, setContext) {
            // setContext is always the last argument to a Command then()
            // callback; the value returned by the previous Command is the
            // first argument, which is ignored here
            setContext(input);
        })
        .clearValue()
        .type(value);
}

var remote = this.remote;

return this.remote
    .get('some/url')
    .findAllByTagName('input')
    .then(function (inputs) {
        return Promise.all([
            clearAndType(inputs[0], 'a'),
            clearAndType(inputs[1], 'b'),
            // ...
        ]);
    })