создание своего события

1. При вызове new Event(...) - создается объект события, и ничего не "затирается".

2. Полученный объект можно передать в метод dispatchEvent. Таким образом ответом будет являться следующий код

   var elem = document.getElementById("test"); 
    
   elem.addEventListener("click", function(e) { 
     console.log(1, e); 
   }) 
    
   var myClickEventObj = new Event("click"); 
   elem.dispatchEvent(myClickEventObj);

   #test { 
     padding: 20px; 
     background: #000; 
     color: #fff; 
     text-align: center; 
   }

   <div id="test">Клац</div>

1. Если вызывать new Event(<имя существующего события>) то вернет обычный экземпляр события(Event) с типом указанным в первом аргументе(будет доступно через свойство type). Когда вызывается dispatchEvent то срабатывают все обработчик событий которые подписаны на этот тип события и которые вы давали через addEventListener и в эти обработчики событий попадет созданный вами экземпляр Event.

const event = new Event('myCustomEvent') 
const elem = document.getElementById('test') 
 
elem.addEventListener('myCustomEvent', () => { 
  console.log('Я всеравно вызвался') 
}) 
 
const event2 = new Event('myCustomEvent') 
 
elem.dispatchEvent(event2)

<div id="test">Клац</div>

2. Если нужно получить событие клика и иметь возможность указать для него стандартные свойство, то для клика можно использовать MouseEvent , вот список всех видов событий.

var e = new MouseEvent("click", { 
  bubbles: true, 
  cancelable: true, 
  clientX: 100, 
  clientY: 100 
}); 
 
console.log( e.clientX ); // 100

Свои события можно создать как тут написано через new CustomEvent(...).