最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How to test window.addEventListener function - Stack Overflow

programmeradmin0浏览0评论

Here is an event listener added, if I want to test if this event listener is working or not, how do I test? window.postMessage doesn't seem to be triggering this event. Basically, how do I trigger "some_event" so that my EventListener runs?

window.addEventListener('some_event', function() {
    console.log("some_event triggered");
});

Please note, I was able to reproduce with "click" event, but what I want to know is, how do I know if any string is passed as an event. Example:

window.addEventListener('add_to_cart', function() {
    console.log("some_event triggered");
});

So I would like to simulate this event listener to check if it's working or not. How do I test this?

Here is an event listener added, if I want to test if this event listener is working or not, how do I test? window.postMessage doesn't seem to be triggering this event. Basically, how do I trigger "some_event" so that my EventListener runs?

window.addEventListener('some_event', function() {
    console.log("some_event triggered");
});

Please note, I was able to reproduce with "click" event, but what I want to know is, how do I know if any string is passed as an event. Example:

window.addEventListener('add_to_cart', function() {
    console.log("some_event triggered");
});

So I would like to simulate this event listener to check if it's working or not. How do I test this?

Share Improve this question edited Jun 2, 2022 at 15:15 xXx 1,1611 gold badge11 silver badges24 bronze badges asked Nov 8, 2018 at 16:38 yomeyome 3,1435 gold badges21 silver badges19 bronze badges 1
  • Do you mean to write a test that clicks the dom for you and then proves if the window.addEventListener(...){} got called? If yes.why do you want to check if native functionalities work? – Jonathan Stellwag Commented Nov 8, 2018 at 16:40
Add a ment  | 

2 Answers 2

Reset to default 5

You need to use some concrete event name like for example click - and click on browser page window - eg:

window.addEventListener('click', function() {
    console.log("some_event triggered");
});

Here is some info about events and situations when they are trigger.

After question update

Yes you can define and fire arbitrary events - read here. And here is some example code:

var event = new Event('some_event');

// Listen for the event.
window.addEventListener('some_event', function (e) { 
    console.log('some_event triggered') 
}, false);

// Dispatch the event.
window.dispatchEvent(event);

So you fire event using window.dispatchEvent(event) and this is the way you can test it.

You can trigger an event using dispatchEvent and fireEvent in IE.

 var ev, element = window;
  if (document.createEvent) {
    ev = document.createEvent("HTMLEvents");
    ev.initEvent("eventname", true, true);
    ev.eventName = "eventname";
    element.dispatchEvent(ev);
  } else {
    ev = document.createEventObject();
    ev.eventType = "eventname";
    ev.eventName = "eventname";
    element.fireEvent("on" + ev.eventType, event);
  }

function triggerEvent(elem, name){
   var ev;
  if (document.createEvent) {
    ev = document.createEvent("HTMLEvents");
    ev.initEvent(name, true, true);
    ev.eventName = name;
    elem.dispatchEvent(ev);
  } else {
    ev = document.createEventObject();
    ev.eventType = name;
    ev.eventName = name;
    elem.fireEvent("on" + ev.eventType, event);
  }
}
window.addEventListener("click", function(e){
  console.log("Clicked");
});
window.addEventListener("custom_event", function(e){
   console.log("custom_event triggered");
});
triggerEvent(window, "click");
triggerEvent(window, "custom_event");

发布评论

评论列表(0)

  1. 暂无评论