How do I destructure this JavaScript Object completely, It keeps returning Undefined yet there`s a value assigned to it

Question

I`m using selenium to webscrape a website that is renderd dynamically using JavaScript but I am not get the data I am looking for, The initial data returned was an array of objects;

            [
              WebElement {
              driver_: thenableWebDriverProxy {
              session_: [Promise],
              executor_: [Executor],
              fileDetector_: null,
              onQuit_: [Function: onQuit],
              then: [Function: bound then],
              catch: [Function: bound catch]
            },
          id_: Promise { '4c778b4e-64aa-4433-ad98-2d07e9f20c29' }
       },

Which I further opened into;

    thenableWebDriverProxy {
             session_: Promise {
                         Session {
                         caps_: [Capabilities]
                       }
                    },
             executor_: Executor {
                      w3c: true,
                      customCommands_: Map(4) {
                      'getContext' => [Object],
                      'setContext' => [Object],
                      'install addon' => [Object],
                      'uninstall addon' => [Object]
                   },
            log_: Logger {
                    name_: 'webdriver.http.Executor',
                   level_: null,
                   parent_: [Logger],
                   handlers_: null
               }
           },
          fileDetector_: null,
          onQuit_: [Function: onQuit],
         then: [Function: bound then],
         catch: [Function: bound catch]
  }

And this again contiues into;

                    Promise {
                        Session {
                            id_: '4083ce6f-f536-41bd-9f4e-9c1a66c4486f',
                            caps_: Capabilities { map_: [Map] }
                       }
                    },

            

Now how do I get to the properties of caps_ that have been nested in there, My code keeps returning undefined even when I test for the value of id_ which should obviously return a value since I can see it even without writting any line of code.

Here's my code

                         let {Builder, By} = require('selenium-webdriver');
                            driver = new Builder().forBrowser('firefox').build();

                            (async function test(){

                            await driver.get('https://www.betika.com/');

                            let data = driver.findElements(By.css('.match'));

                             try{
                                  data.then(function(result) {
                                  console.log(result);
                                  
                                  const fine = result.forEach(element => { 
        
                                         console.log(element.driver_); 
                                  });

                                  const outPut = result.forEach(element => {
                                         console.log(element.
                                                     driver_.
                                                     session_);

                                  });

                           const Test = result.forEach(element => {
                              console.log(element.
                                    driver_.
                                    session_.
                                    caps_);

                            });
                      

            

Answer 1

Actually "data" doens't work as a DOM tree, the library says that the return of function used in your code is a WebElement, so you can use to navigate or get information based on the search.

For exemple:

let { Builder, By } = require('selenium-webdriver');

driver = new Builder().forBrowser('chrome').build();

async function test() {

    await driver.get('https://yoursite/login');

    let data = await driver.findElement(By.css('label')).getText();

    console.log(data)
}

test();

Data result could be something like "E-mail" if the site has a structure like this:

<form>
<label>E-mail<input/><label>
<form>

Source: https://www.selenium.dev/documentation/webdriver/