I am facing an error with Angular 15.2.9 version:
TypeError: Cannot read properties of null (reading 'flags')
ng v:
I tried all the answers which are for Angular 9, but no luck.
karma.conf.js
// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html
module.exports = function (config) {
config.set({
basePath: '',
frameworks: ['jasmine', '@angular-devkit/build-angular'],
plugins: [
require('karma-jasmine'),
require('karma-typescript'),
require('karma-spec-reporter'),
require('karma-junit-reporter'),
require('karma-chrome-launcher'),
require('karma-firefox-launcher'),
require('karma-jasmine-html-reporter'),
require('karma-coverage'),
require('@angular-devkit/build-angular/plugins/karma'),
],
specReporter: {
maxLogLines: 5,
suppressErrorSummary: false,
suppressFailed: false,
suppressPassed: false,
suppressSkipped: false,
showSpecTiming: false,
failFast: false,
},
client: {
clearContext: false, // leave Jasmine Spec Runner output visible in browser
},
coverageReporter: {
dir: require('path').join(__dirname, 'coverage'),
reporters: [
{ type: 'html' },
{ type: 'text-summary' },
{ type: 'lcovonly' },
],
fixWebpackSourcePaths: true,
check: {
global: {
statements: 50,
branches: 15,
functions: 45,
lines: 50,
},
},
},
captureTimeout: 60000,
browserDisconnectTimeout: 60000,
browserDisconnectTolerance: 3,
browserNoActivityTimeout: 60000,
reporters: ['spec', 'progress', 'kjhtml', 'junit'],
junitReporter: {
outputDir: '../../../../test-reports/angular/', // results will be saved as $outputDir/$browserName.xml
outputFile: undefined, // if included, results will be saved as $outputDir/$browserName/$outputFile
suite: '', // suite will become the package name attribute in xml testsuite element
useBrowserName: true, // add browser name to report and classes names
nameFormatter: undefined, // function (browser, result) to customize the name attribute in xml testcase element
classNameFormatter: undefined, // function (browser, result) to customize the classname attribute in xml testcase element
properties: {}, // key value pair of properties to add to the <properties> section of the report
xmlVersion: null, // use '1' if reporting to be per SonarQube 6.2 XML format
},
port: 9876,
colors: true,
logLevel: config.ERROR,
browsers: ['CustomChromeHeadless'],
customLaunchers: {
CustomChromeHeadless: {
base: 'ChromeHeadless',
flags: ['--no-sandbox'],
},
},
});
};
.spec file:
import {ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { SuperSpecialityPageComponent } from './super-speciality-page.component';
import { RouterTestingModule } from '@angular/router/testing';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ActivatedRoute } from '@angular/router';
import { of } from 'rxjs';
import { SuperSpecialtyPageService } from '@pages/super-speciality-page/services/super-specialty-page.service';
import { SuperSpecialtyPage, SuperSpecialty } from '@entities/content-types/SuperSpecialty';
import { CommonModule } from '@angular/common';
import {ISuperSpecialtyPageResponse} from '@interfaces/content-types/ISuperSpecialtyPageResponse';
import {JsonaService} from '@services/jsona.service';
import { JsonaHtml, IJsonaHtmlResponse } from '@pages/link-landing-page/domain/JsonaHtml';
import { HealthWellnessArticlesPage } from '@entities/content-types/HealthWellnessArticlesPage';
import { AwardsSection } from '@entities/AwardsSection';
import { ConditionFinder } from '@entities/paragraphs/ConditionFinder';
import { DrupalLink } from '@entities/fields/DrupalLink';
import { CallToActionSection } from '@entities/CallToAction';
import { DepartmentHistory } from '@entities/paragraphs/DepartmentHistory';
import { FeaturedContent } from '@entities/paragraphs/FeaturedContent';
import { Icon } from '@entities/paragraphs/Icon';
import { PatientStory } from '@entities/paragraphs/PatientStory';
import { Programs } from '@entities/paragraphs/Programs';
import { SliderContent } from '@entities/paragraphs/SliderContent';
import { SuperSpecialtyNavigation } from '@entities/paragraphs/SuperSpecialtyNavigation';
import { SspSubspecialty } from '@entities/paragraphs/SspSubspecialties';
import { ApplicationRef } from '@angular/core';
import { IArticleRecipeSearchPage } from '@interfaces/content-types/IArticleRecipeSearchPage';
describe('SuperSpecialityPageComponent', () => {
let component: SuperSpecialityPageComponent;
let fixture: ComponentFixture<SuperSpecialityPageComponent>;
const sspSpy = jasmine.createSpyObj<SuperSpecialtyPageService>('SuperSpecialtyPageService', ['getSuperSpecialtyPage']);
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
imports: [
RouterTestingModule,
HttpClientTestingModule,
CommonModule,
],
declarations: [
SuperSpecialityPageComponent
],
providers: [
{ provide: ActivatedRoute, useValue: {
snapshot: {
data: {
'data': of({
isRevision: false,
entity: {
id: '1'
},
jsonapi: {
individual: '/jsonapi/node/super_specialty/4f0222fb-19eb-4aeb-935c-9ddfc91ba73c?include=field_awards.field_icon_image,field_condition_finder,field_ssp_cta,field_department_history.field_decades.field_years.field_timeline_media.field_image,field_department_history.field_decades.field_years.field_timeline_media.field_youtube_thumbnail,field_featured_content_items.field_image,field_icons.field_icon_image,field_leadership_practice_card,field_patient_stories.field_image,field_ssp_programs.field_ssp_program_card.field_image,field_ssp_hero_slider.field_cta_options,field_ssp_hero_slider.field_image,field_ssp_hero_slider.field_mobile_image,field_sub_navigation,field_sub_specialties.field_media.field_image,field_sub_specialties.field_sub_specialties&fields[file--file]=url,uri'
}
})
}
}
}},
{ provide: SuperSpecialtyPageService, useValue: sspSpy }
]
})
.compileComponents();
}));
beforeEach(() => {
const appRef = TestBed.inject(ApplicationRef) as ApplicationRef;
const mockResponse = require('@pages/super-speciality-page/mocks/MockSuperSpecialtyPageResponse1.json');
const MockSuperSpecialtyPageResponse: ISuperSpecialtyPageResponse = JsonaService.deserializeMockResponse(mockResponse);
sspSpy.getSuperSpecialtyPage.and.returnValue(of(new SuperSpecialtyPage(MockSuperSpecialtyPageResponse)));
fixture = TestBed.createComponent(SuperSpecialityPageComponent);
component = fixture.componentInstance;
appRef.components.push(fixture.componentRef);
component.content$ = mockResponse;
component.content$.sspCateogory = {
'drupal_internal__tid' : 12345,
'name' : 'Health at every Age'
};
component.content$.relatedArticles = [
{
title : 'Article 1'
},
{
title : 'Article 2'
},
{
title : 'Article 3'
},
{
title : 'Article 4'
},
{
title : 'Article 5'
},
{
title : 'Article 6'
},
];
component.content$.relatedArticles.length = 5;
component.cardsToBeDisplay = 5;
component.content$.overwriteArticlesID = [12345, 87368, 23947, 34902, 34343];
fixture.detectChanges();
});
it('should call ngoninit again', () => {
const mockResponse = require('@pages/super-speciality-page/mocks/MockSuperSpecialtyPageResponse1.json');
const MockSuperSpecialtyPageResponse: ISuperSpecialtyPageResponse = JsonaService.deserializeMockResponse(mockResponse);
sspSpy.getSuperSpecialtyPage.and.returnValue(of(new SuperSpecialtyPage(MockSuperSpecialtyPageResponse)));
fixture = TestBed.createComponent(SuperSpecialityPageComponent);
component = fixture.componentInstance;
component.content$ = mockResponse;
component.content$.relatedArticles = [];
component.content$.relatedArticles.length = 0;
component.cardsToBeDisplay = 5;
component.content$.overwriteArticlesID = [12345, 87368, 23947, 34902, 34343];
component.content$.sspCateogory = {
'drupal_internal__tid' : 12345,
'name' : 'Health at every Age'
};
fixture.detectChanges();
});
it('should call ngoninit for no sspCategory', () => {
const mockResponse = require('@pages/super-speciality-page/mocks/MockSuperSpecialtyPageResponse1.json');
const MockSuperSpecialtyPageResponse: ISuperSpecialtyPageResponse = JsonaService.deserializeMockResponse(mockResponse);
sspSpy.getSuperSpecialtyPage.and.returnValue(of(new SuperSpecialtyPage(MockSuperSpecialtyPageResponse)));
fixture = TestBed.createComponent(SuperSpecialityPageComponent);
component = fixture.componentInstance;
component.content$ = mockResponse;
component.content$.relatedArticles = [
{
title : 'Article 1'
},
{
title : 'Article 2'
},
{
title : 'Article 3'
},
];
component.content$.relatedArticles.length = 4;
component.cardsToBeDisplay = 5;
component.content$.overwriteArticlesID = [12345, 87368, 23947, 34902, 34343];
component.content$.sspCateogory = {};
fixture.detectChanges();
});
it('should call getRedirectURL', () => {
component.redirectURL = '/search/health-and-wellness';
component.getRedirectURL();
expect(component.getRedirectURL).toBeTruthy();
});
it('should call getRedirectURL empty', () => {
component.redirectURL = '/';
component.getRedirectURL();
expect(component.getRedirectURL).toBeTruthy();
});
afterEach(() => {
fixture.destroy();
});
it('should create', () => {
expect(component).toBeTruthy();
});
it('should call setSspActiveTab', () => {
component.sspActiveTab = 'department-history';
component.setSspActiveTab('department-history');
expect(component.setSspActiveTab).toBeTruthy();
});
it('should call setSspActiveTab', () => {
component.sspActiveTab = 'home';
component.setSspActiveTab('department-history');
expect(component.setSspActiveTab).toBeTruthy();
});
it('should call constantCard', () => {
component.content$.relatedArticles = [{}];
component.constantCard('123', 'abc', true);
expect(component.constantCard).toBeTruthy();
});
});
