Blog

ngImprovedTesting: mock testing for AngularJS made easy

Emil

NOTE: Just released version 0.3 of ngImprovedTesting with lots of bug fixes.
Check out this blog post or the README of the GitHub repo for more info.

Being able to easily test your application is one of the most powerful features that AngularJS offers. All the services, controllers, filters even directives you develop can be fully (unit) tested. However the learning curve for writing (proper) unit tests tends to be quite steep. This is mainly because AngularJS doesn’t really offer any high level API’s to ease the unit testing.

Read More

Integrating Karma (Testacular) test runner in WebStorm 6 / IDEA 12

Emil

NOTE: version 7 of WebStorm already comes with built-in Karma support.
However IntelliJ IDEA 12 users will have to wait for v. 13, making this article still relevant for them.

Recently I started using the Karma (previously called Testacular) test runner for JavaScript, as an alternative for the “Jasmine Maven Plugin”. The primary reason for switching is that Karma uses actual browsers (like Chrome, Firefox, Safari and even IE) to execute the tests instead of the emulated Mozilla Rhino JavaScript engine.

Read More

Easy installation of Karma (Testacular) test runner on Windows

Emil

NOTE: this post was written for Karma 0.8 which required a manual installation of PhantomJS.
However this blog post is still relevant for installing the NodeJS and NPM pre-requisites.
As of 0.10 both PhantomJS and Chrome will be automatically installed by the launcher plugins.
Installation instructions for Karma 0.10 can be found here (a “Local installation” is preferred).
Furthermore instructions on how to install plugins (introduced as of 0.10) can be found here.

Read More

How to create (singleton) AngularJS services in 4 different ways

Emil

Next to creating controllers and directives, AngularJS also supports “singleton” services. Services, like on the server-side, offer a great way for separating logic from your controllers. In AngularJS anything that’s either a primitive type, function or object can be a service. Although the concept of service is quite straight forward, the declaration of them in AngularJS isn’t:

Read More

JavaScript: console logging (with IE safety)

Richard

Every once in a while I work on a site which has some or copious amounts of javascript. Now I do not mind this at all. But it’s pretty tedious stuff writing the code and putting in loggers. And when you’re working on something and you have to test it on IE. Well let’s just say the console may cause some problems. But rather then removing all the logging i’ve found there’s an easy solution.

Read More

Javascript, keeping it clear

Richard

Note that this blog is in no way written as a “best practice” or “do it this way” kind of blog. I am not, nor do I aspire to be, the worlds greatest javascript programmer. I do however like my code clear and structured. Now lately some colleagues have asked me how I write my code and that in turn prompted this blog. In short the best way to keep your Javascript clear is using namespaces.

Read More

Adding custom HTML attributes to your AngularJS web app

Emil

AngularJS is an excellent JavaScript web framework offering so-called “directives” to ‘teach’ HTML some new tricks. Examples of built-in AngularJS directives are:

  • “ngView”: defines the placeholder for rending views
  • “ngModel”: binds scope properties to “input”, “select” and “text” elements
  • “ngShow” / “ngDisabled”: for showing or disabling an element based on the result of an expressions
Read More

AngularJS made me stop hiding from JavaScript

Emil

Like most Java developers I used to have a serious aversion to JavaScript. I was quite happy to delegate any ‘scripting’ stuff to fellow developers. At my current project, we initially decided to use the Vaadin web framework. It seemed the perfect choice for creating Rich Internet Application (RIA) user-interfaces without writing a single line of JavaScript. However what originally seemed to be a sensible choice, turned out to be a dead-end:

Read More