CODEWITHSUNDEEP
javascriptcasperjs
chapter3
chapter3

Reputation: 984

Read a local HTML file from CasperJS start()

I am writing a simple casperjs script to fill a rather complex form on a website. The HTML code of the website is a bit messy and I don't want to go through the navigation steps to reach the page everytime when I am testing my script.

I have the form page saved as HTML file but I couldn't even properly load a testing HTML file into casperjs. Here is the code, file and result:

var casper = require('casper').create();

casper.start('file://test.html').then(function() {
    this.echo('started')
    this.echo(this.getPageContent())
});

casper.run(function(){
    this.echo('ended');
    casper.done();
});

The test file:

<html>
    <head>
        <meta charset="utf-8">
        <title>My page</title>
    </head>
    <body>
        <h1 class="page-title">Hello</h1>
        <ul>
            <li>one</li>
            <li>two</li>
            <li>three</li>
        </ul>
       <footer><p>2012 myself</p></footer>
    </body>
</html>

The execution result:

C:>started
<html><head></head><body></body></html>
ended

Why the tags within the HTML body are gone?

Upvotes: 3

Views: 1293

Answers (3)

George
George

Reputation: 1

You can make use of the fs module to get the absolute path of the working directory, and then concatenate the protocol "file://" and the relativePath.

E.g.

const fs = require('fs');
var casper = require('casper').create();

// your casper logic here
console.log(getAbsoluteFilePath('test.html'));

casper.run();

function getAbsoluteFilePath(relativePath) {
  return "file://" + fs.workingDirectory + '/' + relativePath;
};

Upvotes: 0

paulroho
paulroho

Reputation: 1266

FYI, you can use these functions to get an absolute file uri for a relative one: 

function getAbsoluteFilePath(relativePath) {
  return "file:///" + currentDir() + relativePath;
};

// Courtesy https://github.com/casperjs/casperjs/issues/141
function currentDir() {
  var sep = "/";
  var pathParts = fs.absolute(casper.test.currentTestFile).split(sep);
  pathParts.pop();

  return pathParts.join(sep) + sep;
}

To use that in your scenario, use this:

// ...
casper.start(getAbsoluteFilePath('test.html')).then(function() {
    this.echo('started')
    this.echo(this.getPageContent())
});
// ...

Upvotes: 1

user4535610
user4535610

Reputation:

All works fine, with an absolute path:

var casper = require('casper').create();
casper.start('file:///home/root2/pjs/test.html').then(function() {
    this.echo('started')
    this.echo(this.getPageContent())
});

casper.run(function(){
    this.echo('ended');
    casper.done();
});

The execution result:

started
<html><head>
        <meta charset="utf-8">
        <title>My page</title>
    </head>
    <body>
        <h1 class="page-title">Hello</h1>
        <ul>
            <li>one</li>
            <li>two</li>
            <li>three</li>
        </ul>
       <footer><p>2012 myself</p></footer>


</body></html>
ended

You can also try to specify an absolute path like this:

file:///C://Full/Path/To/test.html

Upvotes: 3

Related Questions