Need help for a tricky day control

Hello, I’m an old and skilled iMacros user and a new Uivision Entreprise Edition customer.

I’m very new to Uivision, I’ve got the extremely basic skills, and I’m trying to learn some “advanced” feature.

I’m learning JavaScript too, to use “executeScript” as I must do complex tasks.

My application is in Microsoft Access/ VBA, from which I send command to Uivision (instead of iMacros).

I’m working on the booking app of the shipping website https://www.balearia.com/es.

From the first page I need to:

  1. Choose one-way trip (done)
  2. select start and destination port (almost done)
  3. choose date of departure (very tricky date control, I need help)
  4. choose passengers (done)
  5. select vehicle type (done)

With the macro below I can do step a) and b)

As for step c) I accept all suggestions!

For example, to click 15/9/2024, in my mind I’d need to:

  1. send Uiv ${!cmd_var1} with “9” or “September”
  2. read current month (e.g. “July”)
  3. decide how many times click “next month” button using TIMES command
  4. send Uiv ${!cmd_var2} with “15” or a number like “15+x” calculated in VBA (day control starts from Monday)
  5. click the day control [15+x]

Can somebody help please?

Guido P

{
  "Name": "Bale-UivForum",
  "CreationDate": "2024-7-4",
  "Commands": [
    {
      "Command": "open",
      "Target": "https://www.balearia.com/es/balearia-booking/",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "click",
      "Target": "xpath=//*[@id=\"header\"]/div/div/div/div/div",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "click",
      "Target": "id=sel-route",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "click",
      "Target": "xpath=//*[@id=\"travel-type-dropdown\"]/div/button/i",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "type",
      "Target": "xpath=//*[@id=\"item-ida\"]/label/input",
      "Value": "ida",
      "Targets": [
        "name=tripmode",
        "xpath=//*[@id=\"item-ida\"]/label/input",
        "xpath=//input[@name='tripmode' and @value='ida']",
        "xpath=//li[2]/label/input",
        "css=#item-ida > label > input"
      ],
      "Description": ""
    },
    {
      "Command": "click",
      "Target": "xpath=//input[@name='tripmode' and @value='ida']",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "comment",
      "Target": "",
      "Value": "",
      "Description": "step a) done"
    },
    {
      "Command": "",
      "Target": "",
      "Value": "",
      "Description": "step a done"
    },
    {
      "Command": "click",
      "Target": "xpath=//*[@id=\"route_click\"]/div/input",
      "Value": "",
      "Targets": [
        "name=print-Route",
        "xpath=//*[@id=\"route_click\"]/div/input",
        "xpath=//input[@name='print-Route']",
        "xpath=//div[2]/div/div/div/div/div[2]/div/div/div/div/div/div/div/input",
        "css=#route_click > div > input"
      ],
      "Description": ""
    },
    {
      "Command": "store",
      "Target": "Barcelona - Mallorca",
      "Value": "Tratta",
      "Description": ""
    },
    {
      "Command": "type",
      "Target": "xpath=//*[@id=\"route_click\"]/div/input",
      "Value": "${Tratta}",
      "Description": ""
    },
    {
      "Command": "click",
      "Target": "xpath=//*[@id=\"origen-items-lista\"]/div[2]/div/p",
      "Value": "",
      "Targets": [
        "xpath=//*[@id=\"origen-items-lista\"]/div[2]/div/p",
        "xpath=//div[2]/div[2]/div[2]/div/p",
        "css=#origen-items-lista > div:nth-child(2) > div.info.start > p"
      ],
      "Description": ""
    },
    {
      "Command": "comment",
      "Target": "click // xpath=//*[@id=\"calendar_dropdown\"]/div[2]/div/div/div/div[2]/div/div/div/div[2]/div/button[2]",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "comment",
      "Target": "click // xpath=//*[@id=\"calendar_dropdown\"]/div[2]/div/div/div/div[2]/div/div/div/div/div[3]/div[15]",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "storeText",
      "Target": "xpath=//*[@id=\"calendar_dropdown\"]/div[2]/div/div/div/div[2]/div/div/div/div/div",
      "Value": "MsCur",
      "Description": ""
    },
    {
      "Command": "echo",
      "Target": "${MsCur}",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "storeValue",
      "Target": "xpath=//*[@id=\"calendar_dropdown\"]/div[2]/div/div/div/div[2]/div/div/div/div/div/div",
      "Value": "MsCur",
      "Description": ""
    },
    {
      "Command": "echo",
      "Target": "${MsCur}",
      "Value": "",
      "Description": ""
    }
  ]
}

Automating date controls can indeed be a challenge. Actually, often it is the most challenging part of the web automation :wink:

As for your question, just to make sure I look at the right place:

Is this the date control that you need to automate?

Also, how did you automate this date control in iMacros? Whatever approach worked there should work in Ui.Vision, too. Or is this a new automation?

Hello Ulrich, thank you for your quick answer.

Yes, the control is correct (fecha means date). If it’s easier for you, please use UK language version. I’m from Italy (Milan) but I prefer to use the native language (Balearia is a Spanish company).

The website is completely unresponsive to iMacros since last summer but, till 2023, I could get all the data I need using iMacros (but it was very challenging, indeed: this page is only the first step of booking process…).

My approach with iMacros was based on a continuous in/out communication with my VBA application using iim1.iimGetExtract() function: as far as I know this approach can’t be used with Ui.Vision.

If it is possible, this would help me a lot; if not, my purpose is to replicate the VBA calculations using executeScript in JavaScript: but I’ve still not learned how to!

The iMacros’ approach steps were:

  1. I get the HTM of the calendar, using: TAG POS=1 TYPE=DIV ATTR=CLASS:“container__months columns-2” EXTRACT=HTM
  2. In VBA I identify current month and “how far” is from target month (say: current = July, target = November, equal to 4 months, thus I need 2 clicks on “next month” button (that adds two months each click)
  3. From VBA I tell iMacros to click twice, using a For…Next cycle using: TAG POS=2 TYPE=BUTTON ATTR=CLASS:button-next-month
  4. From VBA I tell iMacros to click the day I want, using: TAG POS={{iMes}} TYPE=DIV ATTR=TXT:{{iGio}} Where {{iMes}} is the month number and {{iGio}} is the calculated day number (must be adjusted whether months are 30 days long or 31 day long)

Another question please: with iMacros I used Locator identified by ID or other attributes and switched to XPATH/CSS in case of tricky controls. Ui.Vision offers multiple choices of Locator type, but never the ID format (as far as I’ve seen). Can I use the ID format or not? It’s much easier to read and modify.

1 Like

you can use
id=xxxxx

1 Like

It can be used but implementation will be different.

Consider using text recognition with Ui.Vision. It is something iMacros could never do. This way you can click the numbers directly with XClickText | 1 and XClickText | 18 for a selection from first of July to 18th of July. For August use XClickText | 1@pos=2 and XClickText | 18@pos=2.

For other months you need to add the “XClick|image” x-times logic, just as you had before.

Here is my test (and it works ;). My macro selects August 1 to 18:

More details:

Before using this approach I tested that the Ui.Vision OCR engines recognize the numbers (here: days) reliably:

  1. Local Javascript OCR (all days found except the one on the dark background, which is ok, because the background is only dark after selecting it)

  1. Cloud OCR.Space OCR API Engine2 (all days/numbers found. I tested this using online ocr page.)

  1. I limit the OCR region to the date control with the visionLimitSearchAreaRelative command, so that it can not find numbers outside the day control.

visionLimitSearchAreaRelative for date control

Macro:

{
  "Name": "datecontrol1",
  "CreationDate": "2024-7-6",
  "Commands": [
    {
      "Command": "open",
      "Target": "https://www.balearia.com/es/balearia-booking/",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "XClickText",
      "Target": "Ruta",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "XClickText",
      "Target": "Barce*",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "visionLimitSearchAreaRelative",
      "Target": "datec1_dpi_144.png",
      "Value": "",
      "Description": "Limit OCR area to date control"
    },
    {
      "Command": "XClickText",
      "Target": "1@pos=2",
      "Value": "",
      "Description": "Second \"1\" found"
    },
    {
      "Command": "XClickText",
      "Target": "18@pos=2",
      "Value": "",
      "Description": "Second 18 found"
    },
    {
      "Command": "click",
      "Target": "xpath=//*[@id=\"passenger_confirm\"]/span",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "click",
      "Target": "xpath=//*[@id=\"confirm_vehicle\"]/span",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "click",
      "Target": "xpath=//*[@id=\"mascot_confirm\"]/span",
      "Value": "",
      "Description": ""
    },
    {
      "Command": "click",
      "Target": "id=searcherButton",
      "Value": "",
      "Description": ""
    }
  ]
}
1 Like

…I must do it myself, as UiVision does not support recording in this format. Is that correct??

Is there a method to replicate the iim1.iimGetExtract() function?
I am aware that the Clipboard can be used, but it is not suitable for my needs as I will have multiple sessions running simultaneously on different websites.
Utilizing CSV files appears to be inconvenient.

use storetext, storeattribute

1 Like

Hello Ulrich, thank you for your response.
I tried using your Macro, but it did not work for me.
I will attempt to learn how OCR operates.
Unfortunately, I am quite occupied with my daily tasks, and this will require a significant amount of time.

Yes. XClick commands need to be created manually, there is no recording for this. But actually, creating macros visually is very fast (and imho it’s fun!).

  • XClick: Image by image (take screenshots via the SELECT button).
  • XClickText… you only need to enter text. And then press “FIND” to test it, an overlay will be displayed on the website.

See “recreate” imacros scripting interface :slight_smile: