Web Locators in Visual Studio Code

For a quick overview of what this feature offers, feel free to check out this short and detailed youtube video:

Web (Browser) locators

Browser locators enable you to create and store browser interface locators so that they can be shared and reused. Let's create some locators for the elements on RobotSpareBin Industries Inc..

Open the Inspector

  • Click the Robocorp icon in the Activity Bar.
  • From the Package Resources panel, expand the Web menu and select New Web Locator....

Create a new automation flow

A Robocorop Inspector tab will appear inside VS Code:

Browser locator modal

Set https://robotsparebinindustries.com/ in the "Set starting URL or start from default" field and click Start Inspecting.

Click on the Username text box. The Web Inspector window will now show a list of Generated Actions. First it will generate the code line required to navigate to the provided site. Next you will have a list of locators for the elements you selected from the browser.

Getting the locator options

You can pick from multiple selector options for each element.

Pick the username locator

You can also pick from multiple suggested actions (interactions) with the selected element

Pick the username action

We now selected our first element. Click on Stop Inspecting in the top-left corner and click Copy Script to get the generated code. You can use this snippet directly in your python file.

page.goto("https://robotsparebinindustries.com/") page.locator("#username").fill()
Last edit: March 19, 2024