Similar quesitions have been asked but, they, and their answers, didn’t actually pass all the info.
Example
document.querySelector('#b').addEventListener('click', (e) => {
document.querySelector('#a').click();
});<a id="a" href="https://wikipedia.org">google raw</a>
<button id="b" type="button">click me while holding Ctrl on windows or Cmd on Mac</button>What should happen:
You Ctrl click the button on Windows or Cmd click the button on Mac and wikipedia opens in a new tab
What happens instead:
The Ctrl/Cmd is not passed on to click() and so you get the behavior without the Ctrl/Cmd
Note: A solution that only passes on Ctrl/Cmd might be okay but ideally you’d pass everything what other info might be relevant
If you’re curious about the use case I have list of files in a table
<tr><td><a href="...">filename</a></td><td>size</td><td>date</td></tr>
And I want it so if you click anywhere in the row you it’s as though you clicked the link. I can’t change the HTML because Kodi and other similar programs incorrectly parse HTML for filenames and they’re hardcoded to expect whatever HTML was the norm for nginx at the time they wrote their parser ????♂️
This seems to work, though no idea if it’s portable to old browsers or has other issues.
document.querySelector('#b').addEventListener('click', (e) => {
const newEvent = new e.constructor(e.type, e);
document.querySelector('#a').dispatchEvent(newEvent);
});<a id="a" href="https://wikipedia.org">google raw</a>
<button id="b" type="button">click me while holding Ctrl on windows or Cmd on Mac</button>One issue is the event that passed in is “trusted” but the new event will not be “trusted”. I don’t know the implications.
Note: I tried just dispatching the original event and got an error “event already dispatched”. I could maybe use new PointerEvent instead of new e.constructor but a really old browser might send MouseEvent and maybe some new browser might send ARFingerEvent or something else.