chartjs / chartjs/chartjs-plugin-datalabels
TypeError: helpers.merge is not a function
- Dominant language
- JavaScript
- Stars
- 920
- Forks
- 507
- PR merge metrics
- No merged PRs in 30d
Description
Hi,
I have the error down below, this happened in jest after editing jest default configs.
I am using Nx Angular to run the test.
Please take a look on the related issues down.
# Current Behavior
```
● Test suite failed to run
TypeError: helpers.merge is not a function
3 | import { BaseChartDirective } from 'ng2-charts';
4 |
> 5 | import DataLabelsPlugin from 'chartjs-plugin-datalabels';
| ^
6 |
7 | /**
8 | * Component for displaying a bar chart.
at ../../node_modules/chartjs-plugin-datalabels/dist/chartjs-plugin-datalabels.js:582:9
at ../../node_modules/chartjs-plugin-datalabels/dist/chartjs-plugin-datalabels.js:8:81
at Object. (../../node_modules/chartjs-plugin-datalabels/dist/chartjs-plugin-datalabels.js:11:3)
at Object. (../../libs/chart/src/lib/bar-chart/bar-chart.component.ts:5:1)
at Object. (../../libs/chart/src/lib/chart.module.ts:7:1)
at Object. (../../libs/chart/src/index.ts:1:1)
at Object. (src/app/features/dashboard/dashboard.component.ts:10:1)
at Object. (src/app/features/dashboard/dashboard.component.spec.ts:12:1)
at TestScheduler.scheduleTests (../../node_modules/@jest/core/build/TestScheduler.js:333:13)
at runJest (../../node_modules/@jest/core/build/runJest.js:404:19)
at _run10000 (../../node_modules/@jest/core/build/cli/index.js:320:7)
at runCLI (../../node_modules/@jest/core/build/cli/index.js:173:3)
```
My test file in angular:
```
import { CommonModule } from '@angular/common';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ReactiveFormsModule } from '@angular/forms';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
import '@angular/localize/init';
import { AngularMaterialModule } from '@lib/core';
import { DashboardComponent } from './dashboard.component';
describe('DashboardComponent', () => {
let component: DashboardComponent;
let fixture: ComponentFixture;
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [
CommonModule,
BrowserAnimationsModule,
HttpClientTestingModule,
RouterTestingModule,
ReactiveFormsModule,
AngularMaterialModule,
],
declarations: [DashboardComponent],
}).compileComponents();
fixture = TestBed.createComponent(DashboardComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
```
My jest config:
```
/* eslint-disable */
export default {
displayName: 'core',
preset: '../../jest.preset.js',
setupFilesAfterEnv: ['/src/test-setup.ts'],
globals: {
'ts-jest': {
tsconfig: '/tsconfig.spec.json',
stringifyContentPathRegex: '\\.(html|svg)$',
},
},
coverageDirectory: '../../coverage/libs/core',
moduleNameMapper: {
'^lodash-es$': 'lodash',
'chart.js': 'node_modules/chart.js/dist/chart.mjs',
},
transform: {
'^.+\\.(ts|mjs|js|html)$': 'jest-preset-angular',
},
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$|lodash-es)'],
snapshotSerializers: [
'jest-preset-angular/build/serializers/no-ng-attributes',
'jest-preset-angular/build/serializers/ng-snapshot',
'jest-preset-angular/build/serializers/html-comment',
],
};
```
# Expected Behavior
- Ability to run any unit tests without issues
# Steps to Reproduce
1. Create empty workspace: Run npx create-nx-workspace
2. select → apps option -> angular
3. Edit the jest config to be as given in this issue
4. Run a test, error happens
# Environment
```
"dependencies": {
"@angular/animations": "~14.0.0",
"@angular/cdk": "^14.0.5",
"@angular/common": "~14.0.0",
"@angular/compiler": "~14.0.0",
"@angular/core": "~14.0.0",
"@angular/fire": "^7.4.1",
"@angular/forms": "~14.0.0",
"@angular/localize": "^14.0.7",
"@angular/material": "^14.1.1",
"@angular/material-moment-adapter": "^14.2.0",
"@angular/platform-browser": "~14.0.0",
"@angular/platform-browser-dynamic": "~14.0.0",
"@angular/router": "~14.0.0",
"@nrwl/angular": "14.4.3",
"bootstrap": "^5.1.3",
"chart.js": "^3.9.1",
"chartjs-plugin-annotation": "^2.0.1",
"chartjs-plugin-datalabels": "^2.1.0",
"enhanced-resolve": "^5.10.0",
"firebase": "^9.9.1",
"highcharts": "^10.2.0",
"moment": "^2.29.4",
"ng2-charts": "^4.0.0",
"path": "^0.12.7",
"rxjs": "~7.4.0",
"subsink": "^1.0.2",
"tslib": "^2.0.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "^14.0.6",
"@angular-eslint/eslint-plugin": "~14.0.0",
"@angular-eslint/eslint-plugin-template": "~14.0.0",
"@angular-eslint/template-parser": "~14.0.0",
"@angular/cli": "~14.0.0",
"@angular/compiler-cli": "~14.0.0",
"@angular/language-service": "~14.0.0",
"@nrwl/cli": "14.4.3",
"@nrwl/cypress": "14.4.3",
"@nrwl/eslint-plugin-nx": "14.4.3",
"@nrwl/jest": "14.4.3",
"@nrwl/linter": "14.4.3",
"@nrwl/workspace": "14.4.3",
"@types/jest": "^27.4.1",
"@types/node": "16.11.7",
"@typescript-eslint/eslint-plugin": "^5.29.0",
"@typescript-eslint/parser": "^5.29.0",
"autoprefixer": "^10.4.8",
"cypress": "^9.1.0",
"eslint": "~8.15.0",
"eslint-config-prettier": "8.1.0",
"eslint-plugin-cypress": "^2.10.3",
"jest": "^27.5.1",
"jest-preset-angular": "^11.0.1",
"ng-packagr": "~14.0.0",
"nx": "14.4.3",
"postcss": "^8.4.14",
"postcss-import": "~14.1.0",
"postcss-preset-env": "~7.5.0",
"postcss-url": "~10.1.3",
"prettier": "^2.6.2",
"tailwindcss": "^3.1.7",
"ts-jest": "^27.1.4",
"ts-node": "~10.8.0",
"typescript": "~4.7.2"
},
"engines": {
"node": "16.x.x"
}
```
# Related Issues
[#11888](https://github.com/nrwl/nx/issues/11888)
[nx-angular-typeerror-import-chart-registerables-is-not-iterable](https://stackoverflow.com/questions/73669898/nx-angular-typeerror-import-chart-registerables-is-not-iterable)
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.