Angular Web Framework Angular Quality & Compliance 2 — Questions and Answers
Question 1: Which Angular CLI command runs unit tests with code coverage reporting enabled?
- ng test --coverage
- ng test --code-coverage (Correct answer)
- ng build --test-coverage
- ng run test:coverage
Correct answer: ng test --code-coverage
The `ng test --code-coverage` flag instructs Karma to produce an Istanbul coverage report in the `/coverage` folder.
Question 2: In Angular's default Karma configuration, which coverage reporter generates an HTML report you can open in a browser?
- lcov
- html (Correct answer)
- text-summary
- clover
Correct answer: html
The `html` reporter produces a browsable HTML coverage report in the coverage output directory.
Question 3: What is the purpose of the `schemas: [NO_ERRORS_SCHEMA]` option in an Angular TestBed configuration?
- Disables all template binding checks
- Suppresses unknown element and attribute errors in the test host (Correct answer)
- Enables strict null checks in templates
- Prevents test isolation from child modules
Correct answer: Suppresses unknown element and attribute errors in the test host
`NO_ERRORS_SCHEMA` tells TestBed to ignore unknown elements and attributes, allowing shallow component testing without declaring every child component.
Question 4: Which ESLint rule configuration file does `ng lint` look for by default in a modern Angular project?
- .eslintrc.js or .eslintrc.json (Correct answer)
- tslint.json
- .angularlint.json
- angular-lint.config.ts
Correct answer: .eslintrc.js or .eslintrc.json
Modern Angular projects generated with `@angular-eslint/schematics` use `.eslintrc.js` or `.eslintrc.json` as the ESLint configuration file.
Question 5: What does the `fixture.detectChanges()` call do in an Angular unit test?
- Destroys the component fixture after assertions
- Triggers Angular's change detection cycle on the test fixture (Correct answer)
- Resets all input bindings to their default values
- Subscribes to all component observables automatically
Correct answer: Triggers Angular's change detection cycle on the test fixture
`detectChanges()` manually triggers Angular's change detection so the DOM reflects the component's current state during testing.
Question 6: Which Jasmine matcher should you use to verify that a spy was called exactly once?
- toHaveBeenCalled()
- toHaveBeenCalledTimes(1) (Correct answer)
- toHaveBeenCalledOnce()
- toBeCalledWith(1)
Correct answer: toHaveBeenCalledTimes(1)
`toHaveBeenCalledTimes(1)` asserts the spy was invoked exactly one time, distinguishing it from `toHaveBeenCalled()` which only checks that it was called at least once.
Question 7: In Angular, what is the recommended approach to test a component that depends on an HTTP service without making real network calls?
- Use HttpClientModule and intercept with nock
- Provide a mock service via `providers` in TestBed with a jasmine spy
- Import HttpClientTestingModule and use HttpTestingController (Correct answer)
- Set `useRealHttp: false` in the component decorator
Correct answer: Import HttpClientTestingModule and use HttpTestingController
`HttpClientTestingModule` paired with `HttpTestingController` lets you expect and flush HTTP requests in unit tests without real network activity.
Angular Web Framework Angular Quality & Compliance 2
Which Angular CLI command runs unit tests with code coverage reporting enabled?