How to right click and select option in WebdriverJS?

Question

I am using Selenium WebdriverJS (NOT Java selenium and NOT Webdriver.io!), which has horrible documentation for beginners. I need to right click an element and move down to "save as", then .sendKeys() then Enter since this seems to be the only way to save an image from a web page without a full page screenshot.

I am trying to implement the following Java solution in Javascript but no dice:

Here a few of many different versions I tried. All give me errors relating to 'Keys' or 'ARROW_DOWN' or 'DOWN'.

var webdriver = require('selenium-webdriver'),
    By = webdriver.By,
    until = webdriver.until,
    button = webdriver.Button,
    promise = webdriver.promise;
    fs = require('fs');

//Generate  browser
var driver = new webdriver.Builder()
    .forBrowser('chrome')
    .build();


/******* Begin Tests*******/

//Begin test from login page
driver.manage().window().maximize();
driver.get('https://www.google.com/ncr');
driver.sleep(2000);


/***********   NONE OF THESE WORK ***********/

//Actions is not defined
var GoogleLogoImg = driver.findElement(By.css('#hplogo')).then(function() {
    driver.Actions.contextClick(GoogleLogoImg)
    .sendKeys(Keys.ARROW_DOWN)
    .sendKeys(Keys.ARROW_DOWN)
    .sendKeys(Keys.RETURN)
    .perform();
})

//Keys is not defined

var GoogleLogoImg = driver.findElement(By.css('#hplogo')).then(function() {
    driver.actions().click(button.RIGHT).perform().then(function(){
        driver.sendKeys(Keys.ENTER);
    });
});

//Not a modifier key

var GoogleLogoImg = driver.findElement(By.css('#hplogo')).then(function() {
    driver.actions().click(button.RIGHT).perform().then(function(){
         new webdriver.ActionSequence(driver).
                keyDown(webdriver.Key.ARROW_DOWN). // <-- 'Not a modifier key'
                keyUp(webdriver.Key.ARROW_DOWN).
                perform();
    });
});

//Not a modifer key
var GoogleLogoImg = driver.findElement(By.css('#hplogo')).then(function() {
    driver.actions().click(button.RIGHT).perform().then(function(){
         new webdriver.ActionSequence(driver).
                keyDown(webdriver.Key.DOWN). // <-- 'Not a modifier key'
                keyUp(webdriver.Key.DOWN).
                perform();
    });
});

Answer 1

Your screenshots show the web browser right-click menu, not a website-generated right-click menu. This menu can not be automated via webdriver. You would need a desktop automation solution like Sikuli.

Here is an example of a right-click menu that will work with webdriver: http://www.seleniumeasy.com/selenium-tutorials/right-click-context-menu-webdriver-example

Answer 2

Under "NONE OF THESE WORK" you have 4 examples. Here I'll try to explain why they don't work.

• Actions is not defined This happens because the driver object has a method actions(), not Actions member (unlike Selenium Java). Also, your callback function in .then is missing the argument that will contain the found element.

So instead you you could use:

const Keys = webdriver.Key;

driver.findElement(By.css('#hplogo')).then(function(GoogleLogoImg) {
    driver.actions.click(GoogleLogoImg, button.RIGHT)
    .sendKeys(Keys.ARROW_DOWN, Keys.ARROW_DOWN, Keys.RETURN)
    .perform();
})

• Keys is not defined This is because in WebdriverJS the set of keys is called Key, see the first line of code in the sample above.

• Not a modifier key This is because the function keyDown expects a modifier key, such as CTRL, SHIFT, etc., and not a regular key. For regular keys use sendKeys. Also ARROW_DOWN and DOWN are synonyms, they map to the same code, \uE015.

Having said all that, @timfredo is correct in saying that this will only work for a website-generated context menu. You can display the browser context menu with click, but the key events will be sent to the original element on the page, not the menu!

Answer 3

quick google search suggests:

https://stackoverflow.com/questions/11428026/select-an-option-from-the-right-click-menu-in-selenium-webdriver-java

https://stackoverflow.com/questions/433919/javascript-simulate-right-click-through-code

What else did you tried?

Answer 4

If you want to right-click on any element then selenium doesn't provide any direct method for that. We need to use the Actions class provided by WebDriver. The Actions class provided by Selenium Webdriver is used to generate complex user gestures including right click, double click, drag and drop etc. Here is the code:-

Actions action = new Actions(driver);
WebElement element = driver.findElement(By.id("elementId"));
action.contextClick(element).perform();

Read more: https://softwaretestingboard.com/q2a/2547/