s9tpepper

angular_module.config([ '$provide', function($provide) { 
  return $provide.decorator('$rootScope', [ '$delegate', function($delegate) { 
    $delegate.safeApply = function(fn) { 
      var phase = $delegate.$$phase; 
      if (phase === "$apply" || phase === "$digest") { 
        if (fn && typeof fn === 'function') { 
          fn(); 
        } 
      } else { 
        $delegate.$apply(fn); 

s9tpepper

function isHLSCapable() {
  var video = document.createElement("video");

  var mimeTypes = ["application/x-mpegURL", "application/mpegURL", "application/vnd.apple.mpegURL"];
  var capable = [];

  mimeTypes.forEach(function (mimeType) {
    capable.push(video.canPlayType(mimeType));
  });

s9tpepper

var BuyThisWorld = function BuyThisWorld(callback) {
  this.browser = document.querySelector('iframe');
	callback();
};

// DSL

BuyThisWorld.prototype.test = function(callback) {
	if (this.browser.contentDocument.querySelector('p').innerText === "Yup") {
		callback;

s9tpepper

1. Write Feature file with scenarios
2. Run CucumberJS to make sure I get expected scenario step def stub code
3. Add step defs to Feature_steps.js
4. Add any new utility methods I might need to pass the Feature file scenarios 
  - For example, if the Feature file is:
    Feature: Forgot password link
      Scenario: Clicking on the password link sends the user to the forgotpw.html page
        Given the user is on the login page
        When the user clicks on the forgot password link
        Then the user is redirected to the forgot password page

s9tpepper

module.exports = function(grunt) {
  
  // Project configuration.
  grunt.initConfig({
    coffeeFiles: ['js/*.coffee', '!node_modules/**'],
    cssFiles: ['css/*.styl', '!node_modules/**'],
    watch: {
      scripts: {
        files: '<config:coffeeFiles>',
        tasks: 'coffee'

s9tpepper

this.Given(/^some steps that detect IE with Flash installed$/, function(arg1, callback) {
    // Tell Zombie to pose as IE 8.0
    browser = new zombie.Browser({
      userAgent: "Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0)"
    });

    browser.on("loaded", function (event) {
      var window = browser.window;
      
      // Make an ActiveXObject function w/ a GetVariable method prototype that returns the desired Flash version

s9tpepper

// These 'settings' put on the navigator will result in a plugin detection, not ActiveX
// I will link a gist for IE when I finish that one.
// edit: Link to IE example: https://gist.github.com/3796408

var SHOCKWAVE_FLASH = "Shockwave Flash",
    FLASH_MIME_TYPE = "application/x-shockwave-flash";

this.Given(/^some step that tests Flash availability$/, function(callback) {
    // Tell Zombie to pose as Safari 5.0
    browser = new zombie.Browser({

s9tpepper

// The .config() part is the relevant part, 'SomeModule' is arbitrary name, 
// but this config() call goes on your main ng-app="YourAppModule"
// The PHP $_POST expects data w/ a form content type, not a JSON payload
angular.module("YourAppModule", ["SomeModule"]).config(function($httpProvider) {
  $httpProvider.defaults.headers.put['Content-Type'] =
    'application/x-www-form-urlencoded';
  $httpProvider.defaults.headers.post['Content-Type'] =
    'application/x-www-form-urlencoded';
});

s9tpepper

// In AngularJS 0.9.19

// Dont do...
angular.service("CustomServiceOne", function($resource) {
    return $resource("/path/to/api/:aParam", {}, {
        getSomething: {method: "GET", params: {aParam: 0}, isArray: false}
    });
});

// Instead do this...

s9tpepper

/* The opacity: .5 CSS property will make the container and its
 * children transparent. This LESS mixin can be used to set the
 * background-color property with opacity resulting in a transparent
 * background color with full opacity children.
 */
.backgroundOpacityRGB(@red: 0, @green: 0, @blue: 0, @bgOpacity: 0.5) {
	background: rgb(@red, @green, @blue); // Fallback to full opacity bg 
	background: rgba(@red, @green, @blue, @bgOpacity); // Alpha'd bg color for 'modern' browsers
}