test(css): make css tests work with snapshot

2026-03-13 10:22:08 +08:00 · 2014-06-06 00:39:02 -06:00
parent ce831a98b4
commit c9342c8a54
59 changed files with 367 additions and 195 deletions
--- a/config/demos/processors/demos.js
+++ b/config/demos/processors/demos.js
@@ -24,7 +24,7 @@ module.exports = {
    var transform = {
      '.scenario.js': function(doc) {
        doc.url = 'http://localhost:' +
-        config.get('buildConfig.protractorPort') + path.join(
+        config.get('buildConfig.protractorPort') + '/' + path.join(
          config.demoFolderPrefix || '',
          config.versionData.current.folder,
          _.template(assetOutputPath, _.assign({},doc,{fileName:''}))
--- a/config/gulp-tasks/docs.js
+++ b/config/gulp-tasks/docs.js
@@ -0,0 +1,198 @@
+var buildConfig = require('../build.config.js');
+var cp = require('child_process');
+var dgeni = require('dgeni');
+var gutil = require('gulp-util');
+var htmlparser = require('htmlparser2');
+var lunr = require('lunr');
+var path = require('canonical-path');
+var projectRoot = path.resolve(__dirname, '../..');
+var yaml = require('js-yaml');
+
+module.exports = function(gulp, argv) {
+
+  if (argv.dist) {
+    buildConfig.dist = argv.dist;
+  }
+
+  gulp.task('docs', function() {
+    var docVersion = argv['doc-version'] || 'nightly';
+    if (docVersion != 'nightly' && !semver.valid(docVersion)) {
+      console.log('Usage: gulp docs --doc-version=(nightly|versionName)');
+      return process.exit(1);
+    }
+
+    var config = dgeni.loadConfig(path.resolve(projectRoot, 'config/docs/docs.config.js'));
+    config.set('currentVersion', docVersion);
+    config.set(
+      'rendering.outputFolder',
+      argv.dist ? argv.dist : path.resolve(projectRoot, buildConfig.dist, 'ionic-site')
+    );
+
+    return dgeni.generator(config)().then(function() {
+      gutil.log('Docs for', gutil.colors.cyan(docVersion), 'generated!');
+    });
+  });
+
+  gulp.task('demos', function(done) {
+    var demoVersion = argv['demo-version'] || 'nightly';
+    if (demoVersion != 'nightly' && !semver.valid(demoVersion)) {
+      console.log('Usage: gulp docs --doc-version=(nightly|versionName)');
+      return process.exit(1);
+    }
+
+    var config = dgeni.loadConfig(path.resolve(projectRoot, 'config/demos/demos.config.js'));
+    config.set('currentVersion', demoVersion);
+    config.set('dist', buildConfig.dist);
+    config.set(
+      'rendering.outputFolder',
+      argv.dist ? argv.dist : path.resolve(projectRoot, buildConfig.dist, 'ionic-demo')
+    );
+    config.set('demoFolderPrefix', argv.release ? '' : '/dist/ionic-demo');
+
+    dgeni.generator(config)().then(function() {
+      gutil.log('Demos for', gutil.colors.cyan(demoVersion), 'generated!');
+      gutil.log('Building ionic into demo folder...');
+      console.log(cp.spawn);
+      cp.spawn('node', [
+        projectRoot + '/node_modules/.bin/gulp',
+        'build',
+        IS_RELEASE_BUILD ? '--release' : '--no-release',
+        '--dist=' + config.rendering.outputFolder + '/' +
+          config.rendering.contentsFolder + '/ionic'
+      ])
+      .on('exit', done);
+    });
+  });
+
+  gulp.task('docs-index', function() {
+    var idx = lunr(function() {
+      this.field('path');
+      this.field('title', {boost: 10});
+      this.field('body');
+      this.ref('id');
+    });
+    var ref = {};
+    var refId = 0;
+
+    function addToIndex(path, title, layout, body) {
+      // Add the data to the indexer and ref object
+      idx.add({'path': path, 'body': body, 'title': title, id: refId});
+      ref[refId] = {'p': path, 't': title, 'l': layout};
+      refId++;
+    }
+
+    return gulp.src([
+      'temp/ionic-site/docs/{components,guide,api,overview}/**/*.{md,html,markdown}',
+      'temp/ionic-site/docs/index.html',
+      'temp/ionic-site/getting-started/index.html',
+      'temp/ionic-site/tutorials/**/*.{md,html,markdown}',
+      'temp/ionic-site/_posts/**/*.{md,html,markdown}'
+    ])
+      .pipe(es.map(function(file, callback) {
+        //docs for gulp file objects: https://github.com/wearefractal/vinyl
+        var contents = file.contents.toString(); //was buffer
+
+        // Grab relative path from ionic-site root
+        var relpath = file.path.replace(/^.*?temp\/ionic-site\//, '');
+
+        // Read out the yaml portion of the Jekyll file
+        var yamlStartIndex = contents.indexOf('---');
+
+        if (yamlStartIndex === -1) {
+          return callback();
+        }
+
+        // read Jekyll's page yaml variables at the top of the file
+        var yamlEndIndex = contents.indexOf('---', yamlStartIndex+3); //starting from start
+        var yamlRaw = contents.substring(yamlStartIndex+3, yamlEndIndex);
+
+        var pageData =  yaml.safeLoad(yamlRaw);
+        if(!pageData.title || !pageData.layout) {
+          return callback();
+        }
+
+        // manually set to not be searchable, or for a blog post, manually set to be searchable
+        if(pageData.searchable === false || (pageData.layout == 'post' && pageData.searchable !== true)) {
+          return callback();
+        }
+
+        // clean up some content so code variables are searchable too
+        contents = contents.substring(yamlEndIndex+3);
+        contents = contents.replace(/<code?>/gi, '');
+        contents = contents.replace(/<\/code>/gi, '');
+        contents = contents.replace(/<code?></gi, '');
+        contents = contents.replace(/><\/code>/gi, '');
+        contents = contents.replace(/`</gi, '');
+        contents = contents.replace(/>`/gi, '');
+
+        // create a clean path to the URL
+        var path = '/' + relpath.replace('index.md', '')
+                                .replace('index.html', '')
+                                .replace('.md', '.html')
+                                .replace('.markdown', '.html');
+        if(pageData.layout == 'post') {
+          path = '/blog/' + path.substring(19).replace('.html', '/');
+        }
+
+        var parser;
+        if(pageData.search_sections === true) {
+          // each section within the content should be its own search result
+          var section = { body: '', title: '' };
+          var isTitleOpen = false;
+
+          parser = new htmlparser.Parser({
+            ontext: function(text){
+              if(isTitleOpen) {
+                section.title += text; // get the title of this section
+              } else {
+                section.body += text.replace(/{%.*%}/, '', 'g'); // Ignore any Jekyll expressions
+              }
+            },
+            onopentag: function(name, attrs) {
+              if(name == 'section' && attrs.id) {
+                // start building new section data
+                section = { body: '', path: path + '#' + attrs.id, title: '' };
+              } else if( (name == 'h1' || name == 'h2' || name == 'h3') && attrs.class == 'title') {
+                isTitleOpen = true; // the next text will be this sections title
+              }
+            },
+            onclosetag: function(name) {
+              if(name == 'section') {
+                // section closed, index this section then clear it out
+                addToIndex(section.path, section.title, pageData.layout, section.body);
+                section = { body: '', title: '' };
+              } else if( (name == 'h1' || name == 'h2' || name == 'h3') && isTitleOpen) {
+                isTitleOpen = false;
+              }
+            }
+          });
+          parser.write(contents);
+          parser.end();
+
+        } else {
+          // index the entire page
+          var body = '';
+          parser = new htmlparser.Parser({
+            ontext: function(text){
+              body += text.replace(/{%.*%}/, '', 'g'); // Ignore any Jekyll expressions
+            }
+          });
+          parser.write(contents);
+          parser.end();
+
+          addToIndex(path, pageData.title, pageData.layout, body);
+        }
+
+        callback();
+
+      })).on('end', function() {
+        // Write out as one json file
+        mkdirp.sync('temp/ionic-site/data');
+        fs.writeFileSync(
+          'temp/ionic-site/data/index.json',
+          JSON.stringify({'ref': ref, 'index': idx.toJSON()})
+        );
+      });
+  });
+
+};
--- a/config/protractor.conf.js
+++ b/config/protractor.conf.js
@@ -15,7 +15,7 @@ exports.config = {
  jasmineNodeOpts: {
    showColors: true, // Use colors in the command line report.
    defaultTimeoutInterval: 120000,
-    // isVerbose: true
+    isVerbose: true
  },

  baseUrl: 'http://localhost:' + buildConfig.protractorPort,
--- a/test/css/bars-clear.html
+++ b/test/css/bars-clear.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Bars Clear</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/button-bar.html
+++ b/test/css/button-bar.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Button Bar</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-borderless.html
+++ b/test/css/buttons-borderless.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-button-block-clear.html
+++ b/test/css/buttons-button-block-clear.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-button-block.html
+++ b/test/css/buttons-button-block.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-button-outline.html
+++ b/test/css/buttons-button-outline.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-clear.html
+++ b/test/css/buttons-clear.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-default.html
+++ b/test/css/buttons-default.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-full.html
+++ b/test/css/buttons-full.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-large.html
+++ b/test/css/buttons-large.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-link-block-clear.html
+++ b/test/css/buttons-link-block-clear.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-link-block.html
+++ b/test/css/buttons-link-block.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-link-outline.html
+++ b/test/css/buttons-link-outline.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-misc.html
+++ b/test/css/buttons-misc.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-outline.html
+++ b/test/css/buttons-outline.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-pseudo-icon-compare.html
+++ b/test/css/buttons-pseudo-icon-compare.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/buttons-small.html
+++ b/test/css/buttons-small.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Buttons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/cards-header-footer.html
+++ b/test/css/cards-header-footer.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Cards</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/cards-item-avatar.html
+++ b/test/css/cards-item-avatar.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html ng-app="ionicApp">
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Cards</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/cards-item-body.html
+++ b/test/css/cards-item-body.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html ng-app="ionicApp">
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Cards</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/cards-item-icon.html
+++ b/test/css/cards-item-icon.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Cards</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/cards-item-thumbnail.html
+++ b/test/css/cards-item-thumbnail.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Cards</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/cards-text.html
+++ b/test/css/cards-text.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Cards</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/colors.html
+++ b/test/css/colors.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Colors</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/footers.html
+++ b/test/css/footers.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Footers</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/grid.html
+++ b/test/css/grid.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Grid</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/headers.html
+++ b/test/css/headers.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Header</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/input-checkbox.html
+++ b/test/css/input-checkbox.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Input: Checkbox</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/input-radio.html
+++ b/test/css/input-radio.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Radio Inputs</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/input-range.html
+++ b/test/css/input-range.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Input: Range</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/input-select.html
+++ b/test/css/input-select.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Input: Select</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/input-text.html
+++ b/test/css/input-text.html
@@ -1,16 +1,14 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Text Inputs</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <link href="../../dist/css/ionic.css" rel="stylesheet">
    <script src="../../dist/js/ionic.bundle.js"></script>
-    <script>
-      angular.module('ionicApp', ['ionic']);
-    </script>
  </head>
-  <body ng-app="ionicApp">
+  <body>

    <header class="bar bar-header bar-dark">
      <h1 class="title">Text Inputs</h1>
--- a/test/css/input-textarea.html
+++ b/test/css/input-textarea.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Textarea</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/input-toggle.html
+++ b/test/css/input-toggle.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Input: Toggle</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/lists-avatar.html
+++ b/test/css/lists-avatar.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Lists</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/lists-buttons.html
+++ b/test/css/lists-buttons.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html ng-app="ionicApp">
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Lists</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/lists-colors.html
+++ b/test/css/lists-colors.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Lists</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/lists-icons.html
+++ b/test/css/lists-icons.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Lists</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/lists-text.html
+++ b/test/css/lists-text.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Lists</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/lists-thumbnails.html
+++ b/test/css/lists-thumbnails.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Lists</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/progress.html
+++ b/test/css/progress.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Progress</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/scroll.html
+++ b/test/css/scroll.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Scroll</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/search-ios.html
+++ b/test/css/search-ios.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Search</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/search.html
+++ b/test/css/search.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Search</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/split-pane.html
+++ b/test/css/split-pane.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Split Pane</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/status-bar.html
+++ b/test/css/status-bar.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html ng-app="ionicApp">
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Status Bar</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
@@ -20,89 +21,6 @@
        display: block;
      }
    </style>
-    <script src="../../dist/js/ionic.bundle.js"></script>
-    <script>
-      angular.module('ionicApp', ['ionic'])
-
-      .controller('AppCtrl', function($scope, $timeout){
-
-        $scope.fullScreenTrueTrue = function() {
-          ionic.Platform.fullScreen(true, true);
-          showBodyClass();
-        };
-
-        $scope.fullScreenFalseTrue = function() {
-          ionic.Platform.fullScreen(false, true);
-          showBodyClass();
-        };
-
-        $scope.fullScreenFalseFalse = function() {
-          ionic.Platform.fullScreen(false, false);
-          showBodyClass();
-        };
-
-        $scope.fullScreenTrueFalse = function() {
-          ionic.Platform.fullScreen(true, false);
-          showBodyClass();
-        };
-
-        $scope.fullScreenDefault = function() {
-          ionic.Platform.fullScreen();
-          showBodyClass();
-        };
-
-        $scope.fullScreenTrueDefault = function() {
-          ionic.Platform.fullScreen(true);
-          showBodyClass();
-        };
-
-        $scope.fullScreenFalseDefault = function() {
-          ionic.Platform.fullScreen(false);
-          showBodyClass();
-        };
-
-        $scope.ios7 = function() {
-          document.body.classList.toggle('platform-ios7');
-          showBodyClass();
-        };
-
-        $scope.android = function() {
-          document.body.classList.toggle('platform-android');
-          showBodyClass();
-        };
-
-        $scope.cordova = function() {
-          document.body.classList.toggle('platform-cordova');
-          showBodyClass();
-        };
-
-        $scope.init = function() {
-          showBodyClass();
-        };
-
-        function showBodyClass() {
-          $timeout(function(){
-            $scope.bodyClass = document.body.className;
-            $scope.isFullScreen = ionic.Platform.isFullScreen;
-            $scope._showStatusBar = ionic.Platform._showStatusBar;
-          }, 50);
-        }
-
-      });
-
-      // fake cordova
-      window.StatusBar = {
-        show: function() {
-          console.log('StatusBar show');
-          document.getElementById('ios7-status-bar').style.display = '';
-        },
-        hide: function() {
-          console.log('StatusBar hide');
-          document.getElementById('ios7-status-bar').style.display = 'none';
-        }
-      }
-
-    </script>
  </head>
  <body ng-controller="AppCtrl" ng-init="init()">

@@ -113,34 +31,5 @@
      <h1 class="title">Status Bar</h1>
      <a class="button icon ion-home" href="./"> Home</a>
    </header>
-
-    <div class="content padding" style="padding-top: 100px">
-
-      <p><code>fullScreen: function(showFullScreen, showStatusBar)</code></p>
-
-      <p><code>Body Class: {{ bodyClass }}</code></p>
-
-      <p><code>isFullScreen: {{ isFullScreen }}</code></p>
-
-      <p><code>_showStatusBar: {{ _showStatusBar }}</code></p>
-
-      <p>
-        <button ng-click="fullScreenDefault()">fullScreen()</button>
-        <button ng-click="fullScreenTrueDefault()">fullScreen(true)</button>
-        <button ng-click="fullScreenFalseDefault()">fullScreen(false)</button>
-        <button ng-click="fullScreenTrueTrue()">fullScreen(true, true)</button>
-        <button ng-click="fullScreenFalseTrue()">fullScreen(false, true)</button>
-        <button ng-click="fullScreenFalseFalse()">fullScreen(false, false)</button>
-        <button ng-click="fullScreenTrueFalse()">fullScreen(true, false)</button>
-      </p>
-
-      <p>
-        <button ng-click="cordova()">.platform-cordova</button>
-        <button ng-click="ios7()">.platform-ios7</button>
-        <button ng-click="android()">.platform-android</button>
-      </p>
-
-    </div>
-
  </body>
 </html>
--- a/test/css/tabs-and-cards.html
+++ b/test/css/tabs-and-cards.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Tabs: Top Icons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/tabs-default.html
+++ b/test/css/tabs-default.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Tabs: Top Icons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/tabs-icons-bottom.html
+++ b/test/css/tabs-icons-bottom.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Tabs: Bottom Icons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/tabs-icons-left.html
+++ b/test/css/tabs-icons-left.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Tabs: Left Icons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/tabs-icons-right.html
+++ b/test/css/tabs-icons-right.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Tabs: Right Icons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/tabs-no-icons.html
+++ b/test/css/tabs-no-icons.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Tabs: No Icons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/tabs-only-icons.html
+++ b/test/css/tabs-only-icons.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Tabs: Only Icons</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/tabs-with-footer.html
+++ b/test/css/tabs-with-footer.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Tab with a Footer</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
--- a/test/css/test.scenario.js
+++ b/test/css/test.scenario.js
@@ -1,31 +1,65 @@
 describe('css snapshot', function() {

  [
-    'bars-clear',
-    'buttons',
-    'cards-header-footer',
-    'cards-item-avatar',
-    'cards-item-body',
-    'cards-item-icon',
-    'cards-item-thumbnail',
-    'cards-text',
-    'colors',
-    'footers',
-    'grid',
-    'headers',
-    'input-checkbox',
-    'input-radio',
-    'input-range',
-    'input-select',
-    'input-text',
-    'input-textarea',
-    'input-toogle',
-    'list',
-    'modals',
+    "bars-clear.html",
+    "button-bar.html",
+    "buttons-borderless.html",
+    "buttons-button-block-clear.html",
+    "buttons-button-block.html",
+    "buttons-button-outline.html",
+    "buttons-clear.html",
+    "buttons-default.html",
+    "buttons-full.html",
+    "buttons-large.html",
+    "buttons-link-block-clear.html",
+    "buttons-link-block.html",
+    "buttons-link-outline.html",
+    "buttons-misc.html",
+    "buttons-outline.html",
+    "buttons-pseudo-icon-compare.html",
+    "buttons-small.html",
+    "cards-header-footer.html",
+    "cards-item-avatar.html",
+    "cards-item-body.html",
+    "cards-item-icon.html",
+    "cards-item-thumbnail.html",
+    "cards-text.html",
+    "colors.html",
+    "footers.html",
+    "grid.html",
+    "headers.html",
+    "input-checkbox.html",
+    "input-radio.html",
+    "input-range.html",
+    "input-select.html",
+    "input-text.html",
+    "input-textarea.html",
+    "input-toggle.html",
+    "lists-avatar.html",
+    "lists-buttons.html",
+    "lists-colors.html",
+    "lists-icons.html",
+    "lists-text.html",
+    "lists-thumbnails.html",
+    "progress.html",
+    "scroll.html",
+    "search-ios.html",
+    "search.html",
+    "split-pane.html",
+    "status-bar.html",
+    "tabs-and-cards.html",
+    "tabs-default.html",
+    "tabs-icons-bottom.html",
+    "tabs-icons-left.html",
+    "tabs-icons-right.html",
+    "tabs-no-icons.html",
+    "tabs-only-icons.html",
+    "tabs-with-footer.html",
+    "type.html",
  ].forEach(function(testId) {
    describe(testId, function() {
      it('init', function() {
-        browser.get('http://localhost:8876/test/css/' + testId + '.html');
+        browser.get('http://localhost:8876/test/css/' + testId);
      });
    });
  });
--- a/test/css/type.html
+++ b/test/css/type.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="ionic">
  <head>
+    <script src="../../dist/js/ionic.bundle.js"></script>
    <meta charset="utf-8">
    <title>Type</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">