HuddleEng / PhantomFlow

Describe and visualise user flows through tests with PhantomJS
MIT License
682 stars 60 forks source link

PhantomFlow won't run inside project #39

Closed chris-dura closed 9 years ago

chris-dura commented 9 years ago

Hello! I've previously gotten PhantomCSS integrated into my app, and it works great! I want to explore using PhantomFlow, but I'm having problems getting it integrated. I'm more designer than developer, so my Node and CLI troubleshooting skills are a little pedestrian, and I apologize ahead of time if the solution should be obvious :confused:

Anyway, cloning the repo works fine; however when I try to install PhantomFlow as a module in my project, it doesn't run.

$ cd my-project
$ npm install phantomflow --save-dev

I set up my directories to mirror the demo.

my-project/
|
└── test/
    ├── my-test.js
    |
    └── flows/
        └── hello.test.js

For my-test.js, I used the NodeJS setup example from the documentation.

// my-test.js

var flow = require('../node_modules/phantomflow').init({
    debug: 1,
    // createReport: true,
    // test: 'coffee'
});

// flow.report(); // Show report

flow.run(function(code){
    process.exit(code); // callback is executed when PhantomFlow is complete
});

The example seems considerably less complicated than the test.js file from the demo. That file didn't run either, though, so I figured I'd go with the less complicated version?

The flow is a simple file...

// hello.test.js

(function(){

    /*
        User flows described in one decision tree
    */

    flow("Say hello", function(){
        step("Open mouth", openMouth);
    });

    /*
        Steps
    */

    function openMouth(){
        casper.log('Opening mouth...', 'debug');
    }

}());

But, when I attempt to run the test, I get the following error. Although, it's not really an error, I guess, but the Terminal prompt just sits there and blinks at me :confused:

$ cd my-project/
$ node test/my-test.js
Parallelising 0 test files on 1 threads.
jamescryer commented 9 years ago

Hey, great to hear you're finding PhantomCSS useful.

PhantomFlow expects the test files to have a '.test.js' suffix, so hello.js should be hello.test.js. I'll update the README.

Your file my-test.js can of course be called whatever you want, it's just the entry point. The Demo test.js file is more complicated than the README example because it's parsing CLI arguments and setting up a server to serve the page under test. You'll probably want to do something similar, but it's up to you how you do that.

chris-dura commented 9 years ago

Hey, @jamescryer, thanks! Sorry... it looks as though it might already have been in the documentation to use the *.test.js suffix, I just completely missed it.

However, changing hello.js -> hello.test.js didn't seem to resolve the problem. I still get the same "error". The only other thing I changed from the example was to change the phantomflow require to point to my ../node_modules/phantomflow folder.

jamescryer commented 9 years ago

It's not finding the tests, but It not obvious to me why. To rule out the require, put your my-test.js in the root and require('phantomflow') instead.

The grunt plugin has another init example https://github.com/Huddle/grunt-phantomflow/blob/master/tasks/phantomflow.js.

Let us know if you figure it out.

chris-dura commented 9 years ago

Sorry... I really messed all this up... there was a typo in my real code that I didn't represent in my examples. This thread can probably be completely disregarded.

jamescryer commented 9 years ago

Thanks for letting us know. PhantomFlow needs to surface syntax errors better.