reorganize tests

package.json

@@ -7,6 +7,9 @@
     "type": "git",
     "url": "git+https://github.com/shaunstripe/mobile-viewport-control.git"
   },
+  "files": [
+    "index.js"
+  ],
   "author": "Shaun Williams",
   "license": "ISC"
 }

test/README.md

@@ -1,4 +1,13 @@
-## Compatibility Testing
+# Testing
+
+We currently have no automated tests setup in CI yet.  Below are research notes
+on what has been tested and how.
+
+- `bookmarklet/` - injecting a test script into existing pages through a bookmarklet
+- `proxy/` - injecting a test script into any page accessed through a proxy
+- `unit/` - standalone tests for verifying steps of expected behavior
+
+## Compatibility
 
 > __NOTE__: We do not test with Simulators, as iOS Simulator has been shown to
 > produce different results than the real environment with regards to
@@ -15,7 +24,7 @@ Compatibility is measured with a combination of automatic/manual testing:
   1. Manual step - verify that you can still pinch-zoom after the test
 1. __[Injection Method]__ - verify it works for any webpage by running a bookmarklet test to inject JS into the page
 
-| Mobile Browser             | [Measure Test]\* | [Freeze Test] | [Thaw Test]        | [Injection Method]       |
+| Mobile Browsers (latest)   | [Measure Test]\* | [Freeze Test] | [Thaw Test]        | [Injection Method]       |
 |----------------------------|------------------|---------------|--------------------|--------------------------|
 | iOS Safari                 | Y                | Y             | Y                  | devtools                 |
 | iOS UIWebView              | Y                | Fails\*\*     | Y if freeze works. | xcode+devtools           |
@@ -39,18 +48,18 @@ page's scale to change from its specified `initial-scale`.  This custom zoom
 level is maintained across refreshes.  When opening in a new tab, the
 `initial-scale` is resumed._
 
-[Measure Test]:http://shaunstripe.github.io/mobile-viewport-control/test/01-measure.html
-[Freeze Test]:http://shaunstripe.github.io/mobile-viewport-control/test/02-freeze.html
-[Thaw Test]:http://shaunstripe.github.io/mobile-viewport-control/test/03-thaw.html
+[Measure Test]:http://shaunstripe.github.io/mobile-viewport-control/test/unit/01-measure.html
+[Freeze Test]:http://shaunstripe.github.io/mobile-viewport-control/test/unit/02-freeze.html
+[Thaw Test]:http://shaunstripe.github.io/mobile-viewport-control/test/unit/03-thaw.html
 [Injection Method]:#injecting-into-existing-pages
 
-### Injecting into Existing Pages
+## Injecting into Existing Pages
 
 To allow us to quickly gauge compatibility for externally owned webpages
 across several browsers, we must be able to inject our library code into
 their running pages.
 
-##### With Bookmarklet
+### With Bookmarklet
 
 Bookmarklets are URLs of the form `javascript:(function(){ ... }())` which some
 browsers allow for evaluating JS in the context of the current page.  The
@@ -61,10 +70,10 @@ The following bookmarklet will freeze the viewport scale, show a custom
 isolated element, and allow you to press a button to restore the view.
 
 ```js
-javascript:(function(){document.body.appendChild(document.createElement('script')).src='https://rawgit.com/shaunstripe/mobile-viewport-control/master/bookmarklet/index.js?'+Math.random();}())
+javascript:(function(){document.body.appendChild(document.createElement('script')).src='https://rawgit.com/shaunstripe/mobile-viewport-control/master/test/bookmarklet/index.js?'+Math.random();}())
 ```
 
-##### With DevTools
+### With DevTools
 
 Some mobile browsers allow you to connect to a Desktop DevTools environment
 with a JS console for evaluating JS in the context of its page.  iOS Safari
@@ -73,19 +82,19 @@ Chrome/webview can connect to Desktop Chrome DevTools.  Inside DevTools, we can
 simply paste the body of the bookmarklet inside the JS console:
 
 ```js
-document.body.appendChild(document.createElement('script')).src='https://rawgit.com/shaunstripe/mobile-viewport-control/master/bookmarklet/index.js?'+Math.random();
+document.body.appendChild(document.createElement('script')).src='https://rawgit.com/shaunstripe/mobile-viewport-control/master/test/bookmarklet/index.js?'+Math.random();
 ```
 
 iOS webviews require an extra step: you must run an webview app from a live
 XCode project on your mac.  Only then will Desktop Safari DevTools to connect
 to its webview.
 
-##### With Man-in-the-middle (MITM) Proxy
+### With Man-in-the-middle (MITM) Proxy
 
 See [proxy/](proxy) directory for instructions on this last resort testing
 method.
 
-### Variables
+## Variables
 
 We currently do not test all variables, but the test outcomes depend on the following:
 
@@ -99,7 +108,7 @@ We currently do not test all variables, but the test outcomes depend on the foll
   - manual zoom after page load and before test run
 - initial zoom bounds (controlled by page's original viewport meta tags)
 
-### Quirks when Dynamically Modifying Viewport
+## Quirks when Dynamically Modifying Viewport
 
 - iOS UIWebView does not allow scale adjustments after the user has manually adjusted it.
 - Android does not register a new viewport meta tag if it is immediately removed after creation.

bookmarklet/build.sh → test/bookmarklet/build.sh

@@ -3,4 +3,4 @@
 cd `dirname $0`
 
 echo "// Auto-generated by bookmarklet/build.sh" > index.js
-cat ../index.js test.js >> index.js
+cat ../../index.js test.js >> index.js

proxy/proxy.js → test/proxy/proxy.js

@@ -2,13 +2,19 @@
 
 var port = 8081;
 
+// To have a remote console:
+// 1. Go to jsconsole.com and type ':listen'
+// 2. Paste in the code below
+var jsconsoleKey = '81CFF34E-C612-438B-8488-82757B2E4F30';
+var jsconsoleHost = '10.0.0.173:8080'
+
 var fs = require('fs');
 var colors = require('colors');
 var Proxy = require('http-mitm-proxy');
 var proxy = Proxy();
 
 // get JS that we will inject into the webpages
-var libJS = fs.readFileSync('../index.js','utf8');
+var libJS = fs.readFileSync('../../index.js','utf8');
 var testJS = fs.readFileSync('test.js','utf8');
 
 // get and print domain whitelist
@@ -72,7 +78,9 @@ function injectJS(host, url, body) {
   return bodyStr.replace(
     tag,
     '<script>' + libJS + '</script>' +
-    '<script>' + testJS + '</script>' + tag
+    '<script>' + testJS + '</script>' +
+    '<script src="http://' + jsconsoleHost + '/remote.js?' + jsconsoleKey + '"></script>' +
+    tag
   );
 }
 

proxy/test.js → test/proxy/test.js

@@ -17,7 +17,7 @@
 
     setTimeout(test, 5000);
   }
-
+  
   function test() {
     var isolated = createIsolatedElement();
     var initial = viewport.getPrettyInitialViewport();

test/01-measure.html → test/unit/01-measure.html

@@ -14,7 +14,7 @@ <h1>Measure Test</h1>
   <hr>
   <a href="02-freeze.html">Freeze Test &gt;</a>
 
-  <script src="../index.js"></script>
+  <script src="../../index.js"></script>
   <script src="test.js"></script>
   <script>
 

test/02-freeze.html → test/unit/02-freeze.html

@@ -12,7 +12,7 @@ <h1>Freeze Test</h1>
   <a href="01-measure.html">&lt; Measure Test</a> |
   <a href="03-thaw.html">Thaw Test &gt;</a>
 
-  <script src="../index.js"></script>
+  <script src="../../index.js"></script>
   <script src="test.js"></script>
 
   <script>

test/03-thaw.html → test/unit/03-thaw.html

@@ -11,7 +11,7 @@ <h1>Thaw Test</h1>
   <hr>
   <a href="02-freeze.html">&lt; Freeze Test</a>
 
-  <script src="../index.js"></script>
+  <script src="../../index.js"></script>
   <script src="test.js"></script>
 
   <script>

test/methods/02a.html → test/unit/methods/02a.html

@@ -14,7 +14,7 @@ <h2>Set Scale by modifying meta tag</h2>
   <button id="runBtn">Run Test</button>
   <div id="resultDiv"></div>
 
-  <script src="../index.js"></script>
+  <script src="../../../index.js"></script>
   <script src="test.js"></script>
 
   <script>

test/methods/02b.html → test/unit/methods/02b.html

@@ -14,7 +14,7 @@ <h2>Set Scale by adding new meta tag</h2>
   <button id="runBtn">Run Test</button>
   <div id="resultDiv"></div>
 
-  <script src="../index.js"></script>
+  <script src="../../../index.js"></script>
   <script src="test.js"></script>
 
   <script>

test/methods/02c.html → test/unit/methods/02c.html

@@ -15,7 +15,7 @@ <h2>Set Scale by adding/removing new meta tag</h2>
   <button id="runBtn">Run Test</button>
   <div id="resultDiv"></div>
 
-  <script src="../index.js"></script>
+  <script src="../../../index.js"></script>
   <script src="test.js"></script>
 
   <script>

test/methods/03a.html → test/unit/methods/03a.html

@@ -14,7 +14,7 @@ <h2>Set Scale by modifying meta tag</h2>
   <button id="runBtn">Run Test</button>
   <div id="resultDiv"></div>
 
-  <script src="../index.js"></script>
+  <script src="../../../index.js"></script>
   <script src="test.js"></script>
 
   <script>

test/methods/03b.html → test/unit/methods/03b.html

@@ -14,7 +14,7 @@ <h2>Set Scale by adding new meta tag</h2>
   <button id="runBtn">Run Test</button>
   <div id="resultDiv"></div>
 
-  <script src="../index.js"></script>
+  <script src="../../../index.js"></script>
   <script src="test.js"></script>
 
   <script>

test/methods/03c.html → test/unit/methods/03c.html

@@ -15,7 +15,7 @@ <h2>Set Scale by adding/removing new meta tag</h2>
   <button id="runBtn">Run Test</button>
   <div id="resultDiv"></div>
 
-  <script src="../index.js"></script>
+  <script src="../../../index.js"></script>
   <script src="test.js"></script>
 
   <script>