Katacoda provides a service that listens to events defined in the scenario and allows to override the default behavior of the platform. This scenario will show you how to use custom events.

Steps
Raise Custom Events From Environments
Custom events
Katacoda provides a service that listens to events defined in the scenario and allows to override the default behavior of the platform.
<<<<<<< HEAD
Let's see an example, in this scenario, we use the layout editor-iframe-split
, and the pages updated in the editor are served by a nodejs and they displayed in the iframe.
Give the app a few minutes to start, and then, click in the reload button on the right. You should see the result of the content of index.html displayed in the iframe.
By default, after the user stops typing, the editor saves the file. The numbers of seconds that the editor waits to save the file can be defined in the scenario with the property delayToSaveFileAfterStopTypingMilliseconds
in the environment:
Let's see an example, in this scenario, we use the layout editor-iframe-split
, and the pages updated in the editor are served by a nodejs and display in the iframe.
Give the app a few minutes to start, and then, click in the reload button on the right. You should see the result of the content of index.html displayed in the iframe.
By default, after the user stop typing, the editor saves the file. The numbers of seconds that the editor waits to save the file can be defined in the scenario with the property delayToSaveFileAfterStopTypingMilliseconds
in the environment:
master
"environment": { ... "delayToSaveFileAfterStopTypingMilliseconds": 2000, }
<<<<<<< HEAD
When a file is saved a progress bar is shown, and the progress bar is hidden when the file was successfully saved.
But for our example, we need to stop to show the progress bar when the gulp task reload
finished.
To do that, we need to need to send a message to the EventService, when the event happens our environment, and indicating the action we want to perform. The list of all actions / events supported are available in this link
In this example, we know when the gulp reload
task finish, and after this event, we can call to the EventService to send the hideprogressbar
message. See gulpfile.js
, function callEventService.
When a file is saved a progress bar is shown, and the progress bar is hidden when the file was successfully saved. But for our example, we need to stop showing the progress bar when the gulp task reload
finished.
To do that, we need to need to send a message to the EventService, indicating the event we need to raise. The list of all events supported are available in this link
In this example, after the reload
task, we call to the EventService to send the reload-finished
message. See gulpfile.js
, function callEventService
master
Request to Event Service
The request to the EventService should follow this structure:
curl -X POST https://environment-events.katacoda.com -d "socket=$1&message=message"
The socket parameter can be retrieved from the file /tmp/socket
<<<<<<< HEAD
Index.json
In the file index.json we need to specify all the messages we will send from in the environment, for example:
"actions": { "hideprogressbar": {} ======= ## Mapping event in index.json In the file index.json the message received in the EventService should be mapped to which event we want to raise, for example:"events": { "hideprogressbar": "reload-finished" >>>>>>> master }