Update filenames and documentation

README.md

@@ -3,6 +3,8 @@ React Cortex
 
 A testing utility for generating visual diffs of your React components.
 
+This tool will create 3 files - `theirs-{componentName}.png`, `yours-{componentName}.png` and `difference.png`. When `differ.cleanup` is called, `yours-{componentName}.png` and `difference.png` will be deleted.
+
 # Installation
 
 ```
@@ -76,6 +78,71 @@ var differ = new Differ({
 });
 ```
 
+# API
+
+```
+new Differ(options) :=> Object{Differ}
+
+Create a new Differ object
+
+- options
+    - component - The React component you want to test
+    - componentName - The name of your component, used to save your file
+    - savePath - The folder where your screenshots should be saved
+    - threshold - The percentage difference allowed. Defaults to 0
+    - onScreenshotsUpdated - What to do after screenshots have been updated when using the `env UPDATE_SCREENSHOTS=1` or option `updateScreenshots: true`. Defaults to noop.
+    - updateScreenshots - Instead of running tests, simply update screenshots. Defaults to false.
+
+```
+
+```
+compare() :=> Promise
+
+Will snap a picture of the your version of the React component, then compare it to the baseline, then generate a difference image. Once complete, the given
+Promise will resolve with whether the difference is within the threshold
+```
+
+```
+cleanup() :=> nil
+
+Will remove `yours-{componentName}.png` and `difference.png`.
+```
+
+## Internal calls
+
+The following are provided, but their interfaces may change in the future:
+
+```
+snap(options) :=> Promise
+
+Will take a screenshot.
+
+- options
+    - path - The path to save the screenshot to
+```
+
+```
+compareTo(options) :=> Promise
+
+Will compare the screenshots and generate diff, as well as resolve the Promise with whether the images are within the threshold difference.
+
+- options
+    - path - Path to save to
+    - filename - File to check the currentSnap against
+```
+
+```
+moveSnapshot(options) :=> boolean
+
+Will attempt to move the snapshot from `yours-{componentName}.png` to `theirs-{componentName}.png`
+
+- options
+    - path - Folder to move to
+    - filename - Filename to move to
+
+```
+
+
 # Development
 
 We have a build script to transpile the ES2015 code to ES2013 code.

react-cortex.compiled.js

@@ -54,7 +54,7 @@ var createScreenshot = function createScreenshot(_ref) {
         page.property('content', html).then(function () {
           // TODO figure out a better way to do this
           setTimeout(function () {
-            var fullFileName = path + 'latest-' + componentName + '.png';
+            var fullFileName = path + 'yours-' + componentName + '.png';
             page.render(fullFileName).then(function (e) {
               ph.exit();
               ref.currentSnap = fullFileName;
@@ -141,9 +141,9 @@ var Differ = function Differ(_ref2) {
   this.compare = function () {
     var promise = new Promise(function (resolve, reject) {
       _this.snap({ path: savePath }).then(function (differ) {
-        differ.compareTo({ path: savePath, filename: componentName + '.png' }).then(function (areTheSame) {
+        differ.compareTo({ path: savePath, filename: 'theirs-' + componentName + '.png' }).then(function (areTheSame) {
           if (process.env.UPDATE_SNAPSHOTS || updateSnapshots) {
-            differ.moveSnapshot({ path: savePath, filename: componentName + '.png' });
+            differ.moveSnapshot({ path: savePath, filename: 'theirs-' + componentName + '.png' });
             differ.cleanup();
             onScreenshotsUpdated();
           } else {

react-cortex.js

@@ -23,7 +23,7 @@ const createScreenshot = ({ resolve, reject, componentName, html, ref, path }) =
         page.property('content', html).then(() => {
           // TODO figure out a better way to do this
           setTimeout(() => {
-            let fullFileName = path + 'latest-' + componentName + '.png';
+            let fullFileName = path + 'yours-' + componentName + '.png';
             page.render(fullFileName).then((e) => {
               ph.exit();
               ref.currentSnap = fullFileName;
@@ -91,9 +91,9 @@ const Differ = function ({
   this.compare = () => {
     var promise = new Promise((resolve, reject) => {
       this.snap( { path: savePath } ).then((differ) => {
-        differ.compareTo( { path: savePath, filename: componentName + '.png' } ).then((areTheSame) => {
+        differ.compareTo( { path: savePath, filename: 'theirs-' + componentName + '.png' } ).then((areTheSame) => {
           if (process.env.UPDATE_SNAPSHOTS || updateSnapshots) {
-            differ.moveSnapshot({ path: savePath, filename: componentName + '.png' });
+            differ.moveSnapshot({ path: savePath, filename: 'theirs-' + componentName + '.png' });
             differ.cleanup();
             onScreenshotsUpdated();
           } else {