bootstrap modal: Cannot call method 'scrollTop' of undefined

Question

I don't understand why I get the following error: Cannot call method 'scrollTop' of undefined

When I click on the link that displays the modal.

I'm sing jQuery 1.11, bootstrap 3.1.1.

About the code (HAML)

Button that display the modal:

.forgot_password.pull-right = link_to t('.forgot_password'), '#forgot_password', data: { target: "#forgot_password", toggle: "modal" }, tabindex: 5

Modal:

#forgot_password.modal{tabindex: -1, role: 'dialog', "aria-labelledby" => t('.title'), "aria-hidden" => true}
  .modal-dialog
    .modal-content
      .modal-header
        %button.close{"aria-hidden" => "true", "data-dismiss" => "modal", :type => "button"} ×
        %h4= t('.title')
      .modal-body
        .form_wrapper
          .innertxt= t('.explanation')
          .forgot_password_form
            = form_for :forgot_password, url: forgot_password_path do |f|
              = text_field_tag :email, '', placeholder: t('email'), size: 50, autofocus: true
              = submit_tag t('send'), :class => 'btn'

Bootstrap where the issue happens: (method Modal.prototype.show)

this.backdrop(function () {
      var transition = $.support.transition && that.$element.hasClass('fade')

      if (!that.$element.parent().length) {
        that.$element.appendTo(document.body) // don't move modals dom position
      }

      that.$element
        .show()
        .scrollTop(0)
...

Displayed error:

TypeError: 'undefined' is not an object (evaluating 'that.$element
               .show()
               .scrollTop')

I guess that that.element is null or undefined and it breaks the code. But I'm looking for a fix/workaround because it breaks my test spec! (ruby with capybara)

I followed the example on http://getbootstrap.com/javascript/#modals and so far I don't see any difference between their and my code. I tried to use javascript instead of html to open the modal but it's exactly the same.

Any idea?

Edit: Ruby/capybara code

click_link 'Glemt adgangskode?'# Forgotten password?
  sleep 3
  within_frame('form_login') do
    fill_in 'email', with: 'jens@example.com'
    click_button 'Send'
  end

Edit2: By the way, everything works fine, the modal pop-up correctly, I just got a javascript error that doesn't actually affect the usage. But I would like to understand and fix this.

Answer 1

Ok, that was my mistake!

Actually, I overriden the jQuery.show() method few weeks ago and forgot ... a return statement. That's why the scrollTop was actually based on an undefined element!

$(function(){
  /**
   * Override hide function.
   */
  // Store a reference to the original remove method.
  var originalShowMethod = $.fn.show;

  $.fn.show = function(){
    var self = $(this);

    // Remove CSS classes that hide the element.
    self.removeClass('hidden hide invisible');

    // Apply the original method.
    return originalShowMethod.apply(this, arguments);
  }
});

Now it works better! The override allows me to automatically remove CSS classes when I call the show() function to avoid to repeat each time the same stuff! Sorry!