4

The modal inputs sometimes are not filled.

In steps the inputs should be filled and sent in submit, but sometimes one of the inputs (sometimes code, sometimes name) are not filled, and the execution continues with the click_button and empty inputs.

I've tried using the find() with the set(), but the result is the same. I also tried without within() and not worked, give the same result not deterministic.

When I write twice the fill_in() works, for example:

fill_in 'foo_code', :with => code
fill_in 'foo_code', :with => code

Anyone know a better solution than to call twice the fill_in()?

Step:

fill_form_modal(foo[:code], foo[:name])
click_button 'Save'

# features/step_definitions/steps.rb
def fill_form_modal(code, name)
   within "#createModal" do
      expect(page).to have_selector('#foo_code', visible: true)
      fill_in 'foo_code', :with => code
      expect(page).to have_selector('#foo_name', visible: true)
      fill_in 'name_code', :with => name
   end
end

Modal:

<div class="modal fade modal-vcenter pcp in" id="createModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel_createModal" aria-hidden="false" style="display: block;">
   <div class="modal-dialog  modal-dialog-form-xs" role="document">
      <div class="modal-content" z-depth="4" style="margin-top: 270px;">
         <div class="modal-body ">
            <form class="form" action="/workmanships" method="post" id="formId_080499881900748081447698693108">
               <input name="utf8" type="hidden" value="✓">
               <input type="hidden" name="authenticity_token" value="IRouh/Trz">
               <div class="col-sm-12 col-md-12 col-lg-12">
                  <div class="form-group">
                     <input class=" form-control required" type="text" name="workmanship[code]" id="workmanship_code">
                     <label>* Code </label>
                  </div>
               </div>
               <div class="col-sm-12 col-md-12 col-lg-12">
                  <div class="form-group">
                     <input class=" form-control required" type="text" name="workmanship[name]" id="workmanship_name">
                     <label>* Name </label>
                  </div>
               </div>
               <input type="hidden" name="guide" id="guide">
               <div class="modal-actions">
                  <button type="button" formnovalidate="" class="btn ink-reaction btn-default-bright" data-dismiss="modal">Cancel</button>          
                  <button type="submit" formnovalidate="" class="btn ink-reaction btn-success" name="commit"> Save</button>
               </div>
            </form>
         </div>
      </div>
   </div>
</div>

I am using selenium webdriver.

Gustavo S. Vendramini
  • 45
  • 1
  • 5
  • 1
    This may be caused by trying to fill before the animation has finished on the modal -- easiest way to test that is to remove the fade class from the div.modal when in the test environment – Thomas Walpole Nov 16 '15 at 22:03
  • 1
    The other potential issue is if you have any client side javascript validation code that plays with the focus of elements - If so you might need to click on the element before calling fill_in – Thomas Walpole Nov 16 '15 at 22:06
  • Did you find any better solution than filling input field twice? I'm experiencing a similar issue, also in a modal, but it's hard to reproduce it because it happens rarely and let's say randomly. – Ivan Lučev Dec 02 '15 at 17:16
  • I know this is old but found this related issue: https://github.com/teamcapybara/capybara/issues/1890#issuecomment-347848709. Don't have a solution for this but I found adding a sleep call after you click to open the modal helps. I add a 1 second sleep call and my test passes consistently now – Gabriel Jul 31 '19 at 15:34
  • Check this question: https://stackoverflow.com/questions/14488836/trouble-interacting-with-bootstrap-modals-via-capybara-v2 – Fa11enAngel Aug 23 '19 at 09:02

0 Answers0