The Django Selenium test is encountering a failure due to its inability to locate an element that is added after a click event

I'm currently facing an issue when writing a test for my application as it continues to fail. Despite attempting to use both WebDriverWait and time.sleep(), the problem persists.

The troublesome section of the test appears as follows:

form_2.find_element_by_css_selector('.btn-primary').click() # submits form_2 and changes page to next form
self.assertEqual(
    self.get_current_url(),
    self.live_server_url + reverse(
        'activitygroupconfigstepkeycharacteristicfieldset_update', kwargs={'activitygroupconfig_pk': 1}
    )
) # test to see if expected url is correct

# Fill out next form (i.e. Key Characteristics)
form_3 = self.driver.find_element_by_xpath('//form[@role="form"]')
form_3.find_element_by_css_selector(
    '#div_id_activitygroupconfigstepkeycharacteristicfield_set-0-key_characteristic'
).click()
assert form_3.find_element_by_css_selector('.select2-container--open').is_displayed() is True # I'm getting this error: selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element: {"method":"css selector","selector":".select2-container--open"} here so the click clearly isn't working.

The desired outcome is that the element gets clicked, triggering the insertion of a new element into the DOM. However, the assertion failure indicates that this process isn't happening as expected. Following the click action, I also checked with print(self.driver.page_source) and it showed that the element was not added, suggesting that the click event wasn't being recognized.

My initial thought was that the issue might be related to custom jQuery scripts not completing before the test engages on the page. To address this, I included the following:

def wait_script(self):
    WebDriverWait(self.driver, 10).until(lambda s: s.execute_script("return jQuery.active == 0"))

After implementing this script post-page transition, verifying True returned before commencing the test; hence, I presumed all relevant jQuery operations had concluded, unless any potential page-specific customized functions were overlooked?

Your assistance in resolving this puzzle would be greatly valued.

Answer №1

After conducting some research, I discovered that the target element for the click event was incorrect. Check out: this helpful response on Stack Overflow, which I modified to suit my situation:

form_3.find_element_by_id(
    'id_activitygroupconfigstepkeycharacteristicfield_set-0-key_characteristic'
).find_element_by_xpath('..').click()

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

The element 'mat-form-field' is unrecognized

I am currently working on an angular component called x.component.html. It utilizes angular material and the structure is as follows: <div class="example-container mat-elevation-z8"> <div class="example-header"> <mat-form-field> ...

Retrieve a specific value from an array within Firestore

I am facing an issue where I can only retrieve the values I need from the array by adding a specific string like "اقلام" or "سبورة". However, I want the value to be passed as a prop from another component or screen. Is there a way to resolve this ...

Storing dynamic dropdown choices using Python and Selenium WebDriver

Struggling with storing address values generated by a postcode lookup for later use in Python's Random module to select a random value using random.choice. Here is the scenario: User enters postcode, clicks 'Search' - dropdown list dynamic ...

Disable the Tooltip Bootstrap feature

Based on the documentation, it seems possible to disable the functionality by using $('body').off('.alert.data-api'). I attempted to do the same for tooltips by running $('body').off('.tooltip.data-api') in the Jav ...

Attempting to verify the retrieval of a file through simulating the pipe function

The db object is sourced from the cloudant package. Below is the code snippet I am in the process of testing: res.set('some-header', 'some-value'); res.status(200); db.attachment.get('some-uuid', 'file'). on(&ap ...

The div structure generated through JavaScript appears distinct from its representation in the live DOM

Currently, I am facing a challenge with creating a complex nested Div structure within a JavaScript loop that iterates over JSON response objects from the Instagram API. The main goal is to set the URL for each image within a specific Bootstrap div layout. ...

Using Jquery and Ajax to Process JSON Data

Currently experimenting with the API. This API generates random user data in JSON format, but I'm facing difficulties in parsing the response. Every time I try, I end up receiving undefined objects. Below is the code snippet that I am using: <sc ...

Each time core-ajax sends a request, it is assigned a new session ID

I'm experiencing an issue where the session ID of requests sent using core-ajax to my NodeJS backend changes every time. How can I set up a configuration so that the frontend consistently sends requests with the same session ID? It's important t ...

Selenium Chrome Driver allowing for sending key combinations to a window

I am looking to trigger a key press combination using the Selenium Chrome driver. This action does not involve sending text to a textbox or clicking on any buttons. My interest lies in executing commands like command+R (reload on Mac OS). Note that reload ...

Guide to correcting Form Data errors with XHR resulting in a 400 Bad Request

This is a straightforward piece of code I've written. It's simply a POST request to my API endpoint using FormData. Interestingly, the API is returning a bad request error for reasons unknown to me. When I tested the API with curl, everything wo ...

"Is there a way to verify the existence of checkbox array values within a database using PHP Laravel

In order to display checkboxes for each country that exists in the database, I need to verify if the countries in the database match with those in the list. Since the values are retrieved directly from the database and can't be set as input values due ...

What is the best way to change a string containing single quotes to double quotes in order to JSON parse it

My PHP code involves encoding an array using json_encode. $params = array(1=>'something','2'=>'two'); While the encoding process itself works fine, I encountered an issue when trying to embed the JSON data into an anc ...

Ways to retrieve and update the state of a reactjs component

I'm facing an issue with modifying a React JS component attribute using an event handler. export default interface WordInputProps { onWordChange:(word:string) => void firstLetter:string disabled?:boolean } These are the props for my co ...

Navigating to another page after submitting an AngularJS form

In order to enhance the user experience on my website, I have created an index page containing a form with a text field and a search button. The goal is for users to input their search query into the text field and upon clicking the search button, the form ...

The pagination feature in Algolia instantsearch fails to display the results from the second page

While working with Laravel Vue and Algolia, I encountered an issue with pagination. The pagination seems to be functioning, but only the first page result is displayed. Clicking on pages 2, 3, etc. does not fetch the next page's results. Below are the ...

Is it possible to convert nested CSS into Material-UI's CSS in JS method?

Here is the code for embedding an iframe: <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: abso ...

Stepping into the world of automated testing: logging in programmatically and seamlessly transitioning to WebDriver using Python

While the question about logging in programmatically has been asked previously, I have a unique scenario that I am attempting to address. Within my collection of Python functional tests, each test currently requires logging into the web app for execution. ...

Having difficulty running a three.js example on Apache Tomcat 6

Currently, I am utilizing Eclipse for the development of a web application. One of my objectives is to showcase my custom 3D model created with Sketchup. I stumbled upon this resource: and . The models render seamlessly on my Chrome browser Version 24.0 ...

The Relative Positioning Feature of Selenium

Trying to extract data from our application using Selenium's Relative Locator. Sample data consists of rows with three columns: Field Name, Separator, and Value. Each row has a dynamic id and Field Name also has a dynamic id. The value fields share th ...

The problem of interpreting JSON using the JavaScript eval() function

Here is the JSON string provided : { "name":"Ruby on Rails Baseball Jersey", "price":"19.99", "id":"1025786064", "image":"" }, { "name":"Ruby on Rails Baseball Jersey", "price":"19.99", "id":"1025786064", "image":"" }, { "name ...