Where to save the event listeners files?

[incoming-th]

Hi,

Long shot here, but reading this documentation for few months already and I cannot figure out where to save the file (best practises) nor how to include it properly in the codeceptjs.conf.js

It may be trivial, but for Page Object, Fragments, etc it's explained properly but for events it's not. So either I missed it or it's dead simple:

https://codecept.io/internal-api/#event-listeners

My guess are:

-should be in a "events" directory from the root
-save the file as MyEvents.js for example
-add the file in the "include" attribute of the config (?)

Thanks for enlighten me.

[shank087]

Hello, you can store the file in your project directory (where you feel appropriate) and then in the config file, you can do something like below

helpers: {
    WebDriver: {
      host: 'localhost',
      port: 4444,
      url: 'someURL',
      browser: 'MicrosoftEdge',
      windowSize: 'maximize',
      restart: true, 
    },
    Hooks: {require: './hooks.js'}, // change the relative path accordingly and use wild cards in case of many events files
  },

Inside hooks.js

module.exports = function () {  
    
    event.dispatcher.on(event.test.after, function () {
        console.log('hello');
      });
};

Alternatively, another solution is, for example if you are using cucumber, in the config

gherkin: {
  features: "./tests/features/**/*.feature", // change the path accordingly
steps: "./tests/step_defs/**/*{steps,hooks).ts" //look and load files ending with steps.ts and hooks.ts
}

In the above case, you can just use the below events in any 'somemodule.hooks.ts' file and it gets automatically called.

event.dispatcher.on(event.test.after, function () {
        console.log('hello');
      });

[shank087]

edited above...

[incoming-th]

@shank087 Thanks for your detailed answer very informative.

So in short for later people or Google research, to load your events it needs to to included (for most of the cases) in the codecept.conf.js file in "helper > Hooks":

helpers: {
    ...
    Hooks: {
        require: './hooks.js' // change the relative path accordingly and use wild cards in case of many events files
        },
  },

I knew it was simple but could not figured this out, thanks again.