A suggestion I may simply achieve myself.

Please ping me when you want me to hurry up on doing this ;)

I am facing some problems in using the chrome extension. Firstly not all my events are getting recorded, like the clicks, hrefs for links, and many a times its shows me the few lines and it never reaches to a state to generate the run functions.

Secondly the other issue is, its has casper.start but with casperjs test, instantiating a new env is not required so I think, this can be removed.

Also, I plan to use this with SpookyJs so that I can drive with Node, and it generates codes with selectXpath, which I think isnt available yet in Spooky. bug filed in spooky, so is there any work around for that.

Hello,

any chance this will get updated to work with the latest casperjs (1.1.0-beta3) ?

Would be awesome.

• Click resurrectio icon in Chrome
• Type a URL, for example a document in docs.google.com
• Click Go
• Press Return to dismiss the alert
• Click stop recording
• click export CasperJS
• Close the tab with the export code
• Repeat the steps above quickly without refreshing the page or pausing

Sometimes (about 10% of the time) this produces mangled code because the .start() call is missing. This is easier to reproduce with cache cleared, on sites with a heavy amount of javascript running, after following the steps above more than once in a row.

See snippet below for an example of a mangled export

//==============================================================================
// Casper generated Mon Mar 17 2014 16:27:11 GMT-0400 (Eastern Daylight Time)
//==============================================================================

var x = require('casper').selectXPath;

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

We need to keep selectors as simple and efficient as possible.
For a or input elements, it is quite correct (using name, ids, text, etc.) but for other elements we need to produce a clean selector.
For instance, we will prefer:
.main .search
rather than
div:nth-child(5) div.main div span div.search

I ran casperjs test exported_from_resurrectio.js

Using CasperJS 1.1.0-beta3, PhantomJS 1.9.6

in the code wherever i've filled forms there is just :
/* submit form */

maybe i've overread something in the docs or it is my fault?
thanks for your great work! 👍

I'm using OSX 10.8.5 and Chrome. I'm not sure if that matters. What it looks like is that the string I'm trying to search is accidently having the " or ' escaped. It's outputing \'HELLO! Canada: Daily news- Celebrity, fashion and beauty\' instead of `'HELLO! Canada: Daily news- Celebrity, fashion and beauty'``

Any ideas?

/*==============================================================================*/
/* Casper generated Mon Sep 08 2014 22:02:53 GMT-0600 (MDT) */
/*==============================================================================*/

var x = require('casper').selectXPath;
casper.options.viewportSize = {width: 1381, height: 806};
casper.on('page.error', function(msg, trace) {
   this.echo('Error: ' + msg, 'ERROR');
   for(var i=0; i<trace.length; i++) {
       var step = trace[i];
       this.echo('   ' + step.file + ' (line ' + step.line + ')', 'ERROR');
   }
});
casper.test.begin('Resurrectio test', function(test) {
   casper.start('http://google.com');
   casper.waitForSelector("form[name=gbqf] input[name='q']",
       function success() {
           test.assertExists("form[name=gbqf] input[name='q']");
           this.click("form[name=gbqf] input[name='q']");
       },
       function fail() {
           test.assertExists("form[name=gbqf] input[name='q']");
   });
   casper.waitForSelector("input[name='q']",
       function success() {
           this.sendKeys("input[name='q']", "Hello");
       },
       function fail() {
           test.assertExists("input[name='q']");
   });
   casper.waitForSelector(x("//*[contains(text(), \'HELLO! Canada: Daily news- Celebrity, fashion and beauty\')]"),
       function success() {
           test.assertExists(x("//*[contains(text(), \'HELLO! Canada: Daily news- Celebrity, fashion and beauty\')]"));
         },
       function fail() {
           test.assertExists(x("//*[contains(text(), \'HELLO! Canada: Daily news- Celebrity, fashion and beauty\')]"));
   });

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

I was able to narrow down where the issue is.

The function:

CasperRenderer.prototype.pyrepr = function(text, escape) {
  // todo: handle non--strings & quoting
  var s =  "'" + text + "'";
  //if(escape) s = s.replace(/(['"])/g, "\\$1");
  return s;
}

the if(escape) seems to be firing true all the time. by commenting it out the strings worked properly.

Tried it on a site that has a lot of frames (one of those dinosaurs..), and it didn't work.

cross-tested it with w3schools (sorry) frameset tutorial "try it yourself", and it didn't work aswell.

test http://jsbin.com/ifuma#noedit

result:

//==============================================================================
// Casper generated Wed Apr 02 2014 15:19:54 GMT+0800 (CST)
//==============================================================================

var x = require('casper').selectXPath;
casper.options.viewportSize = {width: 1366, height: 650};
casper.test.begin('Resurrectio test', function(test) {
   casper.start('http://jsbin.com/ifuma#noedit');

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

suport drag and drop event ??
Thanks

I had a website with a website:
<form value=" space" ....>

So the first space was ignored by the recorder, after manually adding the space I was able to run the script..

form[name=aspnetForm] input[type=button][value=' space']

First of all thanks for this, it will speed up a lot my dev time!
I'm trying to install this on Ubuntu 12.04 with Google Chrome 19.0.1084.52, after having enabled dev mode I get the following error message

Could not load extension from '/home/user/resurrectio'. 
Feature 'background_page' is not accessible. 
Requires manifest version of 1 or lower.

If I go into manifest.json and change manifest_version from 2 to 1 everything works fine, is this just an issue of my setup?

hello
thanks for this code it's helpful
i tried to run it and got a login to western-union and save headers on a output text file .but i have a problem to run it .

here my code

var x = require('casper').selectXPath;
casper.options.verbose = true;
casper.options.logLevel = 'debug';
casper.options.userAgent = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.4 (KHTML, like Gecko) Chrome/22.0.1229.94 Safari/537.4';
casper.options.viewportSize = {width: 1366, height: 648};
casper.on('page.error', function(msg, trace) {
   this.echo('Error: ' + msg, 'ERROR');
   for(var i=0; i<trace.length; i++) {
       var step = trace[i];
       this.echo('   ' + step.file + ' (line ' + step.line + ')', 'ERROR');
   }
});
casper.test.begin('Resurrectio test', function(test) {
   casper.start('https://www.westernunion.com/fr/fr/home.html');
   casper.waitForSelector(x("//a[normalize-space(text())='Se connecter']"),
       function success() {
           test.assertExists(x("//a[normalize-space(text())='Se connecter']"));
           this.click(x("//a[normalize-space(text())='Se connecter']"));
       },
       function fail() {
           test.assertExists(x("//a[normalize-space(text())='Se connecter']"));
   });
   casper.waitForSelector("form[name=registrnForm] input[name='txtEmailAddr']",
       function success() {
           test.assertExists("form[name=registrnForm] input[name='txtEmailAddr']");
           this.click("form[name=registrnForm] input[name='txtEmailAddr']");
       },
       function fail() {
           test.assertExists("form[name=registrnForm] input[name='txtEmailAddr']");
   });
   casper.waitForSelector("input[name='txtEmailAddr']",
       function success() {
           this.sendKeys("input[name='txtEmailAddr']", "[email protected]");
       },
       function fail() {
           test.assertExists("input[name='txtEmailAddr']");
   });
   casper.waitForSelector("form[name=registrnForm] input[name='txtKey']",
       function success() {
           test.assertExists("form[name=registrnForm] input[name='txtKey']");
           this.click("form[name=registrnForm] input[name='txtKey']");
       },
       function fail() {
           test.assertExists("form[name=registrnForm] input[name='txtKey']");
   });
   casper.waitForSelector("input[name='txtKey']",
       function success() {
           this.sendKeys("input[name='txtKey']", "tatattctaoc");
       },
       function fail() {
           test.assertExists("input[name='txtKey']");
   });
   casper.waitForSelector("form[name=registrnForm] button#btn-do-login",
       function success() {
           test.assertExists("form[name=registrnForm] button#btn-do-login");
           this.click("form[name=registrnForm] button#btn-do-login");
       },
       function fail() {
           test.assertExists("form[name=registrnForm] button#btn-do-login");
   });
   casper.then(function() {
    casper.waitWhileSelector(x("//*[@id='notification-message']"));
  });
//========  /* GET_SCREEN */ ==========
casper.then(function(){
    console.log("Make a screenshot and save it as AfterLogin.png");
casper.waitWhileSelector(x("//*[@id='notification-message']"));
    this.capture('AfterLogin.png');
});
//========  /* HEADERS */ ==========
casper.then(function dumpHeaders(){
  console.log("getting headers");
	this.currentResponse.headers.forEach(function(header){
    console.log(header.name +': '+ header.value);
  })
})
//========  /* submit form */ ==========

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

any help ?

See this jsfiddle: http://fiddle.jshell.net/uTatY/1/show/light/

• Click resurrectio icon in Chrome
• Click Go
• Right click on the text, then click Check Link Text
• Click resurrectio icon in Chrome
• Click Stop Recording
• Click Export CasperJS

Notice that the script produces invalid xpath:

//==============================================================================
// Casper generated Mon Mar 17 2014 15:44:00 GMT-0400 (Eastern Daylight Time)
//==============================================================================

var x = require('casper').selectXPath;
casper.options.viewportSize = {width: 1366, height: 383};
casper.test.begin('Resurrectio test', function(test) {
   casper.start('http://fiddle.jshell.net/uTatY/1/show/light/');
   casper.waitForSelector(x("//*[normalize-space(text())=\'a\'b\']"),
       function success() {
           test.assertExists(x("//*[normalize-space(text())=\'a\'b\']"));
         },
       function fail() {
           test.assertExists(x("//*[normalize-space(text())=\'a\'b\']"));
   });

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

I tried resurrectio to my app but it doesn't works because my app has many async and time baesd event like animation.

I feel resurrectio has great possibility for testing. If I had enough time, I will implement it for us.

Support recording across multiple windows or windows or popup spawn by current recording pages.

Uses case are such login with Open ID, Facebook Connect, etc. Example: http://www.99bugs.com/testing-facebook-connect-with-casperjs/

When I enter the url and click on a button I got this error :

Refused to execute inline script because it violates the following Content Security Policy directive: 
"script-src 'self' chrome-extension-resource:".

I'm using Chrome 21.0.1155.2 dev-m on Windows XP.

I am facing the following problem:

1. start recording on any web page with a text field.
2. enter "somethinK" in the text field.
3. user backspace to delete character "k"
4. enter "g"
5. stop recording & generate a casper.js test file

When executing this test "somethinKg" will be sent to the text field. Wouldn't it be better to simply use the "onchange" event (instead of the "onkeypress" event) to figure out what has to be send to the text field?

recorder.js:380 Uncaught TypeError: element.className.trim is not a function
at TestRecorder.ElementInfo.getCleanCSSSelector (recorder.js:380)
at new TestRecorder.ElementInfo (recorder.js:304)
at new TestRecorder.MouseEvent (recorder.js:456)
at TestRecorder.Recorder.clickaction (recorder.js:902)
at TestRecorder.Recorder.onclick (recorder.js:1033)

(SVG classname is not String but SVGAnimatedString)

Running a test fails:

$ phantomjs --version
1.5.0
$ casperjs --version
0.6.10
$ casperjs ~/tmp/mytest.js
FAIL CasperError: Casper not started; please use Casper#start
#    type: uncaughtError
#    error: "CasperError: Casper not started; please use Casper#start"
CasperError: Casper not started; please use Casper#start
  /home/jean/repos/git/casperjs:1003 in then
  /home/jean/tmp/mytest.js:7
  /home/jean/repos/git/casperjs/bin/bootstrap.js:271 in initCasperCli
  /home/jean/repos/git/casperjs/bin/bootstrap.js:284

I don't know if this is true for all .aspx sites but I found one in which I could not get resurrectio to record any clicks, button/link presses, etc. It was like it saw no site at all. I then tried using pure casperjs and got the same result: all pages leading up to the .aspx page worked fine and then suddenly none of the selector functions detected anything.

It wasn't implemented, so quick work around in casper.js:

• uncomment: d[EventTypes.Change] = "change";
• add function:

CasperRenderer.prototype.change = function(item) {
var tag = item.info.tagName.toLowerCase();
if(tag=='select') {
var selector;
selector = this.getFormSelector(item) + this.getControl(item);
selector = '"' + selector + '"';
this.stmt('casper.waitForSelector('+ selector + ',');
this.stmt(' function success() {');
this.stmt(' test.assertExists('+ selector + ');');
this.stmt(' this.evaluate(function(valueOptionSelect){');
this.stmt(' $('+ selector +').val(valueOptionSelect);');
this.stmt(' $('+ selector +').trigger("change");');
this.stmt(' },"'+ item.info.value +'");');
this.stmt(' },');
this.stmt(' function fail() {');
this.stmt(' test.assertExists(' + selector + ');')
this.stmt('});');
}
}

I'm getting the following when trying to capture a text:

recorder.js:376 (Anonyme Funktion)

Uncaught SyntaxError: Failed to execute 'querySelectorAll' on 'Document': '#Jsonary.0eVq5.316' is not a valid selector.

Any Ideas on this?

Hi,

we use casperjs for our web tests and i have tried to record some basic scripts with resurrectio. But on our web pages nothing was recorded. I started to reduce the page content to figure out what the problem is. I thing the problem is located in the bootstrap-dropdown.js lib. I will attach a zip (png just rename) with 2 files as test case. The html page and the bootstrap script. I disable the bootstrap script and record everything will work and the click to the button is recorder. But with the bootstrap script no click is recorded.

Hi ,

I begin a new projet that replay phantomJS script and soon also CasperJS script :
https://github.com/jefleponot/ectoplasm

Do you think we could together merge our 2 projects ?

Best Regards,
Jef

It may be a good idea to use MutationObserver API to record user operations.
https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

The casper output when right clicking on a select and asking the extension to assert the current option gives the incorrect xpath.

I have a project I'm working on where I dev locally and deploy to an address behind a firewall. I've noticed that this script works for public sites, but won't capture anything for my project, in either location.

Tips on getting it to work?

Hi,

can we get a function that says something like

rmb on link
use link

so that the elements existence is checked, the href must match and then a mouse-click of the element?

Cheers