Automating user actions on a Web Page was a frequently asked feature. Mostly for authentication. But we took it further.
Why is Scripting Required
In the context of showing a Web Page 24/7 on a screen, most people think that the only useful interaction is logging in, perhaps even clicking a button. We thought the same. Until we realized that scripting could do much more than just “Interacting” with a Web Page.
To name a few, a web scripting tool can:
- Interact with a Web Page; fill out forms, click buttons/links and all the usual stuff
- Modify a Web Page; change the page itself by running custom Javascript, manipulating the DOM and add background transparencies or extract specific DIV’s as full-screen content
- Interact with the Web Viewer; navigate from web page to web page, scroll the browser window, changing the zoom factor, creating image-based screenshots and caching them
Time for our Web Scripting Engine
It was a long awaited feature. But we managed to deliver. We are really proud to announce that our Web Scripting Engine is now available to all users! While it has the dullest name ever, it has almost all of the above features, with dynamic zoom factor and caching screenshots coming up soon.
With the Web Scripting Engine, you can do all sort of crazy things.
- Load any web page, login with your credentials, navigate to an inner page, fill out a query form, and display the data you need.
- Keep only the interesting stuff that you need from a Web Page, tossing out noise. Think news headlines, weather reports, and more.
- Create dashboards from literally ANY kind of web-based service. Just extract graphs and numbers directly from the web page it self.
How Does It Work?
Right now, we have a whole special section in our documentation for the Web Scripting Engine. It provides a detailed reference, along with examples and useful scripts. But let’s have a quick look.
A key concept for the Web Scripting Engine is the use of CSS Selectors for selecting or interacting elements in the web page. Say that you want to fill out a username and a password field and click a button for logging in the web page. You need the CSS selector of the each of the two fields in order to fill them out with the required values, while you need the CSS selector of the login button for clicking it. Sounds complicated? It is not. Getting CSS Selectors for form elements is really easy, even for non-programmers. You just need Chrome or Firefox, so try it out.
If you find the CSS Selectors, then the script is really easy. It should look like this:
type("""#user_email""", """myemail@example.com""")
type("""#user_password""", """mypassword""")
click("""#new_user > div:nth-child(7) > input""")
You type the code to the script textbox in the Web Page in your Yodeck Account and you are ready to go!
Want to dive in? Have a look to our documentation and examples. And reach out if you need help!
The Future
This first release is the minimum first version of this feature. We are planning to create useful, drop-in scripts that will allow you to integrate with some of the most used web services out there, and show dashboard from these. They will be similar to Custom Apps, so you will be able to easily create your own too, with custom UI forms, and share them with the world.