in reply to WWW::Mechanize::Firefox clicking on a div doesn't work

The last line you tried should work if you wrap it inside of a hash -- assuming there is an event that is triggered by clicking the div you've selected. The WWW::Mechanize::Firefox documentation mentions that you have to use the hash along with the 'dom' key. The example below adds a custom event to ensure that there is an event tied to clicking of the div:

use strict; use warnings; use diagnostics; use feature 'say'; use WWW::Mechanize::Firefox; my $mech = WWW::Mechanize::Firefox->new( autodie => 1 ); # Load up google search $mech->autoclose_tab(0); $mech->get('http://google.ca'); say "Google retrieved" if $mech->success(); # Make sure the bottom line turns red if we successfully click the <di +v> my $str = " var tmp = document.getElementById('prm-pt'); tmp.onclick = function() { this.style.backgroundColor = 'red'; }; "; $mech->eval_in_page( $str ); say "Event set" if $mech->success(); # Type something in the search box $mech->form_id( 'tsf' ); $mech->set_fields( q => 'time' ); # Click the div, the bottom line should turn red my @divs = $mech->xpath('//div[@id="prm-pt"]'); $mech->click( { dom => $divs[0], synchronize => 0 } ); say "<div> clicked" if $mech->success();

Now that I think of it, all that was missing from your first example (with 'xpath' key) was having the parameters wrapped inside of curly brackets {}. Without them, the synchronize key is ignored, and resulted in an infinite wait.

Replies are listed 'Best First'.
Re^2: WWW::Mechanize::Firefox clicking on a div doesn't work
by bbrown25 (Initiate) on Oct 26, 2014 at 21:38 UTC

    Good eye! The {} was it.

    However, although I'm "clicking" on the div now, I'm not getting the result from the browser at all. I'm suspecting that this is a javascript function I need to try and find. But how to do that?

    $pf_mech->eval_in_page('metamorph-392-start()');

    doesnt't work. I get

    MozRepl::RemoteObject: ReferenceError: metamorph is not defined at ./download_hl7.pl line 67.

    I've posted the first part of the html below, for privacy reasons I've had to omit large chunks after that first div but hopefully there is enough here to figure out how to get this click to happen. NB I am following the above example and clicking on the div as present in the DOM.

    <html class="js flexbox canvas canvastext webgl no-touch geolocation p +ostmessage no-websqldatabase indexeddb hashchange history draganddrop + websockets rgba hsla multiplebgs backgroundsize borderimage borderra +dius boxshadow textshadow opacity cssanimations csscolumns cssgradien +ts no-cssreflections csstransforms csstransforms3d csstransitions fon +tface generatedcontent video audio localstorage sessionstorage webwor +kers applicationcache svg inlinesvg smil svgclippaths k-ff k-ff33" la +ng="en"> <head> <body onfocus="setFocus(true)" onblur="setFocus(true)" scroll="no" sty +le=""> <script src="jslibs/extMouseWheel.js" type="text/javascript"> <script src="jslibs/PF_BrowserDetect.js" type="text/javascript"> <script src="jslibs/PF_BrowserWarnings.js" type="text/javascript"> <script src="jslibs/PF_AdManager.js" type="text/javascript"> <script type="text/javascript"> <div id="browser-error" style="display: none;"> <script type="text/javascript"> <div id="divFlexCredentials" class="div" style="height:1px; width:1px; + position:fixed; top: 0px;"> <div id="divFlexEHR" class="div" style="height: 100%; width: 100%; pos +ition: fixed; top: 0px; background: none repeat scroll 0% 0% transpar +ent; display: none;"> <div id="hiddenFrame" style="position:absolute;background-color:transp +arent;border:0px;visibility:hidden;"></div> <script type="text/javascript"> <div id="embermain" class="ember-application"> <div id="clinical"> </div> <div id="ember553" class="ember-view"> <script id="metamorph-1-start" type="text/x-placeholder"> <div id="ember4172" class="ember-view application navigation ad-aware" +> <script id="metamorph-28-start" type="text/x-placeholder"> </script> <div class="left-nav"> <script id="metamorph-29-start" type="text/x-placeholder"> <ul class="menu-list" data-bindattr-12="12"> <script id="metamorph-29-end" type="text/x-placeholder"> <script id="metamorph-95-start" type="text/x-placeholder"> <script id="metamorph-95-end" type="text/x-placeholder"> <script id="metamorph-96-start" type="text/x-placeholder"> <script id="metamorph-96-end" type="text/x-placeholder"> </div> <script id="metamorph-97-start" type="text/x-placeholder"> <div class="navigation-header"> <script id="metamorph-102-start" type="text/x-placeholder"> <script id="metamorph-102-end" type="text/x-placeholder"> <script id="metamorph-97-end" type="text/x-placeholder"> <script id="metamorph-28-end" type="text/x-placeholder"> <div class="pf outlet" data-bindattr-16="16" style="height: 743px;"> <div class="pd-modal"> <script id="metamorph-103-start" type="text/x-placeholder"> <script id="metamorph-103-end" type="text/x-placeholder"> <script id="metamorph-104-start" type="text/x-placeholder"> <script id="metamorph-339-start" type="text/x-placeholder"> <script id="metamorph-341-start" type="text/x-placeholder"> <script id="metamorph-340-start" type="text/x-placeholder"> <script id="metamorph-342-start" type="text/x-placeholder"> <div class="left-nav"> <script id="metamorph-342-end" type="text/x-placeholder"> <div class="billing.reports outlet" data-bindattr-85="85"> <script id="metamorph-369-start" type="text/x-placeholder"> <div id="ember4940" class="ember-view"> <div class="container-fluid superbill-report"> <script id="metamorph-370-start" type="text/x-placeholder"> <div class="ad-header clearfix"> <script id="metamorph-370-end" type="text/x-placeholder"> <div class="row superbill-navigation-bar"> <div id="ember5061" class="ember-view"> <div class="superbill-report-kendo-grid"> <div class="spinner-overlay" style="height: 29px; display: none;"></di +v> <div id="ember5064" class="ember-view superbill-report-grid" style=""> <div class="kendo-grid-container k-grid k-widget k-reorderable" data-r +ole="grid" style=""> <div class="k-grid-header" style="padding-right: 0px;"> <div class="k-grid-content" style="max-height: 473px;"> <table class="k-selectable" role="grid" tabindex="0" data-role="select +able" aria-activedescendant="aria_active_cell"> <colgroup> <tbody role="rowgroup"> <tr class="" role="row" data-uid="cfec809b-e27c-4e5a-a59f-c66c6570fdcc +" aria-selected="false"> <td id="aria_active_cell" class="" role="gridcell"> <div class="col-superbill-id" data-element="table-rows"> <script id="metamorph-392-start" type="text/x-placeholder"> 4C-663-HKXEWHA-E1 <script id="metamorph-392-end" type="text/x-placeholder"> </div> </td>

      Hi there,

      We're venturing into non Perl territory here. What you're seeing are Javascript errors, and really not on topic here. There are other sites to choose from.

      Briefly, you're trying to evaluate an html id, the value of which isn't valid javascript.

      Good luck.

        I understand. Should the WWW:M:F module be able to click through regardless? If I feed it the div and x,y coordinates both shouldn't the javascript fire off without me needing to do an eval_in_page? Thanks for your help.