Nightwatch JS: The Browser.execute function fails to run Javascript code

I am conducting a test to verify if the textfield input is empty.

While working with Nightwatch and using the browser.execute() command, I encountered an issue where adding simple JavaScript code to check if a textfield is empty resulted in Nightwatch skipping the block of code. Interestingly, when I run the same JS code in the dev tools, it works perfectly fine but fails within Nightwatch. It's possible that I am misunderstanding the usage of browser.execute, so any insight into what might be going wrong would be greatly appreciated.

Thank you in advance for your help.

Nightwatch code

this.api.execute(
       function() {
        let element = document.getElementById('autocomplete-input').value;
        console.log(element);
             if(element.length == 0 || element === ""){
             console.log('Element is empty')
            }
          })
        },


JS code

     function testing1() {
       let element = document.getElementById('autocomplete-input').value;
       console.log(element);
          if(element.length == 0 && element === ""){
          console.log('Element is empty')
    }
}

Answer №1

When referencing the .execute() function in Nightwatch Docs, it's important to note that it requires a body, an array of arguments for the function, and an optional callback function. To ensure proper execution, simply include an empty array if you already have the body.

browser.execute(function sampleFunction() {
           let input = document.getElementById('autocomplete-input').value;
           console.log(input);
              if(input.length == 0 && input === ""){
              console.log('Input is empty')
        }
    }, [])

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

I am finding that the text I am creating using context.fillText keeps getting distorted within the canvas

I am attempting to place text inside a canvas element. The HTML markup for the canvas is as follows: <canvas id="leaderboard2" style="position: fixed; right: 1250px; top: 140px; width: 230px; height: 330px;"></canvas>. Des ...

Utilizing Express and ejs to display a JSON using the "<%" tag

I am facing an issue with the code in my index.ejs file. The current code snippet is as follows: var current_user = <%= user %> In my node.js file, I have the following code: app.get("/", function(req, res){ res.locals.user = req.user res. ...

When attempting to access the ref of a Text Input in a React Native Component, the refs are found

In my application, I have multiple components each containing a textInput field. When a user submits the textInput in one component, I want it to automatically focus on the next component's textInput field. However, when I try to implement this functi ...

Utilizing Async / Await in the created lifecycle hook - Vue2

I recently installed the vue-element-loading package and added its component to my page.vue: <vue-element-loading :active="isActive" :is-full-screen="true"/> After adding a variable to my data: data () { return { isActive: false, } } I th ...

What is the best way to pass my request data to my $scope variable?

I'm currently facing a challenge with this particular topic. My goal is to add the response data that I retrieve from Express to my angular $scope and then direct the user to their profile page. This is how my Controller Function is structured: $sc ...

Navigating with Ionic 7: Tabbed Interface

As a newcomer to development, I have decided to use Ionic Framework 7 for my project, utilizing vanilla JavaScript. I have successfully implemented tabbed navigation using the code below. Now, I am looking to allow page navigation within each tab, but I ...

Using AWS StepFunctions to add a prefix to an input string

How can I use TypeScript and CDK to create a task that prefixes one specific field in the input while leaving the rest unchanged? Input: { "field1": "foo", "field2": "bar" } Desired output: { "field1" ...

Encountering Issues with Installing Postgres Module in Node.js along with FAQs about Node.js

I've encountered a problem while trying to install the Postgres database module for Node.js. Whenever I execute the command "npm install pg", I receive the following error message: C:\>npm install pg<br> npm http GET https://registry.n ...

What is the best way to eliminate an element from a state using the useState hook?

I need help with generating a list of values from checkboxes. const [checkedState, setCheckedState] = useState({}); const handleOnChange = (e) => { if(e.target.checked === true){ setCheckedState({ ...checkedState, [e.target.name]: e.target.checke ...

Error message "npm install is causing a warning due to an outdated lockfile"

npm 8.1.2 | node 16.13.1 Upon running npm install, I encountered the error message below. It seems to be related to version compatibility issues, even though I tried installing npm version 7.19.1, the same error persists. Any suggestions on why this is ha ...

Incorporate Illustrator SVG 1.0 or 1.1 into your projects with the help of three.js and d

I have come across several resources that discuss using an SVG exported from Illustrator for WebGl with three.js and d3. Extrude, or, make 2d SVG path into 3d https://github.com/josdirksen/learning-threejs/blob/master/chapter-06/05-extrude-svg.html Illu ...

What is the best way to utilize a basic jQuery hide/show function to display everything before hiding it?

I have a dropdown menu where selecting an option will display a specific section based on the matching value and class, while hiding all other sections. How can I set it up so that before any selection is made, all sections are displayed and only hide afte ...

The issue with Jquery .post function not functioning properly within a popup div

After spending countless hours on this issue, I feel like I'm at a loss... The problem lies in a div that pops up with a button, where the button fills data into different sections of the HTML... Everything works fine except for when I use ajax to c ...

"Utilize the parent component's functionality by extending/inheriting it

export default function PageTemplate() { return ( <div className="layout"> <LeftMenu /> <div className="content"> <TopMenu /> <div id="other-contents"> ...

What is the best way to prevent event propagation in d3 with TypeScript?

When working with JavaScript, I often use the following code to prevent event propagation when dragging something. var drag = d3.behavior.drag() .origin(function(d) { return d; }) .on('dragstart', function(e) { d3.event.sourceEvent ...

Getting an invalid ELF header error when using nodejs iconv

Just checking on my local computer (mac terminal, with node web.js) I confirmed that it is running on the local server. However, every time I try to deploy it to the server, I keep getting this error message: Error: /home/hosting_users//apps//node_modul ...

loading content into a pop-up window with JavaScript

Within my application, I am utilizing jQuery Ajax to retrieve a list that will be displayed in a popup. The javascript code returns a list structured as [["1","abc"],["2","bcd"]]. This list is then being used to populate the contents of the display tag wit ...

My node.js code is not producing the expected result. Can anyone point out where I may be going wrong?

I've been working on a BMI calculator where I input two numbers, they get calculated on my server, and then the answer is displayed. However, I'm having trouble receiving the output. When I click submit, instead of getting the answer, I see a lis ...

how to run two functions simultaneously within a single Node.js file

I have a file called utilityfunctions.js Inside this file, I've defined two functions: functionA and functionB. exports.functionA = function(length) { //perform some operation } Now, in my functionB, I'm trying to invoke functionA as follow ...

Using ng-repeat within another ng-repeat allows elements to be displayed as siblings

My goal is to create a structured list using angularjs: Parent 1 Group1 Child1 Child2 Child3 Child4 Group2 Child1 Child2 Parent 2 Group1 Child1 Child2 Group2 Child1 I have data organized in a similar format like this. $scope.parents = [{ name:&apos ...