To add custom JavaScript to an element you must create a JavaScript file under the <ELEMENT NAME>/js directory.

Custom JavaScript for an element assumes that the file specified by the JavaScript property will perform some custom logic and return an object with extensions to the widgetViewModel. The JavaScript file expected should implement the following format using RequireJS. See http://requirejs.org/docs/api.HTML#defdep.

Note: The module must be defined anonymously and must supply the element name, as shown below.

define(
  ['jquery', 'knockout', pubsub'],

  function($, ko, pubsub) {
          "use strict";
      
     return {
      elementName: 'header-dropdown-minicart',
      };
    }
);

OnLoad()

If you must run custom logic when the element is instantiated then add an ‘onLoad’ function to the element JavaScript’s return object:

onLoad: function(widget) {
  //onLoad code here.
}

onLoad will run once the element has finished loading and is populated with the necessary data. This is the main access point to configure data for the element after its properties have been loaded and the system is ready to display the element. As the onLoad function is only called the first time the element is instantiated, when returning to the same “page”, the element does not need to be re-instantiated, so onLoad is not called again..