diff --git a/.gitignore b/.gitignore index ad46b30..71aa1cf 100644 --- a/.gitignore +++ b/.gitignore @@ -59,3 +59,6 @@ typings/ # next.js build output .next + +#webstorm +.idea diff --git a/README.md b/README.md index f254ac3..b727866 100644 --- a/README.md +++ b/README.md @@ -72,13 +72,13 @@ It is exactly same as `seeVisualDiff` function, only an additional `selector` CS Third one is the `screenshotElement` which basically takes screenshot of the element. Selector for the element must be provided. It saves the image in the output directory as mentioned in the config folder. This method only works with puppeteer. -``` +```js I.screenshotElement("selectorForElement", "nameForImage"); ``` Finally to use the helper in your test, you can write something like this: -``` +```js Feature('to verify monitoried Remote Db instances'); Scenario('Open the System Overview Dashboard', async (I, adminPage, loginPage) => { @@ -102,6 +102,32 @@ Scenario('Compare CPU Usage Images', async (I) => { }); ``` +AWS S3 support to upload and download various images is also provided. +It can be used by adding the *aws* code inside `"ResembleHelper"` in the `"helpers"` section in config file. The final result should look like: +```json +{ + "helpers": { + "ResembleHelper" : { + "require": "codeceptjs-resemblehelper", + "screenshotFolder" : "", + "baseFolder": "", + "diffFolder": "", + "aws": { + "accessKeyId" : "", + "secretAccessKey": "", + "region": "", + "bucketName": "" + } + } + } +} +``` +When this option has been provided, the helper will download the base image from the S3 bucket. +This base image has to be located inside a folder named "*base*". +The resultant output image will be uploaded in a folder named "*output*" and diff image will be uploaded to a folder named "*diff*" in the S3 bucket. +If the `prepareBaseImage` option is marked `true`, then the generated base image will be uploaded to a folder named "*base*" in the S3 bucket. +>Note: The tests may take a bit longer to run when the AWS configuration is provided as determined by the internet speed to upload/download images. + ### Known Issues: -> Issue in Windows where the image comparison is not carried out, and therefore no Mismatch Percentage is shown. See 'loadImageData' function in resemble.js +> Issue in Windows where the image comparison is not carried out, and therefore no Mismatch Percentage is shown. See 'loadImageData' function in resemble.js \ No newline at end of file diff --git a/index.js b/index.js index 6c65532..070a376 100644 --- a/index.js +++ b/index.js @@ -3,6 +3,7 @@ const fs = require('fs'); const assert = require('assert'); const mkdirp = require('mkdirp'); const getDirName = require('path').dirname; +const AWS = require('aws-sdk'); /** * Resemble.js helper class for CodeceptJS, this allows screen comparison @@ -91,6 +92,106 @@ class ResembleHelper extends Helper { else throw new Error("Method only works with Puppeteer"); } + /** + * This method uploads the diff and screenshot images into the bucket with diff image under bucketName/diff/diffImage and the screenshot image as + * bucketName/output/ssImage + * @param accessKeyId + * @param secretAccessKey + * @param region + * @param bucketName + * @param baseImage + * @param ifBaseImage - tells if the prepareBaseImage is true or false. If false, then it won't upload the baseImage. + * @returns {Promise} + */ + + async _upload(accessKeyId, secretAccessKey, region, bucketName, baseImage, ifBaseImage) { + console.log("Starting Upload... "); + const s3 = new AWS.S3({ + accessKeyId: accessKeyId, + secretAccessKey: secretAccessKey, + region: region + }); + fs.readFile(this.config.screenshotFolder + baseImage, (err, data) => { + if(err) throw err; + let base64data = new Buffer(data, 'binary'); + const params = { + Bucket: bucketName, + Key: `output/${baseImage}`, + Body: base64data + }; + s3.upload(params, (uerr, data) => { + if(uerr) throw uerr; + console.log(`Screenshot Image uploaded successfully at ${data.Location}`); + }); + }); + fs.readFile(this.config.diffFolder + "Diff_" + baseImage, (err, data) => { + if(err) console.log("Diff image not generated"); + else { + let base64data = new Buffer(data, 'binary'); + const params = { + Bucket: bucketName, + Key: `diff/Diff_${baseImage}`, + Body: base64data + }; + s3.upload(params, (uerr, data) => { + if(uerr) throw uerr; + console.log(`Diff Image uploaded successfully at ${data.Location}`) + }); + } + }); + if(ifBaseImage) { + fs.readFile(this.config.baseFolder + baseImage, (err, data) => { + if(err) throw err; + else { + let base64data = new Buffer(data, 'binary'); + const params = { + Bucket: bucketName, + Key: `base/${baseImage}`, + Body: base64data + }; + s3.upload(params, (uerr, data) => { + if(uerr) throw uerr; + console.log(`Base Image uploaded at ${data.Location}`) + }); + } + }); + } + else { + console.log("Not Uploading base Image"); + } + } + + /** + * This method downloads base images from specified bucket into the base folder as mentioned in config file. + * @param accessKeyId + * @param secretAccessKey + * @param region + * @param bucketName + * @param baseImage + * @returns {Promise} + */ + + _download(accessKeyId, secretAccessKey, region, bucketName, baseImage) { + console.log("Starting Download..."); + const s3 = new AWS.S3({ + accessKeyId: accessKeyId, + secretAccessKey: secretAccessKey, + region: region + }); + const params = { + Bucket: bucketName, + Key: `base/${baseImage}` + }; + return new Promise((resolve, reject) => { + s3.getObject(params, (err, data) => { + if(err) console.error(err); + console.log(this.config.baseFolder + baseImage); + fs.writeFileSync(this.config.baseFolder + baseImage, data.Body); + resolve("File Downloaded Successfully"); + }); + }); + } + /** * Check Visual Difference for Base and Screenshot Image * @param baseImage Name of the Base Image (Base Image path is taken from Configuration) @@ -103,11 +204,23 @@ class ResembleHelper extends Helper { options.tolerance = 0; } + const awsC = this.config.aws; + + if (awsC !== undefined && options.prepareBaseImage === false) { + await this._download(awsC.accessKeyId, awsC.secretAccessKey, awsC.region, awsC.bucketName, baseImage); + } + if (options.prepareBaseImage !== undefined && options.prepareBaseImage) { await this._prepareBaseImage(baseImage); } const misMatch = await this._fetchMisMatchPercentage(baseImage, options); + + if(awsC !== undefined) { + let ifUpload = options.prepareBaseImage === false ? false : true; + await this._upload(awsC.accessKeyId, awsC.secretAccessKey, awsC.region, awsC.bucketName, baseImage, ifUpload) + } + this.debug("MisMatch Percentage Calculated is " + misMatch); assert(misMatch <= options.tolerance, "MissMatch Percentage " + misMatch); } @@ -127,12 +240,24 @@ class ResembleHelper extends Helper { options.tolerance = 0; } + const awsC = this.config.aws; + + if (awsC !== undefined && options.prepareBaseImage === false) { + await this._download(awsC.accessKeyId, awsC.secretAccessKey, awsC.region, awsC.bucketName, baseImage); + } + if (options.prepareBaseImage !== undefined && options.prepareBaseImage) { await this._prepareBaseImage(baseImage); } options.boundingBox = await this._getBoundingBox(selector); const misMatch = await this._fetchMisMatchPercentage(baseImage, options); + + if(awsC !== undefined) { + let ifUpload = options.prepareBaseImage === false ? false : true; + await this._upload(awsC.accessKeyId, awsC.secretAccessKey, awsC.region, awsC.bucketName, baseImage, ifUpload) + } + this.debug("MisMatch Percentage Calculated is " + misMatch); assert(misMatch <= options.tolerance, "MissMatch Percentage " + misMatch); } diff --git a/package.json b/package.json index 00a4859..fae84cc 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,8 @@ "mz": "^2.7.0", "resemblejs": "^3.0.0", "mkdirp": "^0.5.1", - "path": "^0.12.7" + "path": "^0.12.7", + "aws-sdk": "^2.476.0" }, "keywords": [ "codeceptJS",