Best way to trigger an event in a webpage?

Get help with using AutoHotkey (v1.1 and older) and its commands and hotkeys
tempman7
Posts: 2
Joined: 06 Feb 2023, 21:05

Best way to trigger an event in a webpage?

Post by tempman7 » 07 Feb 2023, 00:14

I have a webpage. I want it to perform an action whenever the user hits the {+} key. So I added a keydown event listener to perform said action in Javascript. However, I also want the event to work outside of the browser. To achieve this, I created an AHK script that registers a shortcut for {+} and then control sends {+} to the browser window so that I could trigger the Javascript shortcut from anywhere.

Unfortunately, there is still one situation where this doesn't work. My webpage contains an iframe object and Javascripts keyboard event listeners do not work while the user is focused inside the iframe. I would have to register the keydown event listener on the iframe content window, but CORS errors prevent me from doing that.

So I would like some help getting AHK to trigger my function in Javascript.

Here is an example of my page:

Code: Select all

<!DOCTYPE html>
<html>
  <head>
  <title>AHK Site</title>
    <script>
      window.addEventListener("message", (event) => {
		if (event.data === 0xAF) {
		  document.getElementById("message").innerHTML = "Message: Recieved";
		}
	  }, false);
	  
	  window.addEventListener('keydown', (event) => {
		  document.getElementById("key").innerHTML = `Key pressed: {${event.key}}`;
	  }, false);
	</script>
  </head>
  <body>
    <div id="message">Message: Not recieved yet</div>
    <div id="key">Key pressed: {}</div>
	<br />
	<iframe width="560" height="315" src="https://www.youtube.com/embed/xMs4e9esYkg" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
  </body>
</html>
My first solution was to have AHK try and send key commands to the window to pop the users focus out of the iframe. On Firefox I managed to get this to work by sending Ctrl+K then F6 to the window which would pop the focus up to the browser UI then back into the page and then since the focus is now out of the iframe I could send {+} to the window to trigger the Javascript shortcut. However on chrome I couldnt find a key combination that would do the same thing (The iframe would always regain focus).

My second solution was to use Javascripts message event handler, and trying to use AHK's Send Message command to trigger it. Although I dont really have experience with this and couldnt get it to work either.

This was the AHK code I used

Code: Select all

		SendMessage, 0x111, 0xAF, 0, ahk_parent, My Page Title ahk_class Chrome_WidgetWin_1
It was something ChatGPT came up with so no big surprise it didnt work (the title and class are correct and what I use for the Control Send command).

Ive also seen Chrome.ahk and while that looks like it could work, it seems like overkill for what I need, would require me to start the browser in some debug mode from what I could gather, and I would prefer to have something that works in both Firefox and Chrome and also while installed as a desktop app using Chrome's Progressive Web App feature.

Also, I am trying to avoid writing anything that would require me to set up a server.

If anyone has any suggestions?

User avatar
Xeo786
Posts: 759
Joined: 09 Nov 2015, 02:43
Location: Karachi, Pakistan

Re: Best way to trigger an event in a webpage?

Post by Xeo786 » 07 Feb 2023, 05:26

What you need is a JS KeyBoard Event
Just create JS event and Dispatch them see
"When there is no gravity, there is absolute vacuum and light travel with no time" -Game changer theory

tempman7
Posts: 2
Joined: 06 Feb 2023, 21:05

Re: Best way to trigger an event in a webpage?

Post by tempman7 » 07 Feb 2023, 10:32

Xeo786 wrote:
07 Feb 2023, 05:26
What you need is a JS KeyBoard Event
Just create JS event and Dispatch them see
How do I do that with AHK?

User avatar
Xeo786
Posts: 759
Joined: 09 Nov 2015, 02:43
Location: Karachi, Pakistan

Re: Best way to trigger an event in a webpage?

Post by Xeo786 » 18 Feb 2023, 01:00

tempman7 wrote:
07 Feb 2023, 10:32
Xeo786 wrote:
07 Feb 2023, 05:26
What you need is a JS KeyBoard Event
Just create JS event and Dispatch them see
How do I do that with AHK?
See Chrome.ahk U have to learn how to use Page.Call() which are actually dev tool protocl API call

or you can use Rufaydium it actually uses Webdriver to contorl browser, no need to learn Webdriver/ Devtools API just are needed to know about Basics of HTML and JS and follow Rufaydium doc for example, it would be better if you know what are webdrivers too.
"When there is no gravity, there is absolute vacuum and light travel with no time" -Game changer theory

malcev
Posts: 1769
Joined: 12 Aug 2014, 12:37

Re: Best way to trigger an event in a webpage?

Post by malcev » 18 Feb 2023, 01:21

About iframe listener:
https://stackoverflow.com/questions/58884742/receiving-data-from-cross-origin-iframe
To communicate with ahk may be better with native messaging
viewtopic.php?t=32299

Post Reply

Return to “Ask for Help (v1)”