How can I login to a Angular.io coded site using Nokogiri and Capybara/poltergeist?

111 Views Asked by At

I am trying to login to a site for scraping purposes and it looks like they are using Angular.io. First I tried with Mechanize and logger without success so now I am using Capybara and Nokogiri.

This site's login webpage HTML code is:

<div _ngcontent-yhs-c14="" class="container">
  <div _ngcontent-yhs-c14="" class="row justify-content-center align-items-center">
   <div _ngcontent-yhs-c14="" class="col-md-6 col-sm-11">
    <div _ngcontent-yhs-c14="" class="login-component">
     <h3 _ngcontent-yhs-c14=""><strong _ngcontent-yhs-c14="">Iniciar sesión</strong></h3><!---->
     <form _ngcontent-yhs-c14="" autocomplete="on" id="loginForm" novalidate="" class="ng-pristine ng-invalid ng-touched">
      <div _ngcontent-yhs-c14="" class="form-group">
        <label _ngcontent-yhs-c14="" for="username">Correo electrónico:</label>
        <input _ngcontent-yhs-c14="" class="form-control ng-pristine ng-invalid is-invalid ng-touched" email="" name="user" ngmodel="" required="" type="email">
        <!---->
       <div _ngcontent-yhs-c14="" class="invalid-feedback ng-star-inserted">
          <!---->
          <div _ngcontent-yhs-c14="" class="ng-star-inserted"> El campo requerido. </div>
       </div>
      </div>
      <div _ngcontent-yhs-c14="" class="form-group">
        <label _ngcontent-yhs-c14="" for="pwd">Contraseña:</label>
        <input _ngcontent-yhs-c14="" autocomplete="off" class="form-control ng-untouched ng-pristine ng-invalid" name="pwd" ngmodel="" required="" type="password">
        <!---->
       </div>
      <div _ngcontent-yhs-c14="" class="contenedor_iniciar form-group d-flex ">
        <div _ngcontent-yhs-c14="" class="form-group login-footer">
         <p _ngcontent-yhs-c14="" class="info_accesos">Los datos de acceso son sensibles a mayúsculas y minúsculas.</p>
         <a _ngcontent-yhs-c14="" class="text-center-small btn btn-link p-0 "> ¿Olvidaste tu contraseña? <span _ngcontent-yhs-c14="" class="br"></span> Haga clic aquí para recuperar su acceso. 
         </a>
        </div>
        <input _ngcontent-yhs-c14="" class="btn btn-iniciar" type="submit" value="Ingresar" disabled="">
       </div>
     </form>
     <swal _ngcontent-yhs-c14="" input="email" inputplaceholder="Correo Electronico" title="Recupera tu contraseña" type="info"></swal>
    </div>
   </div>
  </div>
</div>

I went through the "Scraping data with Capybara" tutorial to try and login first, prior to trying to parse and started with this:

require 'nokogiri'
require 'net/http'
require 'capybara/poltergeist'

# get the HTML from the website
uri  = URI("http://letech.mx/login")
body = Net::HTTP.get(uri)

# pry at the bottom so we can play with it
require "pry"
require 'capybara/poltergeist'
binding.pry 

# The object we'll interact with
browser = Capybara.current_session

# Go to a web page (first request will take a bit)
url = "http://letech.mx/login"
browser.visit url

# Save the page locally, and open it (this is what Launchy does) 
browser.save_and_open_page
ls -v browser
browser.current_url

#fill the form with user and password and click on login button.
browser.fill_in 'user', with: '[email protected]'
browser.fill_in 'pwd', with: 'password'
browser.click_on 'Ingresar'

When I do the last command click_on, I get the error:

TypeError: undefined is not an object (evaluating 'e.top')

How do I get past the "login" window so I can start scraping?

0

There are 0 best solutions below