All Posts

layout: post title: Diagnosing Random Angular Test Failures date: ‘2021-01-14’ author: Michael D. Callaghan tags:

• Unit Tests
• Angular
• Web Development layout: post feature: https://walkingriver.com/assets/img/angular-jasmine-karma.png thumbnail: https://walkingriver.com/assets/img/angular-jasmine-karma.png cover_image: https://walkingriver.com/assets/img/angular-jasmine-karma.png canonical_url: https://walkingriver.com/angular-test-failures/ published: true —

Have you ever had an intermittent or random failure in your unit tests? I did, and I was pulling my hair out trying to figure out the problem. Below I will describe how I finally managed to find the offending tests and solve the problem.

I have resisted installing and using Prettier for a long time now, mostly because I was happy enough with the job VS Code does formatting my code. Then over the Christmas break, my son convinced me to install it. After I did, he said, “Now open an HTML file and I’ll show you something you aren’t going to like.” Sure, now he tells me! That struck me as ominous, but I decided to go along for the ride.

For the past few months I have been involved with migrating an AngularJS 1.4 app to a more modern version of Angular. Below I will describe some of the processes, techniques, and issues I have encountered to make the migration successful.

How I became the go-to Angular Advocate at work – and how you can, too!

Angular components do not need to be complicated. In fact, with a little HTML and CSS, it is reasonably straightforward to build a component you can reuse in all your projects. I will detail the creation of a “Loading” indicator.

I tried something “new” this afternoon. I built an Angular service in a true TDD fashion. I wrote the tests first, discovering the service interface along the way. This is how it went. I invite you to follow along.

Angular is on a six-month release cadence, which means you need to stay on top of them in your own projects. The last thing you want to do is wake up one day and find that the latest version was just released and you are stuck on a version from two and a half years ago. Fortunately, the Angular team has made it very easy to upgrade.

What do you get when you combine a bunch of software developers with a perceived impending disaster? In one case, we got guns, and lots of them! The weirdest thing is how normal it all seemed.

I am currently working on a project to uplift some AngularJS code to Angular 10. On a recent code review there were some concerns that came up about the heavy use of RxJS. I will attempt to address those concerns in this post.

The other day I was looking for a picture of a swimming pool for a mobile app I am writing (more on that later). Much to my excitement, I stumbled upon an online image catalog called Pixabay.

I wanted to become a software developer from the time I wrote my first “Hello World” app in 9th grade. After graduating high school in 1985, I entered the University of Maryland’s Computer Science program. It did not go well. I completed only four semesters of college over the next five years. My dream of becoming a professional developer faded. In 1995, nearly ten years after high school, I finally landed my first paid programming job. Here is how I did it.

Ten years into an otherwise successful software development career, I experienced significant burnout and walked away from a 6-figure salary. I quit my job, sold my house, moved to a remote part of New Hampshire, and did not work again in software development for almost three years.

This post describes how I built a docker container that runs an express server, which serves an AngularJS app, written in TypeScript, with live reloading, remote Chrome debugging, with Source Maps served from a different directory, and VS Code breakpoints.

My side gigs have brought in almost $7000 in passive income through the first half of this year, mostly by formatting and editing content I already had lying around. Here is why and how I did it.

One hot summer day, my team received a somewhat frantic email. Due to some hardware support issues, a very large and visible part of our business was at risk of being shut down. They wanted to know what we could do about it. This post will provide some of our challenges, and the solution we ultimately provided, to keep the business running.

Last week I posted an article describing all of the cool things I love about working at Walt Disney World. Things that have nothing whatsoever to do with my actual job; they were simply the extra benefits available as a bonus. This post is all about the career benefits of working here.

I am currently in my tenth year as a Disney Technology Cast Member. As the tenth year is a milestone year at the company, I have spent some time reflecting on my time here, my career, and where I want to go over the next decade. My conclusion is that I cannot imagine working anywhere else. This post describes some of my reasons why.

I recently celebrated nine years as a software developer at Walt Disney World in Florida. It is the longest I have ever stayed with a single company in my nearly 30-year software development career. Not coincidentally, it has also been one of my most rewarding. In this post I will describe a philosophy of Guest Service known as Walt Disney’s Four Keys Basics. In a follow-up, I will discuss how to apply these basics to software development.

I normally ignore unsolicited emails from recruiters. They are almost never a good match, and feel as though they are “shotgun” email blasts sent to hundreds or thousands of people. This one was different, though. It had the word “Disney” in the subject line.

One of my blind spots when creating apps with the Ionic Framework is adding a side-menu after the fact. Even after using it for so many years, it seems I always need to look up how to do it. So I created this post to remind me (and you) how to create an effective Ionic Menu with and without an Ionic Split Pane View in an Ionic Angular application.

It took some experimenting and creating a video, but I finally figured out what the difference is between the three types for an ion-menu component in the Ionic Framework.

One of the key features of Progressive Web Applications is the ability for them to function without a network connection. Angular makes it really easy to turn any web app into a PWA. Believe it or not, though, having a PWA that works offline does come with some downside, primarily due to it caching much of your application. If your users are expecting current data, but your service worker is serving cached data, there could be some confusion. So in this post, I will show you how to provide​ a small visual indicator to your users whenever the app is offline​.

Deploying to app stores is painful. It is hard. There are many aspects of deploying apps that you must get right, and the process differs between the Apple App Store and the Google Play Store. This post describes my experience with that process, and why I became so captivated with Progressive Web Applications (PWAs).

At the risk of offending some of my peers, I want to make an observation. As a group, we tend to be horrible at written communication. Software developers are some of the worst writers I have ever read. We make sloppy mistakes, both in spelling and in grammar. Whether you write technical articles for a living, blog posts for a hobby, or pull request comments, this article is an attempt to provide some simple guidance to improve your language and your writing.

A while ago I made a post I titled “Confessions of a Reluctant Ionic-React Fan”. That post led to an experiment where I began to recreate using Ionic-React a subset of one of my existing Ionic v4 apps written in Angular. That in turn led to my latest online video course, Ionic and React, Zero to App Store. This is my most ambitious course idea yet, which I explain in more detail below.

Have you ever needed to create an application for customer engagements? Imagine building a call center application from scratch that needs to support phone calls, web chat, and SMS messages, interactive voice response, speech recognition, and more. If the thought of doing all of that makes you cringe, you might want to consider Flex from Twilio.

Ionic v5 has been released, right in the middle of the conversion of one of my Ionic apps to Ionic-React. So in this post, I will describe what I had to do to upgrade this work-in-progress to the latest version.

The other day I made a post I titled “Confessions of a Reluctant Ionic-React Fan”. That post contained some snippets that got added to the default Ionic SideMenu template, but it neglected to provide any real functionality. In this post, I will attempt to recreate using Ionic-React a subset of one of my existing Ionic v4 apps written in Angular.

What happens when a committed Angular developer crosses over and experiments with React, while working on an Ionic application? Would it work out well, or result in catastrophe? As it so happens, I did that exact thing over the 2019/20 New Year’s break. I was asked to come up with some sample questions to test someone’s knowledge of Ionic. “Angular or React?” I asked. “How about both?” was the reply. So I set out to create some Ionic questions, based on some real issues I had faced, creating both Angular and React examples. This meant learning at least some of Ionic-React. This post summarizes some of the things that I found pleasantly surprising.