how to trigger shift + left mouse click in Angular

There are 2 anchor elements as shown below.

<a (click)="popupIconClick()">Click Here</a>
<a #newWindow (click)="openInNewWindow($event)">New Window</a>

JavaScript
​x
 
<a (click)="popupIconClick()">Click Here</a>
<a #newWindow (click)="openInNewWindow($event)">New Window</a>
​

when first element is clicked, it invokes popupIconClick() function in my .ts file. This finds the #newWindow element and should invoke the click function for this element but the click event should behave as if it was performed with shift key pressed.

popupIconClick() {
  const newWindowElement = document.querySelector(`#newWindow`);
  //should invoke shift+click for newWindowElement
}

JavaScript
 
popupIconClick() {
  const newWindowElement = document.querySelector(`#newWindow`);
  //should invoke shift+click for newWindowElement
}
​

Is this possible?

Answer

Dispatch a MouseEvent with shiftKey set to true

newWindowElement.dispatchEvent(new MouseEvent("click", { shiftKey: true}));

JavaScript
 
newWindowElement.dispatchEvent(new MouseEvent("click", { shiftKey: true}));
​

https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/shiftKey

Advertisement

Answer