thefreakyamigo
Posts: 4
Joined: Wed Aug 03, 2022 7:35 am

Angular Jasmine Karma test failing with Highcharts-more plugin

I'm using column range chart that requires highcharts-more plugin. I imported it and used like below

import More from 'Highcharts/Highcharts-more';

More(Highcharts);

The application works fine. However If I run unit test, the test case fails by saying Cannot read properties of undefined (reading 'plotOptions')

Code: Select all

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { HighchartsChartModule } from 'highcharts-angular';
import { ChartComponent } from './chart.component';

describe('ChartComponent', () => {
  let component: ChartComponent;
  let fixture: ComponentFixture<ChartComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ HighchartsChartModule],
      declarations: [ ChartComponent ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
     fixture = TestBed.createComponent(ChartComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

rafalS
Posts: 2665
Joined: Thu Jun 14, 2018 11:40 am

Re: Angular Jasmine Karma test failing with Highcharts-more plugin

Hi,

welcome to our forum and thanks for contacting us with your issue!

To make sure that it actually a missing (or incorrectly loaded) highcharts-more module is a culprit, could you change the series' type to one of the basic ones, e.g. column, and see if the tests work fine?

It's hard to tell more without seeing a live demo/project. We could investigate it further, but could you please recreate a problem in a simple, minimal Angular app and share a package so we can clone it and debug?

Best regards!
Rafal Sebestjanski,
Highcharts Team Lead

Return to “Highcharts Usage”