example - Githubissues

chino23 commented 10 years ago

Hi,

thanks for this great library. It seems it'll do what I really need - but I can't say cause I just can't get it to work. The documentation is lacking, unfortunately.

I can start the webserver, but any build attempt just stops with

Failed to compile snapshot. Tried 0 times

That's it. I've tried various changes in the configurations and attempts, nothing.

I'd love to have a bit better documentation, or maybe an example project that shows how it's really done, that would be great! I'd really appreciate it, and I'd love to use this as I do need it :)

Thanks a lot!

miklschmidt commented 10 years ago

Hi,

You're probably right about the documentation. Can you point me in a direction of something you want explained?

As to your problem, can you share the code you're using? If i had to guess, it's probably because you're calling client.build() instead of client.build(5) or however many times you want it to try. It should probably have a sensible default or yell at you for not providing a try count :)

chino23 commented 10 years ago

Hi,

thanks a lot for replying! Sorry I was out over the weekend, otherwise I would have replied earlier!

So, first of all I installed it by using

npm install nw-snapshot

After that, I can do

npm start nw-snapshot

and it tells me

Starting socket on port 3001
Starting http server on port 3301

So far, so good :)

Now, I'm not exactly sure how to go from here. I tried to use the buildscript that you have posted on the mainpage, and there it already calls client.build(5)

I have then put the js file in the directory there, which should get snapshotted, as well as the app directory, which is zipped and renamed to app.nw. I've tried a normal zip, doesn't change.

I've tried to set up the following:

var exec = require('child_process').exec;
var NodeWebkitDownloader = require('nw-snapshot').Downloader;
var gulp = require('gulp');
var gutil = require('gulp-util');

// Connect to tcp://127.0.0.1:3001
gulp.task('nwbuild', function(callback){
    SnapshotClient = require('nw-snapshot').Client;
    var client = new SnapshotClient("0.9.2", './app.nw', './all3-nomoment.js');
client.connect(3001, function(){
    client.on('done', function(snapshot){
        require('fs').writeFileSync(require('path').join(__dirname, 'snapshot.bin'), snapshot);
    });
    client.on('progress', function(err, iteration) {
        // Will run each time an iteration has failed.
        console.log("Iteration #" + iteration + " failed: " + err);
    });
    client.on('fail', function(err, tries){
        console.log("Failed to compile snapshot. Tried " + tries + " times.");
    });
    // Run a maximum of 5 iterations.
    client.build(5);
});

});

Then I try to run it with

gulp nwbuild

and it stops with

[17:45:57] Using gulpfile ~/Downloads/node-nw-snapshot-test/gulpfile.js
[17:45:57] Starting 'nwbuild'...
Failed to compile snapshot. Tried 0 times.

I really think my gulpfile is messed up. But to be honest, I don't really understand the whole setup how to call what and where to put options, how to prepare the files and everything.

I also tried to implement the code you've mentioned under 'cool stuff' on the bottom of the page, but it either says it can't find the corresponding binary and if I put it there manually, it just deletes it and does nothing.

I don't really know where to start :) I would just love to use that somehow, so I'd be really grateful for some tutorial, example project or more detailed documentation.

Thanks a lot!

miklschmidt commented 10 years ago

I see, that should actually work. I'll take a look at it when i get home (at work currently), and provide a more detailed guide for you :)

Med venlig hilsen / Best regards. Mikkel Schmidt Founder Circadio http://getcircadio.com

Github: http://github.com/miklschmidt http://twitter.com/miklschmidt Twitter: http://twitter.com/miklschmidt LinkedIn: http://dk.linkedin.com/in/misc88

2014-11-10 10:49 GMT+01:00 chino23 notifications@github.com:

Hi,

thanks a lot for replying! Sorry I was out over the weekend, otherwise I would have replied earlier!

So, first of all I installed it by using

npm install nw-snapshot

After that, I can do

npm start nw-snapshot

and it tells me

Starting socket on port 3001 Starting http server on port 3301

So far, so good :)

Now, I'm not exactly sure how to go from here. I tried to use the buildscript that you have posted on the mainpage, and there it already calls client.build(5)

I have then put the js file in the directory there, which should get snapshotted, as well as the app directory, which is zipped and renamed to app.nw. I've tried a normal zip, doesn't change.

I've tried to set up the following:

var exec = require('child_process').exec; var NodeWebkitDownloader = require('nw-snapshot').Downloader; var gulp = require('gulp'); var gutil = require('gulp-util');

// Connect to tcp://127.0.0.1:3001 gulp.task('nwbuild', function(callback){ SnapshotClient = require('nw-snapshot').Client; var client = new SnapshotClient("0.9.2", './app.nw', './all3-nomoment.js'); client.connect(3001, function(){ client.on('done', function(snapshot){ require('fs').writeFileSync(require('path').join(__dirname, 'snapshot.bin'), snapshot); }); client.on('progress', function(err, iteration) { // Will run each time an iteration has failed. console.log("Iteration #" + iteration + " failed: " + err); }); client.on('fail', function(err, tries){ console.log("Failed to compile snapshot. Tried " + tries + " times."); }); // Run a maximum of 5 iterations. client.build(5); });

});

Then I try to run it with

gulp nwbuild

and it stops with

[17:45:57] Using gulpfile ~/Downloads/node-nw-snapshot-test/gulpfile.js [17:45:57] Starting 'nwbuild'... Failed to compile snapshot. Tried 0 times.

I really think my gulpfile is messed up. But to be honest, I don't really understand the whole setup how to call what and where to put options, how to prepare the files and everything.

I also tried to implement the code you've mentioned under 'cool stuff' on the bottom of the page, but it either says it can't find the corresponding binary and if I put it there manually, it just deletes it and does nothing.

I don't really know where to start :) I would just love to use that somehow, so I'd be really grateful for some tutorial, example project or more detailed documentation.

Thanks a lot!

— Reply to this email directly or view it on GitHub https://github.com/miklschmidt/node-nw-snapshot/issues/4#issuecomment-62361996 .

chino23 commented 10 years ago

Thanks Mikkel, that would be great :)

miklschmidt commented 10 years ago

Hey @chino23, i just ran the tests and it seems they've changed where the files are located on s3/dl.node-webkit.org (again), so the downloader fails for versions > 0.8.0. It's probably what you're experiencing. I've published 0.1.3 to npm, can you try updating and see if that helped?

As far as i can tell your code is correct, it's the tool that needs improving, docs alone won't do it, so i'll focus on fixing the kinks and then i'll throw together some better docs :)

chino23 commented 10 years ago

Hi @miklschmidt, Thanks for the quick fix.

I've just updated to 0.1.3, then started the server again, and used the same gulpfile as posted above.

It didn't stop immediately as before, but it downloaded the OSX package into the folder, and extracted it. But then the server threw the following error:

fs.js:427
  return binding.open(pathModule._makeLong(path), stringToFlags(flags), mode);
                 ^
Error: ENOENT, no such file or directory '/Users/CDA/Downloads/node-nw-snapshot-test/node_modules/nw-snapshot/tmp/1415679154151/src/package.json'
    at Object.fs.openSync (fs.js:427:18)
    at Object.fs.readFileSync (fs.js:284:15)
    at Object.<anonymous> (/Users/CDA/Downloads/node-nw-snapshot-test/node_modules/nw-snapshot/lib/snapshot.js:135:43)
    at fire (/Users/CDA/Downloads/node-nw-snapshot-test/node_modules/nw-snapshot/node_modules/jquery-deferred/lib/jquery-callbacks.js:78:30)
    at Object.self.fireWith [as resolveWith] (/Users/CDA/Downloads/node-nw-snapshot-test/node_modules/nw-snapshot/node_modules/jquery-deferred/lib/jquery-callbacks.js:188:7)
    at /Users/CDA/Downloads/node-nw-snapshot-test/node_modules/nw-snapshot/lib/utils.js:56:34
    at ChildProcess.exithandler (child_process.js:635:7)
    at ChildProcess.EventEmitter.emit (events.js:98:17)
    at maybeClose (child_process.js:743:16)
    at Socket.<anonymous> (child_process.js:956:11)

npm ERR! nw-snapshot@0.1.3 start: `node server.js`
npm ERR! Exit status 8
npm ERR! 
npm ERR! Failed at the nw-snapshot@0.1.3 start script.
npm ERR! This is most likely a problem with the nw-snapshot package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node server.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls nw-snapshot
npm ERR! There is likely additional logging output above.
npm ERR! System Darwin 14.0.0
npm ERR! command "node" "/usr/local/bin/npm" "start" "nw-snapshot"
npm ERR! cwd /Users/CDA/Downloads/node-nw-snapshot-test
npm ERR! node -v v0.10.26
npm ERR! npm -v 1.4.3
npm ERR! code ELIFECYCLE
npm ERR! 
npm ERR! Additional logging details can be found in:
npm ERR!     /Users/CDA/Downloads/node-nw-snapshot-test/npm-debug.log
npm ERR! not ok code 0

So what happens is it takes the app.nw, and extracts it into the src folder. But then it can't find the package.json.

The package.json is actually there, but not in

/Users/CDA/Downloads/node-nw-snapshot-test/node_modules/nw-snapshot/tmp/1415679154151/src/

but in

/Users/CDA/Downloads/node-nw-snapshot-test/node_modules/nw-snapshot/tmp/1415679154151/src/app

The src folder has the app.zip and the unzipped app folder, where the package.json can be found. seems he's looking for it a folder too early :) Or am I doing something wrong? The package.json is inside my app.nw on the root level and just contains

{
  "name": "nw-demo",
  "main": "index.html"
}

as a test. I usually zip the app folder, but I've even tried to zip the files inside the app folder all together but same result.

miklschmidt commented 10 years ago

Ah, your package.json and the rest of your code should be at the root of the zip. It should be the .nw file that you use to launch node-webkit with. That's why it fails. Check the zip file in here: https://github.com/miklschmidt/node-nw-snapshot/tree/master/test/fixtures

From the docs:

appSource should be either a Buffer of, or the path to, your application zip (app.nw) without the code for > the snapshot

application zip = app.nw Maybe i should clearify that.

chino23 commented 10 years ago

Oh, stupid me :) I thought I've done that but I did it in MAC using Path Finder and it automatically adds it in a root folder. Terminal did the trick.

So, I tried it and it did run, great. Well, technically all builds fail but that's a problem with my js, not the test.

Many thanks for that, I will do some heavy testing of builds to get it running. I really appreciate it!

Some questions:

I've tested a lot before and found that every single version of node-webkit has massively different nw-snapshot tools. Some seem to work much better than others. Do you have any recommendation on what to use and what to avoid?
My script gets quite large, and using AngularJS. I include all the vendor scripts first in the HTML and then call the function of the compiled JS passing (angular) as an argument, then the JS says function x (angular) {...}. Seems to work but I seem to run into problems sometimes with lodash, or momentJS who have a global object and can't be accessed. Did you experience something similar?
When I build for MAC, I should run this thing on MAC, and when I build for linux, I should run this script on linux, correct?

Thanks again Mikkel, looking forward to big testing the next days! :) I'll let you know if I run into problems.

miklschmidt commented 10 years ago

Good to hear!

1) the 0.6.x versions seem to be pretty stable, anything above that and you'll have a ~50% chance of generating a working snapshot. That's exactly why this tool exists, so you can use the latest version and make sure that your snapshots are working. 2) Pass window in to your function, so function x (window, angular) { ... }; x(window, angular); that should do it. 3) What i do is set up virtual machines for each of the platforms, forward the ports from the host machine to the virtual machines npm install nw-snapshot and then just do npm start nw-snapshot in each of them. Then you can connect to the servers from your build script, and generate the snapshots you need :)

chino23 commented 10 years ago

The virtual machine option is a good idea. I'll try that once I've got it all working on the mac :) Thanks

chino23 commented 10 years ago

I've run into a weird error.

Even though the snapshot works, it says it doesn't.

[13:45:38] Using gulpfile ~/Downloads/node-nw-snapshot-test/gulpfile.js
[13:45:38] Starting 'nwbuild'...
Iteration #1 failed: Error: Timeout in testing after 10000ms.
Iteration #2 failed: Error: Timeout in testing after 10000ms.
Iteration #3 failed: Error: Timeout in testing after 10000ms.
Iteration #4 failed: Error: Timeout in testing after 10000ms.
Iteration #5 failed: Error: Timeout in testing after 10000ms.
Failed to compile snapshot. Tried 5 times.

What I did was I used the phonecat tutorial from the angularjs.org website, concatenated all the JS files into one, wrapped it around a

function startApp(angular){
...
}

and then called the startApp(angular) from outside.

It works without a snapshot, and it works when I do the snapshot manually and try it out.

Even when I run the gulpfile, the iterations start, and the webkit comes up and shows the working version, but it just waits 10 seconds and says it fails. It seems the checking function is not appended somehow.

Or am I missing something to include?

Thanks :)

miklschmidt commented 10 years ago

You're probably missing this:

<script>
if (typeof __buildcallbackWrapper === 'function') __buildcallbackWrapper();
</script>

it's in the docs under "usage".

chino23 commented 10 years ago

Ah I thought I've seen that somewhere, that's right. I put it in and it worked.

However, first I thought it didnt. Because, the app only throws errors when it doesn't work, but when the first snapshot works, it just opens up the webkit, then closes it quickly and that's it. Silently in the background the snapshot is saved to the directory, but no success message, no termination of the script.

First of all, thanks, I'm happy that works, it's great :) Finally, it feels good, hehe.

So those things here are just a suggestion to make it more user friendly, especially for new users:

The script never seems to terminate. Whether it all fails or succeeds, it just sits there.
The success never shows a message. Maybe something like "success [...] snapshot.bin has been created"
it would be awesome if the script automatically could add the snapshot.bin to the app.nw file and adjust the package.json to add the "snapshot": "snapshot.bin"
even better would be if that thing would be put into the webkit executable file, and maybe then the executable would be saved as a copy named node-webkit-osx/win/linux32-version-final or something. That would be really sweet.

On a side note: I figured that when using a snapshot on OSX, it never works when the app folder is zipped into the app.nw. But when I take the folder and just rename it to app.nw it works (uncompressed). Is that normal?

Anyway, thanks a lot Mikkel!! Now that I've got the system up and running with the tutorial I'll try to figure out why my bigger project doesn't compile.

miklschmidt commented 10 years ago

Good to hear you got it working :)

1) Client.disconnect() should do it, i'll add it to the usage section. 2) If you want a success message, put it in Client.on('done', function(snapshot){}). I'll add it to the example in the usage section. 3) It already does this. 4) IMO that should really be handled in your buildscript. It's out of scope with this project.

As to your .zip problem, i think it's just your zip structure. All the files have to be at the root of the zip. You can't have a zip containing an app/ folder where all your files are located. I always zip my app.nw (without compression ofcourse).

chino23 commented 10 years ago

1) Tried that, works well. Thanks! 2) This did the job too, cool :) 3) If I understand correctly, it only does it in the temp folder, then runs it and if it works, cleans it up again (deletes it). I was thinking of having the actual app.nw or app-snapshot.nw with the snapshot inside and the updated package.json to the disposal after the compile finished. :) 4) yeah, you're right. That could and should be handled in the buildscript.

Got it working now that it disconnects and tells me the success, and it's pretty cool. Now just got to get the damn thing working with all my factories, where momentJS and lodash are a it of a bitch, but I'll get there :)

miklschmidt commented 10 years ago

Oh so you'd like it to return the complete snapshotted working version of app.nw? That makes sense.

I would recommend using a module loader for reducing the dependency headaches, i use require.js myselt, but i've heard it doesn't play nicely with angular, so maybe that's a bad idea. Anyway good luck with it man :)

chino23 commented 10 years ago

Yes, the complete snapshotted app.nw would be great, is that possible?

I've tried working with requireJS, but it's kind of a pain to implement it with Angular especially once you have quite a big project set up and have to implement it then. But well, I'll figure it out somehow, still testing :)

Thanks a lot again! This tool is just great!

miklschmidt commented 10 years ago

I don't see why not, could you maybe open another issue with that in the title? Then i'll close this one and take a stab at it when i get the chance :)

You could use browserify/webpack or something else based on CommonJS, might be easier to deal with. You're welcome, and thanks for the kind words :)

miklschmidt / node-nw-snapshot

example #4