Differences

This shows you the differences between two versions of the page.

--- actions:Execute_a_JavaScript_in_Browser [2021/03/25 00:10] – Blue Icon JMichaelTX
+++ actions:Execute_a_JavaScript_in_Browser [2024/01/25 03:06] (current) – peternlewis
@@ Line 1: / Line 1: @@
-{{:actions:javascript-icon-blue-border-round-small.png?nolink |}}
 ====== Execute JavaScript in Browser Actions ======
-There are several *Execute a JavaScript in Browser* actions let you execute a JavaScript in a web browser page:
+There are several *Execute a JavaScript in Browser* actions that let you execute a JavaScript in a web browser page:
-*  _Execute a JavaScript in **[[action:Custom_HTML_Prompt|Custom HTML Prompt]]**_
 *  _Execute a JavaScript in **Front Browser**_
   * The "Front Browser" is whichever of the following is currently frontmost, or was the last web browser that was frontmost:
-    * Google Chrome
+    * Google Chrome or Chrome-based Browsers like Brave Browser
-    * Safari
+    * Safari or Safari-like Browsers like Safari Technology Preview
-    * Chrome-based Browsers like Brave Browser
 *  _Execute a JavaScript in **Google Chrome**_
 *  _Execute a JavaScript in **Safari**_
-All of these Actions work the same.  The difference is in which Web Browser the JavaScript will be executed.
+**Front Browser** supports these bundle IDs:
+* com.apple.Safari
+* com.apple.SafariTechnologyPreview
+* com.google.Chrome
+* com.google.Chrome.canary
+* com.brave.Browser
+* com.brave.Browser.beta
+* com.vivaldi.Vivaldi
+* com.vivaldi.Vivaldi.snapshot
+* com.microsoft.edgemac
+All of these actions work the same.  The difference is in which Web Browser the JavaScript will be executed.
 This action allows you to execute a specified JavaScript, either from a file or text entered in the Action itself, and return the results.
-{{:actions:execute-javascript-browser-action.png?nolink|}}
+In order to control Safari or Chrome you will need to [[assistance:Allow_JavaScript_From_Apple_Events|Allow JavaScript from Apple Events]].
+You can control which browser is targeted, whether to trim white space at the start and end of the result, and whether to include any errors in the action (gear) ⚙ menu.
 ===== Options for Returning Results =====
@@ Line 29: / Line 40: @@
   * save results to variable.
   * save results to the system clipboard or a named clipboard.
-  * asynchronously  — the action runs while the macro continues on, no results are returned.
+  * asynchronously  — the script runs while the macro continues on, no results are returned.
 If the results are to be saved to a variable or a clipboard then further text areas appear in the action allowing you to specify the variable or specific clipboard.
+===== Modern Syntax =====
+In version 11.0, scripts default to Modern Syntax, which essentially wraps the script in:
+```javascript
+(function () {
+…
+})()
+```
+This helps keep your script from interacting with the web page in unexpected ways. A result of this is that you need to return values to the action using the `return` syntax. So a trivial action would be:
+```javascript
+return "Hello";
+```
+You can turn Modern Syntax on or off in the popup menu next to the script.
 ===== Using Keyboard Maestro Variables =====
-JavaScript in browsers can only **GET** Keyboard Maestro variables.  They cannot be set.  If your Keyboard Maestro Variable contains spaces, they must be replaced with underscores in the JavaScript, for example:
+JavaScript in browsers cannot interact with the outside world, but they can receive the variables from Keyboard Maestro in the script. The variable values can be read, but writing to them will not alter the corresponding Keyboard Maestro variables.
+In Modern Syntax, reference the variable like this:
 ```javascript
-// Get Keyboard Maestro variable "My KM Data"
+var v = kmvar.My_KM_Data
-var myData = document.kmvar.My_KM_Data
 ```
+In the old syntax, reference the variables like this:
+```javascript
+var v = document.kmvar.My_KM_Data
+```
+When accessing a variable, if its name has a space in it, replace it with an underscore.
+Local and Instance variables are available, but Password variables are not.
+By default, all variables are included, but you can select No Variables, or specific variables as desired using the popup menu next to the script.
+(!) Note that in the the old syntax, because your variables are passed to the web page, any other scripts running on that web page will have access them, and this could be a privacy issue if the information is misused by the web page.
 ===== Saving Results to Keyboard Maestro Variables =====
@@ Line 52: / Line 96: @@
 {{:action:km-browser-javascript-output.png?nolink|}}
-===== Execute a JavaScript in Custom HTML Prompt =====
+Another approach would be to use `JSON.stringify()` to return a JSON structure, and then use [[token:JSONValue|%JSONValue%]] token or other JSON facilities to extract the data.
-For the *Execute a JavaScript in Custom HTML Prompt* action, you can specify a [[action:Custom_HTML_Prompt]] with a matching [[action:Custom_HTML_Prompt#HTML_Window_Design|data-kmwindowid]] to apply the JavaScript to, otherwise it will be applied to all open Custom HTML Prompt windows.
-The JavaScript can access variables by using the window.KeyboardMaestro functions described in the [[action:Custom_HTML_Prompt|Custom HTML Prompt]] action.
 ===== See Also =====
@@ Line 67: / Line 107: @@
 === Actions ===
+* [[action:Execute_a_JavaScript_in_Custom_Prompt|Execute a JavaScript in Custom Prompt]] action
 * [[:Actions|See all Actions]]
-==== Forum ====
-- [[https://forum.keyboardmaestro.com/t/execute-javascript-in-custom-prompt-question/4491|Execute JavaScript in Custom Prompt Question]]