更新的问题:: querySelector可能出现PhantomJS / Javascript问题

时间:2012-05-13 17:43:32

标签: javascript jquery-selectors anchor phantomjs

我正在使用PhantomJS(v1.5)和来自cli的javascript运行测试。该测试在fedora / centos上运行。

该测试说明了从querySelector返回html(type)元素时出现的错误(用户或其他)。

测试了两个项目,第一个是输入,第二个是锚点

id = ICType的输入正常工作 锚返回一个href / content,它不是我期待的htmlAnchorType ..

我希望能够对返回的htmlAnchorElement执行一种foo.click(),然后应该为所选锚点调用href javascript。但是,如果返回的唯一内容是href内容..那么这似乎是一个问题..

纵观网络,还没有想出我做错了什么。

想法/评论????

感谢

running on fedora
 phantomjs  foo.js

foo.js

String.prototype.trim = function() {
    return this.replace(/^\s+|\s+$/g,"");
}

//
var page = require('webpage').create();
var searchUrl = 'https://courses.osu.edu/psc/hcosuct/EMPLOYEE/HRMS/c/COMMUNITY_ACCESS.CLASS_SEARCH.GBL';

page.onConsoleMessage = function(msg) {
    console.log(msg);
};

phantom.loadState = false;

page.onLoadFinished = function(status) { 
    console.log('called with state ' + phantom.loadState);
    if (status !== "success") {
        console.log("Unable to access network");
    } else {
        if (!phantom.loadState) {
            page.evaluate(function() {
                    var aa1;


                    /*
                        we test two items, one is an input, which succeeds, the other is the anchor, 
                    which fails

                        the querySelector should return an element htmlelement(type)..
                        for the ancho, it simply returns the href content... wth!!!
                    */

                    var sub="ICType";
                    var t1 = document.querySelector("[id^='ICType']");

                    console.log(t1);        //<<< this will be htmlelement. which is correct..
                    console.log("after ictype");

                    /*
                        the complete id for the anchor
                        var sub="CLASS_SRCH_WRK2_SSR_PB_SRCH$56$";

                        for testing, use a subset without the $.. doesn't make a difference..
                    */  
                    sub="CLASS_SRCH_WRK2_SSR_PB_SRCH";
                    t1 = document.querySelector("[id^='CLASS_SRCH_WRK2_SSR_PB_SRCH']");

                    console.log(t1);    // <<< this should be htmlelement.. but is the href content.. WHY??????
                    console.log("test complete");

                    /*
                        -- IF the test ever generates the actual/correct htmlelemtent for the anchor
                        --the goal will be to then do a foo.click() to then run/invoke the 
                        --underlying javascript for the anchor/href which is

                            <a class="SSSBUTTON_CONFIRMLINK" 
                        href="javascript:submitAction_win0(document.win0,'CLASS_SRCH_WRK2_SSR_PB_SRCH$56$');" 
                            tabindex="32" id="CLASS_SRCH_WRK2_SSR_PB_SRCH$56$" 
                        name="CLASS_SRCH_WRK2_SSR_PB_SRCH$56$">
                    */

                //window.setTimeout(function () {
                //submitAction_win0(document.win0,'CLASS_SRCH_WRK2_SSR_PB_SRCH$56$');
                //}, 2000);
            });
            phantom.loadState = true;
        } else {
            console.log(page.content);
            phantom.exit();
        }
    }
}

page.open(encodeURI(searchUrl));

1 个答案:

答案 0 :(得分:1)

这可能有点晚了但事实证明,锚点在幻像js中没有click()

修改 这对选择器来说不是问题。选择器实际上正常工作 - 它确实返回元素,而不仅仅是href。 缺少对调用click()函数的响应是规范的一部分...... http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-2651361 <a>标记在调用click时不执行默认行为。

我认为选择器混淆是由于幻像环境中缺少对象检查器的可用性,以及console.log(el)(其中el是<a>标签元素)实际上“帮助“注销href - 给出错误的印象,即选择器只返回了href字符串。

因此,虽然直接调用click()函数不受尊重,但您仍然可以触发锚点的默认onClick事件处理程序,如下所述 - 这被记录为在其他线程,我自己的项目中工作,并在上面的tom代码上进行测试

结束编辑

还有一些关于同一问题的其他帖子,但与其他浏览器相关,例如.. How to simulate a click with JavaScript? - 修复方法是自行复制和粘贴事件......

var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
t1.dispatchEvent(evt);