Testing broken html with casperjs

Question

Testing broken html with casperjs

I am trying to run some installation procedures before running some CasperJs browser tests.

At some point, I can’t fill out the form data, because there is incorrect HTML (the form tag is marked in the table):

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Test</title>
    </head>
    <body>
        <table>
        <form id="test1">
            <input type="text" name="selector_1" />
        </form>
        </table>
    </body>
</html>

This is a simple test case:

casper.test.begin('Test', 0, function suite(test) {

    casper.start('http://localhost:8000', function() {

        this.fill('form#test1', {
            "selector_1": 'Yo!'
        }, true);

    });

    casper.run(function() {
        test.done();
    });

});

Test results: error: Errors encountered while filling form: no field matching names selector "selector_1" in form

This works when I just remove the table tag in this example.

Unfortunately, I cannot change this in the "real world" because the broken HTML from the application I do not have access to the source code.

Can this be solved with CasperJs directly?

I think I could also try to “fix” the HTML by replacing the broken parts. Could this be the only way to make it work?

+4

javascript casperjs

madflow Jan 27 '14 at 12:58

1

heroin · Accepted Answer · 2014-01-27T14:07:13+0000

fillXPath ( 1.1):

casper.test.begin('Test', 0, function suite(test) {

    casper.start('http://127.0.0.1:8020/test_casper/testme.html', function() {
        this.test.assertExists({
            type: 'xpath',
            path: '//*[@name="selector_1"]'
        }, 'the element exists');

        this.fillXPath('form#test1', {
            '//input[@name="selector_1"]': 'Yo!'
        }, true);

    });

    casper.run(function() {
        test.done();
    });

});

Testing broken html with casperjs

More articles: