grunt-autoshot
Advanced tools
Comparing version 0.0.2 to 0.1.0
@@ -36,8 +36,14 @@ /* | ||
path: './test/screenshot', | ||
filename: 'screenshot', | ||
type: 'jpg', | ||
remote: 'http://github.com/', | ||
remote: { | ||
files: [ | ||
{ src: "http://getbootstrap.com", dest: "bootstrap.jpg" }, | ||
{ src: "http://www.google.com", dest: "google.png" } | ||
] | ||
}, | ||
local: { | ||
path: './test/src', | ||
port: 7788 | ||
port: 7788, | ||
files: [ | ||
{ src: "index.html", dest: "screenshot.jpg" } | ||
] | ||
}, | ||
@@ -44,0 +50,0 @@ viewport: [ |
{ | ||
"name": "grunt-autoshot", | ||
"version": "0.0.2", | ||
"version": "0.1.0", | ||
"description": "Create a quick screenshot for your site which could help for document or testing.", | ||
@@ -5,0 +5,0 @@ "homepage": "https://github.com/Ferrari/grunt-autoshot", |
@@ -21,3 +21,3 @@ # grunt-autoshot [![Build Status](https://travis-ci.org/Ferrari/grunt-autoshot.png?branch=master)](https://travis-ci.org/Ferrari/grunt-autoshot) | ||
Final and the most important thing, please make sure [**phantomjs**](http://phantomjs.org/) are in your PATH, cause this plugin use it to generate screenshot, so remember [install](http://phantomjs.org/download.html) first. | ||
Final and the most important thing, please make sure [**phantomjs**](http://phantomjs.org/) are in your PATH, if your windows users, please download the phantomjs zip file and decompress it and don't forget to set the environment variable as phantomjs.exe's path. Cause this plugin use phantomjs to generate screenshot, so remember [install](http://phantomjs.org/download.html) it first. | ||
@@ -29,2 +29,8 @@ ## The "autoshot" task | ||
**Make a big change of config format from 0.1.0**, thanks @danielhusar and @ryanfitzer opinions, in order to support multiple sources and screenshots and follow the [standard format](http://gruntjs.com/configuring-tasks#files) of grunt. | ||
After 0.1.0, filename and screenshot type all define using grunt file format. So please use those format that phantomjs [support](https://github.com/ariya/phantomjs/wiki/Screen-Capture). | ||
There is a [example](https://github.com/Ferrari/grunt-autoshot/blob/master/Gruntfile.js#L32) of new Gruntfile format. | ||
```js | ||
@@ -36,8 +42,16 @@ grunt.initConfig({ | ||
// necessary config | ||
path: '', | ||
filename: '', | ||
type: '', | ||
path: SCREENSHOT_DIRECTORY_PATH, | ||
// optional config, must set either remote or local | ||
remote: '', | ||
local: '', | ||
remote: { | ||
files: [ | ||
{ src: REMOTE_SITE_URL, dest: FILENAME(INCLUDE FILE TYPE) } | ||
] | ||
}, | ||
local: { | ||
path: LOCAL_FILE_PATH, | ||
port: LOCAL_SERVER_PORT, | ||
files: [ | ||
{ src: LOCAL_FILENAME, dest: FILENAME(INCLUDE FILE TYPE) } | ||
] | ||
}, | ||
viewport: [] | ||
@@ -57,24 +71,13 @@ }, | ||
#### options.filename | ||
Type: `String` | ||
Default filename of screenshots. | ||
It will combine with local, remote and viewport. | ||
``` | ||
ex: [local|remote]-{filename}-{viewport} | ||
``` | ||
#### options.type | ||
Type: String | ||
Image type of screenshot. | ||
PhantomJS supports JPEG, PNG, GIF and PDF right now. | ||
#### options.remote | ||
Type: String | ||
The url of target webpage. | ||
New format after 0.1.0, now you have to assign the source url and your screenshot file, include it's format, like following: | ||
```js | ||
remote: { | ||
files: [ | ||
{ src: "http://www.google.com", dest: "google.png" } | ||
] | ||
} | ||
``` | ||
ex: http://www.google.com | ||
``` | ||
@@ -84,7 +87,12 @@ #### options.local | ||
Start a local http server to host your webpage then get the screenshot. There are several config options: | ||
``` | ||
{ | ||
Start a local http server to host your webpage then get the screenshot. | ||
Just like options.remote, you need to assign your local filename and screenshot filename, including it's format. | ||
```js | ||
local: { | ||
path: './dist', // path to directory of the webpage | ||
port: 8080 // port of startup http server | ||
files: [ // local filename and screenshot filename | ||
{ src: "index.html", dest: "screenshot.jpg" } | ||
] | ||
} | ||
@@ -102,3 +110,20 @@ ``` | ||
### Deprecated (Don't support after 0.1.0) | ||
#### options.filename | ||
Type: `String` | ||
Default filename of screenshots. | ||
It will combine with local, remote and viewport. | ||
``` | ||
ex: [local|remote]-{filename}-{viewport} | ||
``` | ||
#### options.type | ||
Type: String | ||
Image type of screenshot. | ||
PhantomJS supports JPEG, PNG, GIF and PDF right now. | ||
## License | ||
Copyright (c) 2013 Ferrari Lee. Licensed under the MIT license. |
@@ -21,4 +21,16 @@ /* | ||
path: __dirname + '/screenshot', | ||
type: 'jpg', | ||
name: 'screenshot', | ||
remote: { | ||
files: [ | ||
{src: "http://www.google.com", dest: "google.jpg"} | ||
] | ||
}, | ||
local: { | ||
path: "./dist", | ||
port: 8080, | ||
files: [ | ||
{src: "index.html", dest: "screenshot.jpg"} | ||
] | ||
}, | ||
//type: 'jpg', | ||
//name: 'screenshot', | ||
viewport: ['1920x1080'] | ||
@@ -30,6 +42,8 @@ }); | ||
var viewport = opts.viewport; | ||
var url = opts.url; | ||
var filename = opts.filename; | ||
//var url = opts.url; | ||
//var filename = opts.filename; | ||
var type = opts.type; | ||
var path = opts.path; | ||
var src = opts.src; | ||
var dest = opts.dest; | ||
@@ -48,4 +62,5 @@ phantom.create(function(err, ph) { | ||
page.set('zoomFactor', 1); | ||
page.open(url, function(err, status) { | ||
var dest = filename + '.' + type; | ||
page.open(src, function(err, status) { | ||
//var dest = filename + '.' + type; | ||
var target = type + '-' + viewport + '-' + dest; | ||
@@ -61,4 +76,4 @@ // Background problem under self-host server | ||
page.render(path + '/' + dest, function() { | ||
grunt.log.writeln('Take a screenshot to ' + dest); | ||
page.render(path + '/' + target, function() { | ||
grunt.log.writeln('Take a screenshot to ' + target); | ||
ph.exit(); | ||
@@ -80,11 +95,17 @@ cb(); | ||
hasRemote = true; | ||
async.eachSeries(options.viewport, function(item, cb) { | ||
screenshot({ | ||
path: options.path, | ||
filename: 'remote-' + options.filename + '-' + item, | ||
type: options.type, | ||
url: options.remote, | ||
viewport: item | ||
async.eachSeries(options.remote.files, function(file, outerCb) { | ||
async.eachSeries(options.viewport, function(view, cb) { | ||
screenshot({ | ||
path: options.path, | ||
//filename: 'remote-' + item.src + '-' + view, | ||
type: "remote", | ||
//url: file.src | ||
viewport: view, | ||
src: file.src, | ||
dest: file.dest | ||
}, function() { | ||
cb(); | ||
}); | ||
}, function() { | ||
cb(); | ||
outerCb(); | ||
}); | ||
@@ -99,20 +120,23 @@ }, function() { | ||
hasLocal = true; | ||
http.createServer( | ||
st({ | ||
path: options.local.path, | ||
index: 'index.html' | ||
}) | ||
).listen(options.local.port, function() { | ||
async.eachSeries(options.viewport, function(item, cb) { | ||
screenshot({ | ||
path: options.path, | ||
filename: 'local-' + options.filename + '-' + item, | ||
type: options.type, | ||
url: 'http://localhost:' + options.local.port, | ||
viewport: item | ||
async.eachSeries(options.local.files, function(file, outerCb) { | ||
var mount = st({path: options.local.path, index: file.src}); | ||
http.createServer(function(req, res) { | ||
mount(req, res); | ||
}).listen(options.local.port, function() { | ||
async.eachSeries(options.viewport, function(view, cb) { | ||
screenshot({ | ||
path: options.path, | ||
//filename: 'local-' + options.filename + '-' + item, | ||
//type: options.type, | ||
//url: 'http://localhost:' + options.local.port, | ||
type: 'local', | ||
viewport: view, | ||
src: 'http://localhost:' + options.local.port + '/' + file.src, | ||
dest: file.dest | ||
}, function() { | ||
cb(); | ||
}); | ||
}, function() { | ||
cb(); | ||
grunt.event.emit('finish', 'local'); | ||
}); | ||
}, function() { | ||
grunt.event.emit('finish', 'local'); | ||
}); | ||
@@ -119,0 +143,0 @@ }); |
@@ -27,10 +27,15 @@ 'use strict'; | ||
default_options: function(test) { | ||
test.expect(1); | ||
test.expect(2); | ||
var local, remote, expected; | ||
var actual = grunt.file.read('test/screenshot/remote-screenshot-1920x1080.jpg'); | ||
var expected = grunt.file.read('test/expected/screenshot.jpg'); | ||
test.equal(actual, expected, 'should generate screenshot of sample site'); | ||
local = grunt.file.read('test/screenshot/local-1920x1080-screenshot.jpg'); | ||
expected = grunt.file.read('test/expected/local.jpg'); | ||
test.equal(local, expected, 'should generate screenshot of sample site at local'); | ||
remote = grunt.file.read('test/screenshot/remote-1920x1080-google.png'); | ||
expected = grunt.file.read('test/expected/remote.png'); | ||
test.equal(remote, expected, 'should generate screenshot of sample site from remote'); | ||
test.done(); | ||
}, | ||
} | ||
}; |
Sorry, the diff of this file is not supported yet
112465
13
263
124