michaelbromley

/**
 * Typing partial application in TypeScript!
 * 
 * Here's a "pick" function which takes some property names and returns a function which will pick those
 * from an object passed to it.
 */
export function pick<T extends string>(props: T[]): <U>(input: U) => { [K in T]: K extends keyof U ? U[K]: never } {
    return {} as any; // implementation not important for now
}

michaelbromley

// This is a build step which would be run whenever component messages are modified.
// It scans the project for co-located *.messages.json files, extracts the tokens
// and prepends them with the components' selector as a scoping mechanism.

// pseudo-code

var componentMessages = getComponentMessageFiles("**/*.messages.json");
var componentTokens = {};

foreach (messageFile in componentMessages) {

michaelbromley

import {Component, EventEmitter, Type} from '@angular/core';

type MetadataName = 'Input' | 'Output';

interface PropDecoratorFactory {
    ngMetadataName: MetadataName;
    bindingPropertyName: string | undefined;
}

interface PropMetadata { [key: string]: PropDecoratorFactory[]; }

michaelbromley

import 'Component, EventEmitter, Input, Output' from '@angular/core';

@Component({
  selector: 'foo',
  template: `<button (dblclick)="onDoubleClick($event)">{{ label }}</button>`
})
export class FooComponent {
  @Input label = 'Double Click Me!';
  @Output doubleClick = new EventEmitter();

michaelbromley

/**
 * Two approaches to managing multiple Subscriptions in rxjs.
 */

// Using a single Subscription
let subscription: Subscription;

// Using an array of Subscriptions
let subscriptions: Subscription[];

michaelbromley

Integration Testing Of A Dockerized Angular App

Protractor

We are using the Protractor testing framework in order to test our Gentics Mesh AngularJS Admin UI Webapp. In this blogpost I will explain our setup and how we use docker to run the protractor tests.

Selenium Node

Protractor uses Selenium in order to test the application.

michaelbromley

= Continuous Delivery Changelog

I have recently changed the Gentics Mesh release process from regular releases to a continous delivery release process. One of the questions that directly came up was how to manage a public changelog in continuous delivery workflow.

Previously (regular sequential releases) I would write the changelog entry upfront and since I knew what release version would be expected I could just refer to that version. With CD this changes. I can no longer refer to a specific version since I'm doing CD without actually knowing the version upfront.

I know that I could just fetch the SCM log and generate a changelog using that information but I don't like to use SCM messages for a public (enduser friendly) changelog. A changelog that just consists of SCM messages is way too noisy. Unfortunately it seems that all the open source changelog plugin utlize the git log to build a changelog.

For Gentics CMS I already wrote my own [maven changelog plugin](https://github.com/gentics/maven-changelog

michaelbromley

Functional Performance Tests For Java

Since there seems to be multiple definitions of functional tests, here is mine:

A functional test is a test which will test the exposed application features (e.g.: internal or REST API's ) with fewer or no mocks compared to unit tests. Functional tests may also interact with databases or other external services.

For Gentics Mesh we already have a lot of functional tests but no performance tests. It is therefore hard to tell whether a change or even a dependency update actually improves or degrades the service performance.

The Gentics Mesh functional tests are written using JUnit. Please keep in mind that a JUnit test must not necessarily be a unit test. In the case of Mesh we have a lot of functional tests which start up an embedded Mesh instance and invoke regular REST requests via HTTP.

michaelbromley

/// <reference path="typings/angular2/angular2.d.ts" />
import {Component, Directive, View, Inject, coreDirectives, bootstrap} from 'angular2/angular2';

import {NameService} from 'nameService';
import {Logger} from 'logger';



@Component({
    selector: 'my-app'

michaelbromley

<!doctype html>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>Audio & Video In JavaScript</title>
    <script>


        /**
         __          __  _                         _ _                  _____ _____