Karma + Jasmine (Angular Testing): Where should I define mock classes and test variables?

Question

Let's take the following example:

const listDefinition: any = {
    module: "module",
    service: "service",
    listname: "listname"
};

@Component(...)
class MockTreeExpanderComponent extends TreeExpanderComponent {...}

class MockListConfigurationsService extends ListConfigurationsService {...}

describe('ColumnsListConfigurationsComponent Test cases', () => {
    let fixture: ComponentFixture<ColumnsListConfigurationsComponent>;
    let component: ColumnsListConfigurationsComponent;
    beforeEach(() => {
        TestBed.configureTestingModule({
            declarations: [
                ComponentToTest,
                MockTreeExpanderComponent
            ],
            providers: [
                 { provide: TreeListConfigurationService, useClass: MockTreeListConfigurationService }
            ]
        });
        fixture = TestBed.createComponent(ComponentToTest);
        component = fixture.componentInstance;
        component.listDefinition = listDefinition;
        fixture.detectChanges();
    });
});

As you can see, I have a Mock component (MockListViewerGridComponent) and service (ListConfigurationsService), a configuration variable (listDefinition) and the fixture and component that I want to test.

My question is about performance and test memory management:

1. The variables instantiated inside of describe method will be destroy as soon as the all tests inside of describe finishes?
2. Should I declare all variables and mock classes/services inside of describe?
3. Should I create a fixture in beforeEach or beforeAll? By doing that, I will have performance improvement?

Thank you!

Answer 1

I have an answer for point #3

let me share my own experience with the beforeAll.

We were using the beforeEach fixture creation in one of our application which were taking almost 12 min to build entire app. For each unit of work.

we have to build the app

1st time client side

2nd time on review branch and

3rd time release branch

which were taking almost 30 min (combined) to commit unit of work.

Now multiple this time with the head count of resources, bingo as a team we were wasting lot of time in only the app build process.

at some point we replaced the beforeEach with beforeAll with the help of this article, and it worked. We were able to reduce the build time by around 80%.

Short answers for point #1 and #2

1) Yes

2) Its better to create separate mock service. you can provide the object of it with the help of stub inside your before all block, and keep all the mocks in same folder.

providers: [
      { provide: XService, useClass: XServiceStub }
]

Answer 2

In my projects, I always create mock classes and test variable in the separate file. And after importing them to my spec file I declare them to the beforeEach block:

1. The main benefit is that the before each IT block it resets its previous reference of value.
2. Unused variables are removed from memory which results in a performance improve.

I hope this helps