Mimic click on an element

We added Click action to the Actions replacing the need to use this custom code.

To automatically click on an element on behalf of the user:

  1. In the Authoring tool, scroll down to the Actions panel and expand the tab. Now, you see the Actions panel.

  1. Click + Click

  1. Assign element. Click the assign element button and hover over your application to select the desired element. The Authoring Tool will select the most specific combination of CSS selectors, and the default option is usually the best. However, to manually set the selector, click Expert to edit.
  2. Save changes.


    If you still want to use this callback instead, follow the instructions below.

Implementing the callback

Developers can prepare a function that will be within the application source code. Here we have defined imClickMimic function, which can be called as my_callbacks.imClickMimic from within the Authoring tool.

window.my_callbacks = {
    imClickMimic: function(player_id, topic_id, step_id, custom_data) {
      console.log("Step #" + step_id + " from topic " + topic_id + " was activated.");
      document.querySelector(custom_data.element).click();
    }
}

Using the function in the Authoring tool

In the Authoring tool, you can re-use the callback wherever necessary and pass the parameter element.

In the Authoring tool:

  1. Within the Callbacks panel, add a callback my_callbacks.imClickMimic in On before activate section.

  2. Click + under Custom data tab.

  3. Provide name element and value the selector of the element.

  1. This will result in On activate callback being called when the step has been activated and it will pass the custom data to the function itself, making it very flexible and reusable.
Was this article helpful?