I am automating tests for a website and there's some event I cant trigger correctly using javascript in -especially but not limited to- IE. (i am using selenium but every other option didn't work so javascript is my last hope)

the event's function seems to use a lot of fields in the jquery Event object, I've tried following the official jquery documentation but while it shows most fields name it doesn't show how to fill them (because this is not what you do with it usually, but in my case it is)

my question is the following:

in order to fake a mouse event what and how do I fill fields (how as to how do I make these values) of the Event object using jQuery.Event("event type",{param1:value1,param2:value2,...}) (or another method if there is more efficient to do this)

this event object is to be used with element.trigger('eventname',EventObject)

I am automating tests for a website and there's some event I cant trigger correctly using javascript in -especially but not limited to- IE. (i am using selenium but every other option didn't work so javascript is my last hope)

the event's function seems to use a lot of fields in the jquery Event object, I've tried following the official jquery documentation but while it shows most fields name it doesn't show how to fill them (because this is not what you do with it usually, but in my case it is)

my question is the following:

in order to fake a mouse event what and how do I fill fields (how as to how do I make these values) of the Event object using jQuery.Event("event type",{param1:value1,param2:value2,...}) (or another method if there is more efficient to do this)

this event object is to be used with element.trigger('eventname',EventObject)

• javascript
• jquery
• jquery-events

• 1 what you fill the values with would depend on what the event is, and what values would be in there if the event was triggered naturally. There's no standard set of values. – ADyson Commented Feb 26, 2020 at 8:42
• @ADyson my bad, i am trying to fake a mouse event, sorry for the confusion – R.L Commented Feb 26, 2020 at 13:25
• Just beware with mouse events, even if you create the perfect jQuery event, the mouse event will not fire: 1) on input elements (due to browser security restrictions) 2) if the click handler checks to see if the event is trusted (es from a real mouse) – Tom Commented Mar 4, 2020 at 12:39

3 Answers 3

Did You read this jQuery documentation Triggering Event Handlers ?

Excerpt:

How can I mimic a native browser event, if not .trigger()?

In order to trigger a native browser event, you have to use document.createEventObject for < IE9 and document.createEvent for all other browsers. Using these two APIs, you can programmatically create an event that behaves exactly as if someone has actually clicked on a file input box. The default action will happen, and the browse file dialog will display.

The jQuery UI Team created jquery.simulate.js in order to simplify triggering a native browser event for use in their automated testing. Its usage is modeled after jQuery's trigger.

Basically, the whole stuff can be summarized as follows:

function Settings() {
  this.bubbles = true;
  this.cancelable = true;
  this.view = window;
  this.screenX = 0;
  this.screenY = 0;
  this.clientX = 1;
  this.clientY = 1;
  this.ctrlKey = false;
  this.altKey = false;
  this.shiftKey = false;
  this.metaKey = false;
  this.button = 0; /* Which mouse button was pressed */
  this.relatedTarget = null;
  return this;
}

function simulateMouseEvent(type, target, s) {
  var e = document.createEvent("MouseEvents");
  e.initMouseEvent(type, s.bubbles, s.cancelable, s.view, 0, s.screenX, s.screenY, s.clientX, s.clientY, s.ctrlKey, s.altKey, s.shiftKey, s.metaKey, s.button, s.relatedTarget);
  target.dispatchEvent(e);
}

var settings = new Settings, target = document.getElementById('myButton');

/* Try with something like this: */
simulateMouseEvent('mousedown', target, settings);
simulateMouseEvent('mouseup', target, settings);
simulateMouseEvent('click', target, settings);

Source: https://github./jquery/jquery-simulate/blob/master/jquery.simulate.js

The full parameters list is described here: MouseEvent.initMouseEvent()

//create an Event object in JQuery

var event = jQuery.Event("damn");
event.param1 = "value1";
event.param2 = "value2";

//trigger the event

 $( ".some_element" ).trigger( event );

//recive the event

$('.some_element').on("damn", function(e){
    console.log(e.param1,e.param2);
});

You can use trigger() function to achieve this. Trigger the event like this

  $('.some_element').trigger("damn", {param1:"value1",param2:"value2"});

and you can listen from any where

$('.some_element').on("damn", function(e,obj){
console.log(obj.param1,obj.param2);
});

I hope this works!!