In today's busy world, anything that can save you time, sanity, and keystrokes, while adding accuracy, and consistency is a big win.
In this tutorial I'll show you how to employ Keyboard Maestro to automate away repetitive browser actions. I'll cover
- altering form fields like dropdown menu values
- entering pre-written text snippets
- adding conditional logic with text parsing for checking accuracy
- automatic form submission.
This will aid you in completing mind-numbing tasks in just a few keystrokes.
As a practical example, I'll manipulate forms on a website called Help Scout. You can easily apply these examples to browser forms in almost any web application to save you time.
Manipulating Form Data and Submitting Forms
This example demonstrates how typing just a few characters, as a trigger, allows you to change the value of a drop down field and then activate the form's submit button.
The first thing you need to do is start Keyboard Maestro, select the Safari Macros group, click the + to add a new macro, and give it a name. Name the example macro helpscout send + set pending.
Now add a trigger for your newly created macro. Choose Typed String Trigger here.
The next step is to set a typed string that will stick in your head and is unique. Use a trigger sequence plus a mnemonic for any of your triggers.
For this trigger enter the following value for a typed string: ,,hsp The double comma is the trigger sequence (it's highly unlikely you'll type that for anything else) and the mnemonic is Help Scout Send Pending.
You'll use Safari's built in developer tools to identify some form field names and values, and use Keyboard Maestro to set them when you activate the trigger you just set up.
The first step is to secondary-click the form field you wish to alter and select Inspect Element.
Now drill down and see the option values available.
Note in the example how the field label status is in the inspect window on the line that reads <label for="status">Status:</label>. The value you're after is highlighted <option value="2">Pending</option>.
Now you know what value to set your drop down form field to in Keyboard Maestro.
Now you need to add another Safari action like you did earlier. This time you're going to pick Set Safari Field to Text.
Next click the word Safari just below the Try button and pick the field identified earlier, document.forms["tkReplyForm"]["status"].
Then set the field to the value you found earlier, 2.
You've now completed the steps necessary to change the value of the form field to select the desired choice. Next is to activate the submit button.
Secondary-click on the desired submit button and find the Button ID that goes with it, so you can tell Keyboard Maestro to do something with it. In the example you're looking for the button text Send Reply.
Note that the ID is sendBtn.
Add another Safari Control called Focus Safari Field. Once again click the word Safari below the Try button to find the field you just identified in the previous step.
In the example it is document.forms["tkReplyForm"]["sendBtn"].
Now that the button has focus, you can activate it by emulating the pressing of the return key.
Add an action, but this time click on All Actions and in the search field type keystroke. Type a Keystroke is the action you need.
Once that is added, choose the keystroke Return from the dropdown to simulate it.
The action is now ready to use. Here is a screenshot of me emailing myself within Help Scout, to see the example in action. You should do the same type of test in your example now.
Note here how I've typed out ,,hs and am about to complete the trigger sequence by pressing p.
…and voila, the status has been changed to pending and the form submitted.
Automatic Text Entry and Verification
In the second example I'll show you how to automatically insert prewritten text snippets, verify it is a correct entry before submission, and throw a visual exception if it wasn't. This means you can manually intervene before the form is submitted. I'll continue in the context of the Help Scout web interface for consistency across examples.
The first step is to add a typed string trigger. As before, start the trigger with ,, and then add htv for the mnemonic Help Scout text verification.
Inspect the text field where the text snippet is to be inserted. You're looking for the section the reply field is in, so you can use it in the next step.
Add a Select Safari Field action. This will work the same as the previous example.
Click Safari right beneath the Try button and choose the field that represents what you found in the previous inspection step.
In this case it's forms["tkReplyForm"]["reply"] (textarea).
Then add an action under Text called Insert Text. For the example use some lorem ipsum text.
Return to the previous example in a time saving maneuver and use Command-Primary Click select the previous actions you used to set your form to a pending status and submit it automatically; followed by Command-C to copy the actions to the clipboard.
Next add in an action from the Control Flow section called If Then Else. Once that is added use Command-V to paste the actions you just copied as the actions to execute if the condition—yet to be set—is met.
Check the form field for the existence of the text snippet that was supposed to be entered automatically.
To do this set The text: to forms["tkReplyForm"]["reply"] (textarea).
You need to enter a part of the snippet to use for verification that the text inserted correctly. Since your snippet is lorem ipsum text, use the words sit amet for your check.
In the otherwise execute the following actions: section you need to add an alert.
To locate this quickly, look under All Actions and then choose Alert. Give the alert a title of Text failed to automatically paste… and a comment of Please manually retype in the rely field and then click the submit or send button.
This will define what the alert box will look like and display when an error occurs.
It's time for a test! Press reply and type the trigger ,,htv.
It worked but an error still popped up. This is actually a good verification that the alert is working.
The problem is actually what can be called a race condition. The check is executed so quickly that it happens before the text is recognized as pasted into the text field. This needs to be fixed.
Luckily Keyboard Maestro has so many awesome tricks up it's sleeve there is a mechanism for this. Just above the conditional logic add an the action Pause, and set a value of 0.5 seconds. Now the text will be entered correctly like it was before, but you'll only get the alert if there is an error and the text is not actually input.
Create and Use Quick Throw-Away Macros
Many people get hung up on the idea of building a permanent library of Keyboard Maestro macros to save time. A commonly overlooked and powerful thing you can do is make small temporary macros that you may only use for a couple hours or days.
One example that is pretty similar to the first example is a macro that quickly closes any message that is not set to a closed status. With this example a hotkey has been set to activate the macro when it is pressed.
The hotkey combo for this temporary macro is set to Control-Option-Shift-Command-C ^⌥⇧⌘C (all modifier keys and C). When the hotkey combo is press, the macro does the following:
- Activates a keyboard shortcut R which opens the Help Scout message so it can be replied to or otherwise acted on
- Changes the status field to closed
- Submits the form
Use your skills so far to created this short macro yourself and then take it for a spin. Here's the message from the previous example, only I've marked it active again. Control-Option-Shift-Command-C ^⌥⇧⌘C is pressed.
Success. The macro opened the conversation, changed the status, and closed it with one keyboard shortcut.
Conclusion
Keyboard Maestro is a very powerful tool. While this tutorial digs a little deeper than beginner macros, you've just begun to scratch the surface of what you can concoct. You now know enough to inspect form fields and buttons, manipulate them using typed triggers and assigned keyboard shortcuts. You are also armed with the knowledge of how to construct safety checks in your macros to ensure a form is in the state you desire before submitting or otherwise acting on it.
Let me know what time saving macros you end up building from studying the examples I've walked you through in this tutorial by leaving a comment below.
