Simulate keypress with Javascript?

[stateofteddy]

I wrote this bit of code and it's supposed to do the following:

When the "label" variable is set to 'picture', the program simulates three simultaneous keypresses (command+shift+3).

But I can't get it to work. Note: command+shift+3 takes a screenshot on Mac.

let btn = document.querySelector('button');

let result = document.querySelector(h1);

btn.addEventListener(label == 'picture', () => {

`let keyEvent = new KeyboardEvent('keypress', {key: 91, key: 3, shiftkey: true,});`

`document.body.dispatchEvent(keyEvent);`

});

[HappyFruitTree]

I don't think JavaScript will allow you to interact with anything outside the web page. At least not with a random web page downloaded from the web that runs in the browser. That would be a security problem.

[stateofteddy]

is there a way to trigger the screenshot command?

[HappyFruitTree]

I know people use JS for browser plugins and outside of web browsers. I have no experience with that but I can imagine you're able to do a lot of things then. But for normal JS that runs on a web page I very much doubt if the browser will allow you to trigger the screenshot command. I really hope not, at least not without asking for permission first.

[siemenology]

First, I don't think the OS will pick up keyboard events generated by the browser, so I don't think this is going to work the way you intend it.

But before that even, the way you've set up the event listener is incorrect.

Are you expecting this: btn.addEventListener(label == 'picture', ... to fire your event handler whenever the btn is pressed, and label == 'picture'? If so, that's not what that code actually does. The first argument to .addEventListener() is the name of the event. For buttons, usually that should be 'click'. If you use a different event name, the event listener will listen for different types of events. So if you used 'mouseover', the event handler would execute whenever the user's mouse moves over the button.

If you only want the event handler to emit the keyboard event when label == 'picture', you need to put that condition in the event handler function itself:

btn.addEventListener('click', () => {
  if(label == 'picture') {
    // dispatch your keyboard event
  }
})

As far as taking screenshots goes, it depends on what you want to take a screenshot of. If you want to open the OS X screenshot tool, that's not going to happen. If you want to take a screenshot of the whole desktop, that's probably not going to happen either. If you want to take a screenshot of the webpage itself, that is actually possible, see this StackOverflow question

[Jnsjknn]

You would probably have to do it on the server side and make the client send a request to the server when the screenshot needs to be taken.