title: How to unit test NGXS in Angular?
body: <p>I am trying to write a unit test for a simple NGXS dispatch event that is inside ngOnIt. I also tried to follow the NGXS documentation but it didn't work. Can someone please guide me?</p>
  <p>charts.component.ts:</p>
  <pre><code>import { BarchartState } from './states/barchart-state/barchart.state';
  import * as BarchartActions from './states/barchart-state/barchart.actions';
  
  @Component({
  selector: 'charts',
  templateUrl: './charts.component.html',
  styleUrls: ['./charts.component.scss'],
  })
  
  export class ChartsComponent implements OnInit {
  @Select(BarchartState.simpleChartData) barchartData$: Observable&lt;any&gt;;
  @Select(BarchartState.isLoading) barchartIsLoading$: Observable&lt;boolean&gt;;
  
  constructor(private store: Store) { }
  
  ngOnInit(): void {
    this.store.dispatch([
    new BarchartActions.Fetch(),
    ]);
   }
  }
  </code></pre>
  <p>charts.component.spec.ts</p>
  <pre><code>import { ComponentFixture, TestBed } from '@angular/core/testing';
  import { NgxsModule, Store } from '@ngxs/store';
  import { ChartsComponent } from './charts.component';
  import { BarchartService } from './states/barchart-state/barchart.service';
  import { BarchartState } from './states/barchart-state/barchart.state';
  import * as BarchartActions from './states/barchart-state/barchart.actions';
  
  
  describe('ChartsComponent ', () =&gt; {
    let component: ChartsComponent ;
    let fixture: ComponentFixture&lt;ChartsComponent &gt;;
    let store: Store;
  
    beforeEach(async () =&gt; {
      await TestBed.configureTestingModule({
        declarations: [ ChartsComponent ],
        imports: [
          NgxsModule.forRoot([BarchartState])
        ],
        providers: [
          BarchartService
        ]
      })
      .compileComponents();
    });
  
    beforeEach(() =&gt; {
      fixture = TestBed.createComponent(ChartsComponent);
      component = fixture.componentInstance;
      fixture.detectChanges();
      store = TestBed.inject(Store);
    });
  
    it('should create', () =&gt; {
      expect(component).toBeTruthy();
    });
  
    // I tried doing this but it doesn't work. It gives an error that simpleChartData is undefined
    // Can someone please guide what should I write in the test below?
    it('it should dispatch barchart fetch action', () =&gt; {
      store.dispatch(new BarchartActions.Fetch());
  
      const data = store.selectSnapshot(state =&gt; state.barchart.simpleChartData);
      expect(data).toBe(true);
    });
  
  });
  
  </code></pre>
  <p>barchart.actions.ts</p>
  <pre><code>export class Fetch {
   static readonly type = '[Barchart] Fetch';
  }
  </code></pre>
  <p>Any leads would be helpful! Thank you!</p>