Oleg-Sulzhenko

By using the second argument of the Effect Hook with care, you can decide whether it runs:

every time (no argument)
only on mount and unmount ([] argument)
only when a certain variable changes (e.g. [count] argument)

Oleg-Sulzhenko

End To End — Testing full blown user flows in the browser.
These tests consist of minimal mocks (i.e — you really are spinning up all the services that the user would be using).
Integration — Testing interactions between multiple services / components.
An “Integration test” is a bloated and often ambiguous term. For example, setting up a test that verifies interactions between multiple services (e.g — an api and a database) has overhead associated with it that is close to writing a full blown E2E test. On the other hand, writing a test that multiple react components work together in a redux environment has the complexity that is closer to a unit test. Read on to find out why ;)
Unit — Testing a single component / function in isolation.
A unit test is essentially testing input and output. It doesn’t get easier to reason about than this.
Some other types of testing:
Manual — A human being actually going through and verifying a flow on a real device.
Snapshot— Verifying a component’s rendered output.
Static — Te

Oleg-Sulzhenko

import {connect} from "react-redux";

const mapStateToProps = state => {
    return {
        roles: state.user.user.roles,
        roleConfigs: state.user.roleConfigs
    }
};

const mapDispatchToProps = dispatch => {

Oleg-Sulzhenko

Используйте switchMap когда вам нужно игнорировать предыдущее диспетчеризованное действие при поступлении нового действия.
Используйте mergeMap в том случае, если нужно параллельно обрабатывать все диспетчеризованные действия.
Используйте concatMap тогда, когда действия нужно обрабатывать одно за другим, в порядке их поступления.
Используйте exhaustMap в ситуациях, когда, в процессе обработки ранее поступивших действий, вам нужно игнорировать новые.

Иногда вам, для выполнения некоего действия, могут понадобиться данные из нескольких наблюдаемых объектов. 
В подобной ситуации избегайте создания подписок на такие объекты внутри блоков subscribe других наблюдаемых объектов. 
Вместо этого применяйте подходящие операторы для объединения команд в цепочки. 
Среди таких операторов можно отметить withLatestFrom и combineLatest.

Oleg-Sulzhenko

    this.service.getFileableSARs()
      .mergeMap((res: any) => {
        if (!(res.length === 0)) {
          this.snackbar.error('There are no pending SAR Reports to file');
          this.snackbar.info('Redirecting to overview...');
          this.router.navigate([`/sars/batches`]);
        } else {
          return this.service.generateSARBatch();
        }
      })

Oleg-Sulzhenko

_

Oleg-Sulzhenko

  <ng-container *ngIf="{
    users: users$ | async,
    adminsList: adminsList$ | async
  } as data">
    <div class="ads-table__content">
      <div *ngFor="let user of data.users" class="users__item">
  
        <div>{{user.userName}}</div>
        <div>{{user.email}}</div>
      

Oleg-Sulzhenko

//This is test suite
describe("Test Suite", function() {
    it("test spec", function() {
        expect( expression ).toEqual(true);
    });
});
-------------------------------------------------------------------------
Matchers

toBe()	passed if the actual value is of the same type and value as that of the expected value. It compares with === operator

Oleg-Sulzhenko

    providers: [{
      provide: HTTP_INTERCEPTORS,
      useClass: ErrorInterceptor,
      multi: true,
    }]

Oleg-Sulzhenko

const bannerDe: DebugElement = fixture.debugElement;
const bannerEl: HTMLElement = bannerDe.nativeElement;
  
*ngDocs
Angular relies on the DebugElement abstraction to work safely across all supported platforms. Instead of creating an HTML element tree, 
Angular creates a DebugElement tree that wraps the native elements for the runtime platform. 
The nativeElement property unwraps the DebugElement and returns the platform-specific element object.
** The DebugElement has other methods and properties that are useful in tests, as you'll see elsewhere in this guide.

https://angular.io/guide/testing#bycss