How would I automate this in selenium webdriver?

Question

I am a newbie in Selenium Webdriver (Js), trying to learn some basics, being majorly stuck on this example:

I am trying to automate googling "Diablo 2 Resurrected days until release" and then printing the days remaining to the console from google.

The part I struggle with is printing the days left to my console. I have a feeling that the problem is, that the element I'm trying to use .getText() on is not available yet when webdriver tries to find it, however using driver.sleep() nor implicitlyWait does not work for me for some reason. I use xpath and css as a selector, neither did work for me. Here is my code:

const {Builder, By, Key, until, WebDriver} = require("selenium-webdriver");
const { elementIsVisible } = require("selenium-webdriver/lib/until");
require("chromedriver");



let driver = new Builder().forBrowser("chrome").build();



driver.get("https://google.com");


// this clicks on cookies accept button
driver.findElement(By.css("#L2AGLb > div")).click();

driver.findElement(By.css('body > div.L3eUgb > div.o3j99.ikrT4e.om7nvf > form > div:nth-child(1) > div.A8SBwf > div.RNNXgb > div > div.a4bIc > input')).sendKeys('Diablo 2 Resurrected days until release');

driver.findElement(By.xpath('/html/body/div[1]/div[3]/form/div[1]/div[1]/div[3]/center/input[1]')).click();

driver.findElement(By.xpath('/html/body/div[7]/div/div[9]/div[1]/div/div[2]/div[2]/div/div/div[1]/div/div[1]/div[1]/div[1]/div/div[2]/div/div[1]')).getText().then(txt => {
    console.log("Do D2R releasu zbývá: " + txt)
    }).catch(err => {
        console.log('error!', err);
});

Here is the error:

error! NoSuchElementError: no such element: Unable to locate element: {"method":"xpath","selector":"/html/body/div[7]/div/div[9]/div[1]/div/div[2]/div[2]/div/div/div[1]/div/div[1]/div[1]/div[1]/div/div[2]/div/div[1]"}

Edit: Solved! Here is the working code

const {Builder, By, Key, until, WebDriver} = require("selenium-webdriver");
require("chromedriver");

let driver = new Builder().forBrowser("chrome").build();

async function howManyDaysTillDiablo2ResurrectedRelease() {
    await driver.get("https://google.com");
    await driver.findElement(By.css("#L2AGLb > div")).click();
    await driver.findElement(By.css('body > div.L3eUgb > div.o3j99.ikrT4e.om7nvf > form > div:nth-child(1) > div.A8SBwf > div.RNNXgb > div > div.a4bIc > input')).sendKeys('Diablo 2 Resurrected days until release');
    await driver.findElement(By.xpath('/html/body/div[1]/div[3]/form/div[1]/div[1]/div[3]/center/input[1]')).click();

    let ele = await driver.wait(until.elementLocated(By.css("div[data-attrid*='calculate:how_many_days_away'][role='heading'] div")), 10000);
    let foo = await ele.getText();





    await driver.findElement(By.css("div[data-attrid*='calculate:how_many_days_away'][role='heading'] div")).getText().then(foo => {
        console.log("Do D2R releasu zbývá: " + foo)
        }).catch(err => {
            console.log('error!', err);
    
    
})};

howManyDaysTillDiablo2ResurrectedRelease();

Answer 1

The xpath that you are using, looks like you got from dev tools. (and it's an absolute xpath, not relative xpath)

As you have mentioned you are a beginner, I would recommend you to learn css selector and xpath and try to write your own. Meanwhile :-

You can use the below css :

div[data-attrid*='calculate:how_many_days_away'][role='heading'] div

and use it like this :

driver.findElement(By.css("div[data-attrid*='calculate:how_many_days_away'][role='heading'] div
")).getText()

Update :

let ele = await driver.wait(until.elementLocated(By.css("div[data-attrid*='calculate:how_many_days_away'][role='heading'] div")), 10000);
let foo = await ele.getText();