If you are using Angular(2+) and you are looking for an easy way to layout your components that gives you lots of flexibility and very few restrictions, you owe it to yourself to checkout Angular Flex Layout. While it is still in Beta, the framework is quite usable. I’ve been using it in one of my projects and I’ve been quite happy with the results.
Unit Testing Angular(2+) with JSDOM can be problematic unless you know the secret handshake that allows ZoneJS and JSDOM to coexist.
The great thing about Angular is that you can write Unit Tests from the presentation layer all the way down to calls to the server. But up until now, you either ran those tests in a browser, which doesn’t work well in a CI system, or you used PhantomJS, which tends to be REALLY slow! But there is a better way, and hopefully, by the time this post goes live, the patches needed to use JSDOM will be available. If not, I’ll show you the hack that I’ve found works and the pull request I’m hoping will go live.
This week, I thought I’d collect a list of unrelated tricks and tips I’ve learned over the last couple of weeks into one post. Unless you love to read documentation, or you’ve run into problems that these tips solve, I’m guessing you don’t know most of these.
But first, the big new this week…
This past week, while working on a new project, I discovered some secrets to styling Angular2 that I don’t think are very well known.
There are two specific issues I needed to solve this week that took a bit of digging. The first was that I wanted my routes to fade in and out as I move between routes. The second was that I was using a grid control from a third party and I needed to style an inner component. We will cover both as well as some more basic operations.
I’ve been working with Angular2 now since RC0 and I’ve learned quite a few things about Angular2 DOM tips, tricks, and warnings that you’ll want to pay attention to as you get started.