Webcapture Script functions

Webcapture Script functions

Settings usage in webcapture script

Settings defined in the settings array on a webcapture integration, are converted to variables, that can then be used in the script functions.
Example: "username" setting is converted to "$username" which can then be used in place of static values in the script functions.

There are also some reserved settings variables, that changes how the screenshot is taken:
  1. "screenshot_element": takes a screenshot of a specific element selector, so the screenshot taken, can be in a different size than defined in setup.viewport.
  2. "screenshot_x*": defines the x coordinate in pixels for the top left corner of the screenshot, this value is relative to viewport, and not the actual size of the loaded page.
  3. "screenshot_y*": defines the y coordinate in pixels for the top left corner of the screenshot, this value is relative to viewport, and not the actual size of the loaded page.
  4. "screenshot_w*": defines the screenshot width in pixels.
  5. "screenshot_h*": defines the screenshot height in pixels. 
 * Are only used if all are specified.

Script Functions

waitForSelector

Description: Waits for a specific DOM element to appear on the page before proceeding.
Usage: { "waitForSelector": ["selector", { "timeout": <timeoutInMilliseconds> }] }
Example: { "waitForSelector": ["#button-submit", { "timeout": 10000 }] }

waitForNetworkIdle

Description: Pauses execution until the network activity reduces to a specified level, useful for ensuring page loads completely.
Usage: { "waitForNetworkIdle": [ { "concurrency": <number of concurrent request that are allowed to consider network idle>, "idleTime": <number of milliseconds the network must be idle in before continuing> } ] }
Example: { "waitForNetworkIdle": ["#button-submit", { "concurrency": 2, "idleTime": 500 } ] }

sleep

Description: Pauses the script for a given duration (milliseconds).
Usage: { "sleep": [<timeoutInMilliseconds>] }
Example: { "sleep": [5000] } (waits for 5 seconds)

click

Description: Simulates a click on a specified element.
Usage: { "click": ["selector"] }
Example: { "click": ["#submit-button"] }

type

Description: Types a given text into an input field.
Usage: { "type": ["selector", "text"] }
Example: { "type": ["#username", "testUser"] }

reload

Description: Reloads the current page.
Usage: { "reload": [] }

scrollRelative

Description: Scrolls the page by a relative amount. Maps to Puppeteer’s scroll function.
Usage: { "scrollRelative": ["x", "y"] }
Example: { "scrollRelative": [0, 500] } (scrolls 500px down)

scrollIntoView

Description: Scrolls the page until a specified element is in view.
Usage: { "scrollIntoView": ["selector"] }

hideElement

Description: Hides a specified element on the page by setting its visibility.
Usage: { "hideElement": ["selector"] }
Example: { "hideElement": [".popup"] }

urlMatch

Description: Checks if the current URL matches a given regular expression pattern.
Usage: { "urlMatch": ["pattern", "flags"] }
Example: { "urlMatch": ["/login", "gi"] }

Macro Functions

setBasicAuthorizationHeader

Description: Sets a basic authorization header for HTTP requests.
Usage: { "setBasicAuthorizationHeader": ["username", "password"] }
Example: { "setBasicAuthorizationHeader": ["user1", "password123"] }

authMicrosoftSSO

Description: Automates the login process using Microsoft Single Sign-On (SSO).
Usage: { "authMicrosoftSSO": ["username", "password"] }

    • Related Articles

    • Create WebCapture app

      This guide require a Integration template, read this guide to create integration template. Description: When all is running well you can finally create your app. 1- Send POST request to: {{base_url}}/developer/apps 2- In Body > Raw (json): { "name": ...
    • Understand integration templates types

      Integrations templates can be used to retrieve data, views, or information from external systems. WebCapture Integrations These integrations access web services by using login credentials. They allow content to be displayed through a WebCapture app ...
    • Create Integration template

      1. Create Integration Template Description: To create an app this step is the starting point, which allows you to give a name to your app, what is the type of your app and what parameters your app needs to bring proper data to q-play screens. For a ...
    • Understand app types

      This guide outlines the different types of apps available in Q-Play. An app is used to display content within a presentation in the DesignTool. The type of content an app displays depends on its intended function. Below, you will find descriptions of ...