title: How to pass webdriverio driver into functions for modular design?
body: <p>I am using webdriverio for communicating with appium server. I am trying to automate Instagram interactions. Each automation needs me to login, and logout. So, I am thinking of writing a function that logs in and a function that logs out.</p>
  
  <p>Currently, I've something that looks like this:</p>
  
  <pre><code>const wdio = require("webdriverio");
  const opts = {...}
  const client = wdio.remote(opts)
  
  const login = (client, username, password) =&gt; {
    return client
      .click("#log_in_button")
      .click("#login_username")
      .keys(username)
      .click("#password")
      .keys(password)
      .click("#button_text");
  }
  
  const someOtherAction = (client) =&gt; {
    // More actions performed on client
    // ...
  }
  
  client.init();
  login(client, "username", "password")
    .someOtherAction(client);
  </code></pre>
  
  <p>This doesn't work ^^, however same code when written this way works:</p>
  
  <pre><code>client
    .init()
    .click("#log_in_button")
    .click("#login_username")
    .keys("username")
    .click("#password")
    .keys("password")
    .click("#button_text")
    .waitForExist("~Activity") // Some other actions...
  </code></pre>
  
  <p>I suspect this has to do with <code>this</code> not being correctly set, I have tried looking at the source of webdriverio, but I didn't quite understand it. So, how could I pass around the driver so that I can write more modular, usable and maintainable code?</p>
  
  <p>Also, I don't quite understand how this chaining of commands is working, since the api docs at <a href="http://webdriver.io" rel="nofollow noreferrer">http://webdriver.io</a> doesn't state anything about the return value of function calls like <code>click</code>, <code>keys</code>, etc. but yet, they seem to work as if they are returning the <code>client</code> itself. If someone could explain the chaining as well, that'd be great.  </p>