The functionality of setValue() is not available in nightwatch.js

I am currently trying to create a basic script using nightwatch.js that will launch Google and input text into the search bar. However, I am encountering difficulties when using both setValue() methods to enter text into the element.

Below is my script:

module.exports = {
  'Search bar displayed on Google Home Page'(driver) {

    driver
      .url('http://www.google.com')
      .assert.urlContains('google')
      .assert.title('Google')
      .waitForElementPresent('input[title="Search"]')
      .pause(5000)
      .setValue('input[title="Search"]', 'test123') // issue occurs here
      .end()
  },
}

Upon using setValue(), I encounter the following error message:

Error while running .setElementValue() protocol action: TypeError [ERR_UNESCAPED_CHARACTERS]: Error while trying to create HTTP request for "/wd/hub/session/ed0680ce58544facf2a4b193eccbc223/element/[object Object]/value": Request path contains unescaped characters at new ClientRequest (_http_client.js:115:13) at Object.request (http.js:42:10) at HttpRequest.createHttpRequest at new Promise () at Selenium2Protocol.sendProtocolAction

It seems like .setValue() is attempting to send Object object as the WebElement ID in the request URL.

The script successfully performs the assert and

.waitForElementPresent('input[title="Search"]')
actions, indicating that the element exists on the page. To ensure sufficient loading time, I added a pause(5000) before sending keys. Additionally, I've tried clicking with .click() prior to utilizing .keys() in an attempt to focus on the element.

While I believe the syntax to be accurate, my limited experience with nightwatch could be a contributing factor to the problem.

A similar issue was reported by another user, but unfortunately, it remains unresolved: setValue method in Nightwatch is not working

I am using chromedriver version 80.0.3987.16

The nightwatch version being utilized is 1.3.4

To install chromedriver, I used npm install chromedriver and configured the path to chromedriver.exe in my nightwatch.json file:

{
  "src_folders" : ["tests"],
  "output_folder" : "reports",
  "custom_commands_path" : "",
  "custom_assertions_path" : "",
  "page_objects_path" : "./page_objects",
  "globals_path" : "",

  "selenium" : {
    "start_process" : true,
    "server_path" : "./node_modules/selenium-standalone/.selenium/selenium-server/3.141.5-server.jar",
    "log_path" : "./reports",
    "host": "127.0.0.1",
    "port" : 4444,
    "cli_args" : {
      "webdriver.chrome.driver" : "./node_modules/chromedriver/lib/chromedriver/chromedriver.exe",
      "webdriver.gecko.driver" : "",
      "webdriver.edge.driver" : ""
    }
  },

  "test_settings" : {
    "default" : {
      "launch_url" : "http://localhost",
      "selenium_port"  : 4444,
      "selenium_host"  : "localhost",
      "silent": true,
      "screenshots" : {
        "enabled" : false,
        "path" : ""
      },
      "desiredCapabilities": {
        "browserName": "chrome",
        "marionette": true,
        "javascriptEnabled": true,
        "acceptSslCerts": true
      }
    },

    "chrome" : {
      "desiredCapabilities": {
        "browserName": "chrome"
      }
    }
  }
}

If anyone could provide insight into what might be causing this issue, I would greatly appreciate it.

Answer №1

The solution to the problem I faced was resolved by inserting "w3c": false beneath "chrome" within my configuration file named nightwatch.json.

A big shoutout to @Raju for their guidance, as their repository contained a helpful example in the nightwatch.conf.js file.

I made the following adjustments:

  "test_settings" : {
    "default" : {
      "launch_url" : "http://localhost",
      "selenium_port"  : 4444,
      "selenium_host"  : "localhost",
      "silent": true,
      "screenshots" : {
        "enabled" : false,
        "path" : ""
      },
      "desiredCapabilities": {
        "browserName": "chrome",
        "marionette": true,
        "javascriptEnabled": true,
        "acceptSslCerts": true
      }
    }

And changed it to this:

  "test_settings" : {
    "default" : {
      "launch_url" : "http://localhost",
      "selenium_port"  : 4444,
      "selenium_host"  : "localhost",
      "silent": true,
      "screenshots" : {
        "enabled" : false,
        "path" : ""
      },
      "desiredCapabilities": {
        "browserName": "chrome",
        "marionette": true,
        "javascriptEnabled": true,
        "acceptSslCerts": true,
        "chromeOptions": {
            "w3c": false
        }
      }
    }

By including the chromeOptions section along with "w3c": false, all functionality is now working smoothly and as intended.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What causes one CSS file's properties to be inherited by another CSS file in a React application?

I'm puzzled as to why my hero section file seems to be adopting the styling from the navbar CSS file. I do understand that the index.css file sets properties for the entire app, but in my case, I have separate CSS files for different components instea ...

Implementing JavaScript functionality based on a specific body class

Is there a way to execute this script only on a specific page with a particular body class? For example, if the page has <body class="category-type-plp"> How can I target my script to work specifically for "category-type-plp"? plpSpaceRemove: fun ...

Guide to deactivating scrolling on a specific element using jQuery

Can anyone provide a solution for disabling scroll on the window but still allowing scrolling within a text area? I attempted to use the following code, but it ended up disabling everything entirely: $('html, body').css({ overflow: 'hid ...

Executing a Javascript function post AJAX page loading

I'm not a coding expert, so I hope my question is still clear. Essentially, I have an index.php page with filters (by project, year, month) that send variables to filterData.php after clicking submit. These variables are then used in SQL statements t ...

Combining sub-objects under a shared parent in Javascript

In my data structure, I have parent objects with nested arrays of children. Here's an example: [ { "fullName": "Certificate", "checked": false, "children": [ { "type": "Certificate", "lastModifiedDate": "1971-01-01 ...

Adjusting the size of the snap increments

When using gridstack, I have the ability to resize my widgets. However, I've noticed that when dragging on the widgets' handles, they snap to specific sizes, which seems to be a fixed amount. If I wanted to set the widget's size to something ...

What is the best way to manipulate arrays using React hooks?

Struggling with updating arrays using hooks for state management has been quite a challenge for me. I've experimented with various solutions, but the useReducer method paired with dispatch on onClick handlers seems to be the most effective for perform ...

What could be causing my JSON array to not display an input type radio for every line?

I am puzzled as to why the radio is displaying all the choices in one line instead of individually. I'm attempting to create a quiz/result code. HTML FILE <html><br> <head><br> <meta charset="UTF-8"><br> <title ...

Having trouble running Javascript with jQuery's ajax load()?

I have encountered this problem and despite reading multiple posts, I am unable to find a solution. My challenge lies in loading an HTML file into a div that contains an unordered list. The list is supposed to function as an expanded menu with sub-items, ...

Is there a way to stop Chrome from creating an endless loop while showing alerts during the focus event, without having to disable and enable the event repeatedly?

Looking for a solution to prevent an infinite loop of alert messages in Google Chrome when clicking on cmbMonkeys. The workaround for cmbPeople is working fine, but I'm curious if there's another way to handle alerts on focus or blur events with ...

Organizing a JSON array and displaying it using the $.each function

My JSON array is structured like this: "series": [{ "book": 1, "chapter": 1, "title": "Title of this chapter", }, { "book": 1, "chapter": 2, "title": "Title of this chapter", }, { "bo ...

transfer properties to a dynamic sub element

I am currently working on a multi-step form project. I have successfully implemented the form so that each step displays the corresponding form dynamically. However, I am facing challenges in passing props to these components in order to preserve the state ...

Unable to get jQuery plugin to function properly within a .vue component

I am currently working on a Vue component for my Laravel 5.3 application. I am trying to integrate the Laravel File Manager into a standalone button, but it seems like it's not functioning properly. When I click on the button to choose an image, nothi ...

Choose a specific "field" from a Firebase array

I am currently working on a project using AngularJS and Firebase, and everything seems to be functioning well. https://i.sstatic.net/ojy2Z.png However, I am facing a challenge of extracting only temperature values into one array and humidity values into ...

retrieve the identification number associated with a specific value

How can I retrieve the value of this ID, which is sent from the controller and displayed in the table? https://i.sstatic.net/UbdxT.png This is my HTML code: <tbody class="no-border-x"> <tr> <td id="id"></td> <td i ...

Is there a way to dynamically apply the "active" class to a Vue component when it is clicked?

Here is the structure of my Vue component: Vue.component('list-category', { template: "#lc", props: ['data', 'category', 'search'], data() { return { open: false, categoryId: this.category ...

Determine the disabled state of an element with Selenium

Recently, I came across this WebElement (currently disabled): <select id="id1" name="name" disabled=""><option value="">Select...</option> <option value="false">No</option> <option value="true">Yes</option></se ...

The NodeJS and Python-Shell .run function fails to display the standard output

I am currently working with NodeJS and a Python script. To retrieve results from my Python script, I have been using Python-Shell which you can find detailed documentation for at: github.com/extrabacon/python-shell Typically, to get prints from the scrip ...

Can a By object be obtained using a WebElement?

When locating WebElements using @FindBy annotations, I am able to use them in methods as parameters if the WebElement is found on the page. However, if I need to wait for the element to appear, I have to use By (with the same locator) instead. For example ...

Tips for including multiple directives in a component

Apologies in advance for my lack of clarity in expressing this question, which is why I am seeking assistance rather than finding the solution on my own. My query pertains to loading a component within another one and specifying it in the directive. Below ...