How to automate drop-down menu selection using Selenium?

General
1

Hello,

I am trying to make a flow to reach a website, enter user name and password, select an option from a drop down menu and then download the displayed table using selenium palletes.
I am not a programmer so know very little about how selenium works.
So far i have made the flow which goes to the website, enetrs username and password and logs in. Now i am stuck at the webpage where i need my flow to select an option from the drop down menu.

image
image.png823×194 73.9 KB

Below is my code:

[
    {
        "id": "61e47824.169a08",
        "type": "open-web",
        "z": "2084e4ba.5496ac",
        "name": "TOC",
        "browser": "chrome",
        "weburl": "http://192.168.16.26/vpull/SupplierDispatchReport.aspx",
        "width": 1024,
        "height": 768,
        "webtitle": "TOC",
        "timeout": 3000,
        "maximized": true,
        "server": "fd3a9f6d.27b5e",
        "x": 250,
        "y": 460,
        "wires": [
            [
                "2166da6d.c6e126"
            ]
        ]
    },
    {
        "id": "71ab2714.609b48",
        "type": "inject",
        "z": "2084e4ba.5496ac",
        "name": "",
        "topic": "",
        "payload": "",
        "payloadType": "date",
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "x": 100,
        "y": 460,
        "wires": [
            [
                "61e47824.169a08"
            ]
        ]
    },
    {
        "id": "ffaec5fb.3692d8",
        "type": "debug",
        "z": "2084e4ba.5496ac",
        "name": "",
        "active": true,
        "tosidebar": true,
        "console": false,
        "tostatus": false,
        "complete": "true",
        "targetType": "full",
        "x": 650,
        "y": 660,
        "wires": []
    },
    {
        "id": "2166da6d.c6e126",
        "type": "set-value",
        "z": "2084e4ba.5496ac",
        "name": "User",
        "text": "XXXXXX",
        "selector": "id",
        "target": "Login1_UserName",
        "timeout": 1000,
        "waitfor": 500,
        "x": 370,
        "y": 560,
        "wires": [
            [
                "dbd2def6.82a6"
            ]
        ]
    },
    {
        "id": "dbd2def6.82a6",
        "type": "send-keys",
        "z": "2084e4ba.5496ac",
        "name": "pass",
        "text": "XXXXXX",
        "selector": "id",
        "target": "Login1_Password",
        "timeout": 1000,
        "waitfor": 500,
        "clearval": false,
        "x": 490,
        "y": 560,
        "wires": [
            [
                "d9da314f.759d2"
            ]
        ]
    },
    {
        "id": "d9da314f.759d2",
        "type": "click-on",
        "z": "2084e4ba.5496ac",
        "name": "Login",
        "selector": "id",
        "target": "Login1_LoginButton",
        "timeout": 1000,
        "waitfor": 500,
        "clickon": false,
        "x": 170,
        "y": 660,
        "wires": [
            [
                "ba93ffff.912da"
            ]
        ]
    },
    {
        "id": "ba93ffff.912da",
        "type": "find-object",
        "z": "2084e4ba.5496ac",
        "name": "test",
        "selector": "id",
        "target": "ctl00_maincontent_ddlSupplierLoc",
        "timeout": 1000,
        "waitfor": 500,
        "x": 350,
        "y": 660,
        "wires": [
            [
                "ffaec5fb.3692d8"
            ]
        ]
    },
    {
        "id": "fd3a9f6d.27b5e",
        "type": "selenium-server",
        "z": "",
        "remoteurl": "http://localhost:4444/wd/hub"
    }
]

Cheers!!

2

First things first. It looks like you're using contrib nodes for Selenium. Can you please add which node(s) that are (the name of the package that was installed in the palette for it)?

Next, I've a few hundred hours of selenium experience and just looking through your flow tells me a lot already, but not enough. The website you're trying to automate is located somewhere on your local network, so I can't tell you how to do it exactly. As if the address ending on aspx wasn't a big enough clue yet, the ctl00_maincontent_... identifier on the page says that you're dealing with a microsoft framework. Those aren't the fun ones to automate, speaking from experience.

Some basics for Selenium is that it's usually better to not think of the perspective of a programmer, but from a user. Have the system click on the item that you would have a user click, have it click inside hard to access text boxes before trying to insert text through send-keys, and so on.

When you say "drop-down menu", is it a menu like part of the header, that when you hover over an item a menu pops out, or like a selection item in a form? For automating hover aspects, try to have it send a command to move the mouse to the item that would make it drop down, then click on the item inside that menu. The items are usually not visible when you try to access them directly, which will result in errors when interacting with them. But once the menu is hovered on and the thing pops out, you can interact with the items in it without it giving errors.

I can't tell you much more without more information about the system I'm afraid.

3

Hi, Thanks a lot for such a detailed reply.
so the contrib node i am using is node-red-contrib-selenium-webdriver 0.2.14

The drop down i am talking about is HTML select Tag. Like in this W3schools tutorial.

I have tried 'click on' command on the selection box but it returns an error.

Thanks again for help.

4

And the thing you're looking for are the options in it, or the current selected value? Or setting a value?

In normal selenium, I can't say how that would translate to this node specifically, for getting all the options out I'd look for elements with an xpath as selector, that uses the outer select, followed by /option as key. Say for example the id of the <select> is test-select-element, the xpath would become //select[@id="test-select-element"]/option. That would get all the options out, where you can then get the text value from. Again, I do not know how that translates to this node, not without building it myself.

If needing to get the current value, do a selector for the <select>, followed by a get-value. To set it, use set-value instead.

5

Yes the thing i am looking for is one of the selection in it.
I'll try it once with xpath and let you know what i get.
When i reach the page the option displayed on that selection is "select". When i click on it, a list is displayed, from that list i have to choose an option then click on a button named "show".
The problem part for me is just clicking on "select" then clicking on the option that is displayed.

Thanks

6

Hi,

Not trying to reroute the conversation ...
You might also consider (over time) moving from Selenium over to WebDriverIO. This set of nodes is actively maintained (by people on my team) and offers many more capabilities than native Selenium driver.

There are features like proper wait state handling (explicit and implicit waits) , 20X faster execution, ability to route tests to services etc. Dropdown handling usually becomes as simple as choosing a Selector followed by Action | Select by Visual Text.

Manage Palette | wdio and then look at the new nodes that get installed.

Specifically, for your issues: you may have something going on with timing (the object is not presented / visible before Selenium tries to use it as your 'wait' timers are so low. 0.5 second / 1.0 second is pretty aggressive...

You should also let us know which node has an error and the specific error message.

Cheers,
Paul

7

@PaulKeates1

Tried your nodes, interesting! The example flow you provide & refer to is however not working unless you add missing nodes to it. It seems you may have consolidated earlier nodes into one single with multiple options (browser action)???

Also, can you explain if/how a local Webdriver Host is needed to be installed & configured, I see that you are pointing at http://localhost:9515/

Running this stuff on a RPi3

8

I am sorry. I am a rookie user so i didn't actually understand your question.

9

Hello,

Thanks for the reply and recommendation.
And there actually was an issue with wait time. I changed it to 5 seconds and i also used get element by xpath and it solved my problem.
Here is my modified code that worked. (removed the username and password from the code)

[{"id":"eaed38a1.1a8888","type":"open-web","z":"e25c78f2.99aef8","name":"","browser":"chrome","weburl":"http://192.168.16.26/vpull/SupplierDispatchReport.aspx","width":1024,"height":768,"webtitle":"Google","timeout":3000,"maximized":true,"server":"d1e4178d.d243b8","x":390,"y":320,"wires":[["c2923df1.1618e"]]},{"id":"4973abb9.e21e84","type":"inject","z":"e25c78f2.99aef8","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":140,"y":320,"wires":[["eaed38a1.1a8888"]]},{"id":"c2923df1.1618e","type":"set-value","z":"e25c78f2.99aef8","name":"U","text":"XXXXX","selector":"id","target":"Login1_UserName","timeout":1000,"waitfor":500,"x":90,"y":380,"wires":[["c6fadad3.02e188"]]},{"id":"c6fadad3.02e188","type":"set-value","z":"e25c78f2.99aef8","name":"P","text":"XXXXX","selector":"id","target":"Login1_Password","timeout":1000,"waitfor":500,"x":230,"y":380,"wires":[["7888f5d0.317aec"]]},{"id":"7888f5d0.317aec","type":"click-on","z":"e25c78f2.99aef8","name":"L","selector":"id","target":"Login1_LoginButton","timeout":1000,"waitfor":500,"clickon":false,"x":370,"y":380,"wires":[["cc0bf95f.d2bf58"]]},{"id":"cc0bf95f.d2bf58","type":"click-on","z":"e25c78f2.99aef8","name":"Dropdown","selector":"id","target":"ctl00_maincontent_ddlSupplierLoc","timeout":1000,"waitfor":500,"clickon":false,"x":150,"y":440,"wires":[["424488c0.0c8908"]]},{"id":"424488c0.0c8908","type":"click-on","z":"e25c78f2.99aef8","name":"Click on option","selector":"xpath","target":"//*[@id=\"ctl00_maincontent_ddlSupplierLoc\"]/option[9]","timeout":1000,"waitfor":"5000","clickon":false,"x":360,"y":440,"wires":[["732e6cba.8cc284"]]},{"id":"732e6cba.8cc284","type":"click-on","z":"e25c78f2.99aef8","name":"Click on show","selector":"id","target":"ctl00_maincontent_btnShowReport","timeout":1000,"waitfor":"2000","clickon":false,"x":580,"y":440,"wires":[["daa8d17a.eae6d"]]},{"id":"398ba14e.a6cf7e","type":"debug","z":"e25c78f2.99aef8","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":470,"y":680,"wires":[]},{"id":"daa8d17a.eae6d","type":"get-attribute","z":"e25c78f2.99aef8","name":"Test","attribute":"textContent","expected":"","selector":"xpath","target":"(//*[@id=\"bodyParent\"])[3]/td[4]","timeout":1000,"waitfor":500,"savetofile":false,"x":350,"y":580,"wires":[["398ba14e.a6cf7e","2a8d57fb.1b25b8"]]},{"id":"ca2c7062.ffd4b","type":"debug","z":"e25c78f2.99aef8","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":480,"y":760,"wires":[]},{"id":"2a8d57fb.1b25b8","type":"get-attribute","z":"e25c78f2.99aef8","name":"Test","attribute":"textContent","expected":"","selector":"xpath","target":"(//*[@id=\"bodyParent\"])[3]/td[8]","timeout":1000,"waitfor":"5000","savetofile":false,"x":310,"y":720,"wires":[["ca2c7062.ffd4b"]]},{"id":"d1e4178d.d243b8","type":"selenium-server","z":"","remoteurl":"http://localhost:4444/wd/hub"}]
10

Hi,

You can use the default (http://localhost:4444/wd/hub) if you are running any kind of GRID or Selenium component (e.g. 'selenium-standalone start') on the same machine as the Node-RED instance.

A better (also long-term) approach might be to transition to Zalenium (Docker container) then you get a lot more flexibility and some really useful features. Essentially, Zalenium gives you a configurable Selenium GRID in a Docker container with a lot of additional features and without the pain of configuration / versions. Video capture, better logging, configurable sessions (e.g. start 5 Chrome + 3 FireFox sessions), and remote observation of test execution in real-time.

I'll ask the person who wrote the WebDriverIO example if he can update it.

Cheers,
Paul