doc: update test reports section

| `NG_BUILD_ARGS` | Angular [ng build](https://angular.io/cli/build) arguments | `build --prod`                           |

| `NG_JUNIT_TEST_REPORT_PATH` | Path to JUnit report                           | `reports/junit_test_report.xml`          |

The next chapters presents some requirements related to your unit tests (using Karma).

#### Use a headless browser

To be able to launch unit tests with Angular CLI, the Angular template requires a headless browser within the Docker

image `NG_CLI_IMAGE` (it is the case with the default image, [docker-ng-cli-karma](https://github.com/trion-development/docker-ng-cli-karma)).

#### Code Coverage

In order to be able to compute and enable [GitLab code coverage integration](https://docs.gitlab.com/ee/user/project/merge_requests/test_coverage_visualization.html),

the Angular template expects the following in your `karma.conf.js` (this is done by default if your project was generated with [`ng new`](https://angular.io/cli/new) command).

Add the [karma-coverage](https://www.npmjs.com/package/karma-coverage) package:

```js

  require('karma-coverage'),

```

Add the config section:

```js

  // [to be continuous]: karma-coverage configuration (needs 'text-summary' to let GitLab grab coverage from stdout)

  coverageReporter: {

    dir: require("path").resolve("reports"),

    subdir: ".",

    reporters: [{ type: "lcovonly" }, { type: "text-summary" }],

  },

```

#### JUnit report

In order to be able to [integrate your test reports to GitLab](https://docs.gitlab.com/ee/ci/junit_test_reports.html),

the Angular template expects the following in your `karma.conf.js`.

Add the [karma-junit-reporter](https://github.com/karma-runner/karma-junit-reporter) package as dev dependency:

```shell

npm install --save-dev karma-junit-reporter

```

In your `karma.conf.js`, add the plugin:

```js

  require('karma-junit-reporter'),

```

Add the config section:

```js

  // [to be continuous]: karma-junit-reporter configuration (report needs to be in 'reports/junit_test_report.xml')

  junitReporter: {

    outputDir: require('path').resolve('reports'),

    outputFile: 'junit_test_report.xml',

    useBrowserName: false,

    ...

  }

```

#### SonarQube report

If you're using SonarQube and if you want to generate a test report [compatible with SonarQube](https://docs.sonarqube.org/latest/analysis/generic-test/),

the Angular template expects the following.

By default Angular CLI do not allow to generate test report compatible with Sonar to do so, you need to add [karma-sonarqube-execution-reporter](https://github.com/lisrec/karma-sonarqube-execution-reporter) to your project as a dev dependency:

```shell

npm install --save-dev karma-sonarqube-execution-reporter

```

In your `karma.conf.js`, add the plugin:

```js

  require('karma-sonarqube-execution-reporter')

```

Add the config section:

```js

  sonarQubeExecutionReporter: {

    outputDir: require('path').resolve('reports'),

    outputFile: 'sonar_test_report.xml',

    ...

  }

```

Finally add the `sonarqubeUnit` reporter in the reporters parameter of the `NG_TEST_ARGS` variable :

```yaml

NG_TEST_ARGS:  test --reporters junit,sonarqubeUnit`

```

### `ng-e2e` job

The Angular template features a job `ng-e2e` that performs **protractor tests**

* `<gitlab-host>` is your GitLab host domain name.

* `<your_project_id>` is your project ID, **found on the project’s home page**.

#### Unit testing with Karma

##### Use an headless browser

To be able to launch unit tests with Angular CLI, the Angular template requires a headless browser within the Docker

image `NG_CLI_IMAGE` (it is the case with the default image, [docker-ng-cli-karma](https://github.com/trion-development/docker-ng-cli-karma)).

#### Code Coverage

In order to be able to compute code coverage, the Angular template expects the following in your `karma.conf.js`

(this is done by default if your project was generated with [`ng new`](https://angular.io/cli/new) command).

Add the plugin:

```js

  require('karma-coverage-istanbul-reporter')

```

Add the config section:

```js

  coverageIstanbulReporter: {

    dir: require('path').resolve('reports'),

    reports: ['html', 'lcovonly', 'text-summary'],

    fixWebpackSourcePaths: true

  }

```

#### JUnit report

In order to be able to [integrate your test reports to GitLab](https://docs.gitlab.com/ee/ci/junit_test_reports.html),

the Angular template expects the following in your `karma.conf.js`.

Add the add [karma-junit-reporter](https://github.com/karma-runner/karma-junit-reporter) as dev dependency:

```shell

npm install --save-dev karma-junit-reporter

```

In your `karma.conf.js`, add the plugin:

Add the plugin:

```js

  require('karma-junit-reporter')

```

Add the config section:

```js

  junitReporter: {

    outputDir: require('path').resolve('reports'),

    outputFile: 'junit_test_report.xml',

    useBrowserName: false,

    ...

  }

```

#### SonarQube report

In order to generate a test report [compatible with SonarQube](https://docs.sonarqube.org/latest/analysis/generic-test/),

the Angular template expects the following.

By default Angular CLI do not allow to generate test report compatible with Sonar to do so need to add [karma-sonarqube-execution-reporter](https://github.com/lisrec/karma-sonarqube-execution-reporter) to your project.

Add the add [karma-sonarqube-execution-reporter](https://github.com/lisrec/karma-sonarqube-execution-reporter) as dev dependency:

```shell

npm install --save-dev karma-sonarqube-execution-reporter

```

In your `karma.conf.js`, add the plugin:

```js

  require('karma-sonarqube-execution-reporter')

```

Add the config section:

```js

  sonarQubeExecutionReporter: {

    outputDir: require('path').resolve('reports'),

    outputFile: 'sonar_test_report.xml',

    ...

  }

```

Finally add the sonarqubeUnit reporter in the reporters parameter of the `NG_TEST_ARGS` variable :

```yaml

NG_TEST_ARGS:  test --reporters junit,sonarqubeUnit`

```

## SonarQube analysis

If you're using the SonarQube template to analyse your Angular code, here is a sample `sonar-project.properties` file: