another.ts

import { DebugElement } from "@angular/core";
import { ComponentFixture, TestBed } from "@angular/core/testing"
import { By } from "@angular/platform-browser";
import { of } from "rxjs";
import { HeroService } from "../hero.service";
import { HeroesComponent } from "./heroes.component"


describe('HeroComponent (integration tests)', () => {
    let fixture: ComponentFixture<HeroesComponent>;
    let mockHeroService;
    let HEROES = [
        {id: 1, name: 'Superman', strength: 100},
        {id: 2, name: 'Batman', strength: 9},
        {id: 3, name: 'Star Lord', strength: 5}
    ]

    beforeEach(() => {
        mockHeroService = jasmine.createSpyObj(['getHeroes', 'deleteHero', 'addHero']);

        TestBed.configureTestingModule({
            declarations: [HeroesComponent],
            providers: [
                {provide: HeroService, useValue: mockHeroService }
            ],
        })
        fixture = TestBed.createComponent(HeroesComponent);
        mockHeroService.getHeroes.and.returnValue(of(HEROES));

    })

    it('should do something', () => {
        fixture.detectChanges();

        expect(fixture.componentInstance.heroes.length).toBe(3);
    })

    it('should have 3 li tags after initialization')


})