Running this after you update to Angular 6 will result in the following error: Architect command with multiple targets cannot specify overrides. This error is not much of help when you know that before update the linting worked fine.

For this to work, we have to add the name of the application after the ng lint command: ng lint your_app_name --format stylish

For this example I’m gonna use the Atlassian Bitbucket Pipelines for continuous integration, but is not limited to it, you can use it in any other environment that is using a Docker Container, like Bitbucket, to test and build your Angular app.

To be able to test the Angular solution generated with @angular/cli, we need a Docker Container with Node to run npm install in order to install the dependencies and then we need an instance of chrome to run the tests.

For this, we have two solutions. I prefer the first one in which we take the official Node Docker Container, for the time being, 6.9.4, we install the chrome browser, then run npm install to fetch the dependencies of the project, then finally run our tests.

For Atlassian Bitbucket Pipelines, we are going to use the following code in the commit bitbucket-pipelines.yml file:

image: node:6.9.4

pipelines:
  default:
    - step:
        caches:
          - node
        script:
          - apt-get update; apt-get install -y gettext-base;
          - echo 'deb http://dl.google.com/linux/chrome/deb/ stable main' > /etc/apt/sources.list.d/chrome.list
          - wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -
          - set -x && apt-get update && apt-get install -y xvfb google-chrome-stable
          - wget -q -O /usr/bin/xvfb-chrome https://bitbucket.org/atlassian/docker-node-chrome-firefox/raw/ff180e2f16ea8639d4ca4a3abb0017ee23c2836c/scripts/xvfb-chrome
          - ln -sf /usr/bin/xvfb-chrome /usr/bin/google-chrome
          - chmod 755 /usr/bin/google-chrome
          - npm install
          - ./node_modules/@angular/cli/bin/ng -v
          - ./node_modules/@angular/cli/bin/ng test --watch=false

Please take into consideration that this is the code for a debian linux machine inside the Docker Container, so you have to adapt if you have a different machine.

I said that this solution is my preferred one because I want to test my app against the newest chrome version and I achieve this by installing the latest on each commit I make.

The downside of this solution is that it has to fetch all the updates for the linux machine and install chrome and it will take between 2 and 3 minutes to accomplish so this can become costly if you have a time limit on your Bitbucket account.

The second solution is to take a container from Docker Container Hub containing already Node and Chrome and to run the code starting from npm install. This way you cut in half the runtime, but you are going to test against the version of chrome installed into the Docker Container.

Have fun!

Why is this important? Progressive Web Apps (or PWA) are seen for many years now as the evolution of apps, bound to replace the native mobile apps and offer the user a seamless experience (native-like) on mobile platforms. With the announcement of Service Worker API development on Webkit/Safari, the future of across the board support for Service Worker never looked better.

What Service Worker is supposed to do? As a building part of a PWA, the Service Worker is a mandatory condition, because is the part of the application that is going to run in the background to handle application requests and caching, permitting the application to function while offline, thus having the native-like behavior.

As of @angular/cli version 1.6, you can create your Angular application containing the Angular Service Worker simply by passing the --service-worker flag when you create the app using the CLI:

ng new yourappname --service-worker

If you look now into the folder/app, you notice that a new file appeared,ngsw-config which is the configuration file for the added Angular Service Worker. Inside this file, you can decide which assets will be cached and in which manner.

Then, when you build your app, on the folder/dist you will see them ngsw.jsonand,ngsw-worker.js which is the actual Angular Service Worker.

More info on how to add the Angular Service Worker to your app here.

If you want to learn more about the Service Worker, here is a good article.