How to develop your custom helper?

Cookbook
1

As a CodeceptJS user, you might reach a point where you need to develop a custom helper to solve a specific problem. Don’t worry, it’s not as difficult as it may seem. Let me guide you through the process!

There are two ways you can create your custom helper:

  1. Using the “helpertize” package: This method provides a scaffold for your custom helper. To get started, you can visit the helpertize GitHub repository and follow the instructions in the readme. It’s a great option if you prefer a step-by-step guide.
  2. If you prefer a more hands-on approach, you can extend CodeceptJS with custom helpers directly. The official CodeceptJS documentation provides a guide on extending CodeceptJS with custom helpers. You can follow the steps outlined there to create your custom helper.

Note: If you’re working with a mix of JavaScript (JS) and TypeScript (TS), you may initially find it confusing to export your custom helper class. Here are some hints that will make your life easier:

For JavaScript custom helper:

class MyHelper extends Helper {
  // before/after hooks
  _before() {
    // remove if not used
  }

  _after() {
    // remove if not used
  }

  // add custom methods here
  // If you need to access other helpers
  // use: this.helpers['helperName']
}

module.exports = MyHelper;

For TypeScript custom helper:

class MyHelper extends Helper {
  // before/after hooks
  _before() {
    // remove if not used
  }

  _after() {
    // remove if not used
  }

  // add custom methods here
  // If you need to access other helpers
  // use: this.helpers['helperName']
}

export = MyHelper;

Since the mentioned patch (PR #3691) has been merged, you can also use a different syntax for exporting TypeScript custom helpers. For example:

export default class MyHelper extends Helper {
  // before/after hooks
  _before() {
    // remove if not used
  }

  _after() {
    // remove if not used
  }

  // add custom methods here
  // If you need to access other helpers
  // use: this.helpers['helperName']
}

class MyHelper extends Helper {
  // before/after hooks
  _before() {
    // remove if not used
  }

  _after() {
    // remove if not used
  }

  // add custom methods here
  // If you need to access other helpers
  // use: this.helpers['helperName']
}

export default MyHelper;

Remember to choose the appropriate export syntax based on your TypeScript configuration.

I hope this helps! If you have any further questions or need clarification, feel free to ask.