I put together small collection of usefull commands and Vagrant file snippets.

Destroy and start new insatnce from one line:

vagrant destroy -f && vagrant up

To change parameters of virtual machine:

1
2
3
4
5
  config.vm.provider :virtualbox do |vb|
    vb.customize ["modifyvm", :id, "--memory", "1024"]
    vb.customize ["modifyvm", :id, "--cpus", "2"]
    vb.customize ["modifyvm", :id, "--ioapic", "on"]
  end

Make sure --ioapic is on

Link local folder to cache apt-get packages

It is very annoying to wait when packages being downloaded. Here is how to do it only once.

Create method in header of your Vagrant file:

1
2
3
4
5
6
7
8
9
    def local_cache(box_name)
      cache_dir = File.join(File.expand_path("~/.vagrant"),
                            'cache',
                            'apt',
                            box_name)
      partial_dir = File.join(cache_dir, 'partial')
      FileUtils.mkdir_p(partial_dir) unless File.exists? partial_dir
      cache_dir
    end

Use it inside configuration:

1
2
  cache_dir = local_cache(config.vm.box)
  config.vm.synced_folder cache_dir, "/var/cache/apt/archives/"

Create local virtual IP address:

1
  config.vm.network :private_network, ip: "88.88.88.88"

Full source of Vagrant file:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
# -*- mode: ruby -*-
# vi: set ft=ruby :

def local_cache(box_name)
  cache_dir = File.join(File.expand_path("~/.vagrant"),
                        'cache',
                        'apt',
                        box_name)
  partial_dir = File.join(cache_dir, 'partial')
  FileUtils.mkdir_p(partial_dir) unless File.exists? partial_dir
  cache_dir
end

VAGRANTFILE_API_VERSION = "2"

Vagrant.configure(VAGRANTFILE_API_VERSION) do |config|
  config.vm.box = "precise32"
  config.vm.box_url = "http://files.vagrantup.com/precise32.box"
  config.vm.hostname = "name"

  config.vm.provider :virtualbox do |vb|
    vb.customize ["modifyvm", :id, "--memory", "1024"]
    vb.customize ["modifyvm", :id, "--cpus", "2"]
    vb.customize ["modifyvm", :id, "--ioapic", "on"]
  end


  config.vm.network :private_network, ip: "88.88.88.88"

  cache_dir = local_cache(config.vm.box)

  config.vm.synced_folder cache_dir, "/var/cache/apt/archives/"
  config.vm.synced_folder "~/.m2", "/home/vagrant/.m2"

end

News

Dev

Tech

I have been mentioning React.js several times before. Recently I had opportunity to play with it closely.

I also wanted to make it right from the beginning. I wanted to Unit tests.

My choice of framework is Jasmine

Quick search for working example gave only this

ReactTestUtils has tools for dispatching events to React components for testing (like ReactTestUtils.Simulate.click(component)). Unfortunately it’s not currently bundled with React in a way that’s easy to use. There’s an issue open (https://github.com/facebook/react/issues/560) for making this better. Right now probably the easiest way to get ReactTestUtils in a build is to clone the repo, add it to ReactWithAddons.js (add a require(‘ReactTestUtils’) at the top then add it to the object at the bottom), and do a build locally using grunt. Sorry this is a bit hard right now. Making the testing situation better is one of the priorities for upcoming React releases. :)

Not much…

Here what I did to make unit tests work for React.js:

Setup:

  • Karma as a runner: npm install -g karma
  • Jasmine as test framework
  • Grunt as build tool

Make Changes to Rect.js to include testing utilities:

  • clone https://github.com/facebook/react.git;
  • Change react/src/ReactWithAddons.js to add ReactTestUtils:
1
2
3
4
5
6
7
8
9
10
11
12
13
    "use strict";
    var LinkedStateMixin = require('LinkedStateMixin');
    var React = require('React');
    var ReactTransitionGroup = require('ReactTransitionGroup');
    var ReactTestUtils = require('ReactTestUtils');
    var cx = require('cx');
    React.addons = {
      classSet: cx,
      LinkedStateMixin: LinkedStateMixin,
      TransitionGroup: ReactTransitionGroup,
      ReactTestUtils: ReactTestUtils
    };
    module.exports = React;
  • to access ReactTestUtils we will need to use React.addons.ReactTestUtils. This part was not so obvious to me; run ‘grunt build’;
  • and take ‘build/react-with-addons.js’. We will use this file instead react.js during testing.

Code to Test:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var Label = React.createClass({
    handleClick: function(){
        console.log("Click");
        this.props.children = "Text After Click";
        this.setState({liked: false});
    },

    render: function () {
        console.log("Render");
        return (
            <p ref="p" onClick={this.handleClick}>{this.props.children}</p>
            );
    }
});

Tests:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
    "use strict";

    var ReactTestUtils;

    describe("Label Test",function(){
        beforeEach(function() {
            ReactTestUtils = React.addons.ReactTestUtils;
        });


        it("Check Text Assignment", function () {
            var label = <Label>Some Text We Need for Test</Label>;
            ReactTestUtils.renderIntoDocument(label);
            expect(label.refs.p).toBeDefined();
            expect(label.refs.p.props.children).toBe("Some Text We Need for Test")
        });

        it("Click", function () {
            var label  = <Label>Some Text We Need to Test</Label>;
            ReactTestUtils.renderIntoDocument(label);

            ReactTestUtils.Simulate.click(label.refs.p);
            expect(label.refs.p.props.children).toBe("Text After Click");
        });

    });


We even can use JXS syntax inside tests: <Label>Some Text We Need for Test</Label>.

Make everything work together under Grunt

  • Pre-process JSX files before running tests (grunt task):
1
2
3
4
5
6
7
8
9
10
11
12
13
        react: {
            dynamic_mappings: {
                files: [
                    {
                        expand: true,
                        src: ['src/**/*.jsx', "test/**/*.jsx"],
                        dest: 'build_jsx/',
                        ext: '.js'
                    }
                ]
            }
        },

  • run karma tests:
1
2
3
4
5
6
        karma: {
            unit: {
                configFile: 'karma.conf.js'
            }
        }

And now we have project which allows us to do proper unit testing for React.js applications

Full souce code could be found here

News

Dev

Science

Tech

Startup

News

Dev

  • Reddit’s empire is founded on a flawed algorithm may be we need to adopt it…
  • XCPretty Flexible and fast xcodebuild formatter #xcode
  • Transplanting Constraints Suggestions to edit xib XML directly as text file. May be we need to make it properly in runtime? #ios
  • TWMessageBarManager An iOS manager for presenting system-wide notifications via a dropdown message bar. #ios
  • FastCoding FastCoder is a high-performance binary serialization format for Cocoa objects and object graphs. It is intended as a replacement for NSPropertyList, NSJSONSerializer, NSKeyedArchiver/Unarchiver and Core Data. #ios
  • Mensa: Smart Tables Shows three simple techniques for modern UITableViews. The three techniques are each separate in concept but are combined in this demo project; you can use each independently. I’m still not sure if it is useful #ios
  • APIClient

Science

Startup

News

Dev

News

Dev

  • Telegraphy Telegraphy provides real time events for WSGI Python applications with additional features such as event filtering, subscription persistence and authorization/authentication. It’s initially intended for Django but you can extend it to any WSGI framework. #Python
  • Server-generated JavaScript Responses I feel we are moving back to JSP… #JavaScript
  • websocketd Turn any application that uses STDIO/STDOUT into a WebSocket server. Just need to figure out security implications for this. But might me good for orchestration.

Science

Misc

Dev

Startup

Science

News

Dev

  • Introduction to React.js I start to like it more and more… #JavaScript
  • SimPholders 1.5 A small utility for fast access to your iPhone Simulator apps. Opens folder in Finder, resets library and documents, and deletes the selected app. #ios
  • lookback.io record user actions to analyze what actual users do. It records movies. So sometimes is too big. It is free for now… #ios
  • Developing for the M7 how to work with motion detection chip in iPhone 5s #ios

Tech

Science

Startup

Dev

Science

Tech

Misc