0

I'm writing an integration test for a react-joyride tour that i've implemented. The tests are failing because many times, even though Selenium clicks on a button, the event that is associated with that button click ( onClick) is not triggered.

I think this is because the js files for that particular button have not yet been loaded. How can i make sure that this these files are loaded before the execution is continued.

Code :

The following is my test.rb file.

#floatingButton -> button that starts the tour,

div.__floater__body -> div that contains the joyride tooltip

      wait_until { find(:css, '#floatingButton') }
      find(:css, '#floatingButton').click
      find(:css, 'div.__floater__body')
      within(:css, 'div.__floater__body') do
        # STEP 1
        assert page.has_content? 'An event is a date on which a particular test can be taken.'
        assert page.has_button? 'Close tour'

        assert page.has_button? 'Next'
        click_on 'Next'

        # STEP 2
        assert page.has_content? 'You can click here to create a new event.'
        assert page.has_button? 'Close tour'
        assert page.has_button? 'Next'
        assert page.has_button? 'Back'
        click_on 'Next'

Sometimes, when 'Next' is clicked nothing happens. The tour does not move to the next step.

enter image description here enter image description here

I'm sometimes getting the same problem with 'Back' and 'Close tour'(see image) buttons during testing.

How can i resolve this error. Please help!

Kabir Pathak
  • 41
  • 11
  • What visibly changes on the page when it's ready to be interacted with? Then set an assertion for that. Also, your current test code has issues - 1. you should NEVER be asserting on Capybara predicates, instead you should be using the Capybara assertions - `assert_content ...` (or page.assert_content...) not `assert page.has_content? ...` - 2. There is no point in asserting for a button before clicking the button since `click_button` will wait for the button to exist. – Thomas Walpole Aug 27 '21 at 23:48
  • Thanks for you reply Thomas. But the main problem that i'm facing is that sometimes the code works. But somtimes nothing happens after 'Click_button 'Next'" is executed. Do you have any idea why this is happening? – Kabir Pathak Aug 29 '21 at 11:34
  • As I stated you need to figure out what visibly changes on the page when it's ready to be interacted with - ie once all the JS has loaded what changes did it make to the page. Then set an expectation for that (so it waits), in order to delay the click until the page is ready for it. The other possibility is that the button is being animated onto the page (moving) so that the click is missing the button. For that you should disable animation when testing, or depending on how the animation is being done set an assertion for it to be complete – Thomas Walpole Aug 29 '21 at 19:54

0 Answers0