how to trigger shift + left mouse click in Angular

Question

There are 2 anchor elements as shown below.

<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
}

Is this possible?

lastr2d2 · Accepted Answer · 2021-02-23 14:24:36Z

3

Dispatch a MouseEvent with shiftKey set to true

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

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

answered Feb 23, 2021 at 14:24

lastr2d2

4,0143 gold badges27 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

apdp Over a year ago

thank you. In Chrome, when an anchor tag is clicked with shift+click it opens a browser in new window with address bar, tab bar etc. but is there any way to achieve this behavior by just clicking the anchor tag (without shift) and open the browser in new window with address bar, tab bar? Tried with the above approach you suggested by dispatching a MouseEvent with shiftKey set to true. But it behaved like a normal click and opened the link in the same window. Any inputs on this would be really helpful.

lastr2d2 Over a year ago

I have a simple test page here codepen.io/atwayne/pen/vYyWezJ . if you click the without shift button it will open within the window while the shift button will open in a new window. looks like exactly what you want

lastr2d2 Over a year ago

could you create an example that doesn't work?

apdp Over a year ago

thank you for the codepen example. have modified the code and it worked fine as expected

Collectives™ on Stack Overflow

how to trigger shift + left mouse click in Angular

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related