ReferenceError: Cannot access 'MtxGrid' before initialization

[jackedudok]

Hi 👋

After updating @ng-matero/extensions to 17v, I am encountering an issue when using the MtxGridModule from the @ng-matero/extensions/grid package in my Angular application. The error message is as follows:

Steps to Reproduce
Import MtxGridModule.
Run unit tests.

Thanks in advance for your help

[yuriydetsyk]

Same, applicable after upgradnig both Angular & Ng Matero extensions packages from v16 to v17.

[damingerdai]

Thank you for reporting this issue.

I understand that you're encountering the "ReferenceError: Cannot access 'MtxGrid' before initialization" error while using ng-matero. However, the information provided is limited, making it difficult for me to accurately diagnose and resolve the problem.

To effectively assist you, I would need more details about the specific scenario where this error occurs, such as:

1. Code snippets: Share relevant code fragments where you're attempting to use MtxGrid. This will help me understand the context and identify potential issues.

2. Error details: Provide the complete error message, including any stack trace or additional information that might be displayed. This could help pinpoint the exact location of the problem.

3. Setup and configuration: Describe your project setup, including Angular version, ng-matero version, and any relevant configuration details. This will ensure I have a complete picture of your development environment.

4. Steps to reproduce: If possible, provide a step-by-step guide on how to reproduce the error consistently. This will allow me to replicate the issue and investigate further.

Once I have a better understanding of the issue, I can provide more targeted assistance and help you resolve this error effectively.

In the meantime, I recommend trying the following:

1. Remove Dependencies and Lock Files:

Delete the node_modules folder and package-lock.json file from your project directory.

Run npm install or yarn install to reinstall all dependencies.

This process will ensure you have the latest versions of all dependencies and potentially fix any dependency-related issues.

2. Provide a Minimal Reproducible Example:

If the error persists, consider creating a minimal reproducible example of the issue. This involves creating a simplified project that demonstrates the error without any unnecessary code or dependencies. Sharing this example will make it easier for me to isolate the problem and provide a solution.

Please provide the requested information or the reproducible example, and I'll be happy to assist you further in resolving this error.

[jackedudok]

Thank you for your response.

Here are the steps I took to reproduce the issue:

1. Created a new Angular project.
2. Configured Jest for testing.
3. Added MtxGrid to the App component.
4. Imported MtxGridModule.
5. npm run test
6. Below is my stack trace:

FAIL test src/app/app.component.spec.ts
● Test suite failed to run

ReferenceError: Cannot access 'MtxGrid' before initialization

  1 | import { TestBed } from '@angular/core/testing';
  2 | import { AppComponent } from './app.component';
> 3 | import { MtxGridModule } from "@ng-matero/extensions/grid";
    | ^
  4 | import { MockModule } from "ng-mocks";
  5 |
  6 | describe('AppComponent', () => {

  at Object.<anonymous> (node_modules/@ng-matero/extensions/fesm2022/mtxGrid.mjs:859:169)
  at Object.<anonymous> (src/app/app.component.spec.ts:3:1)

Test Suites: 1 failed, 1 total

Here are the versions of the packages I am using:

"dependencies": {
"@angular/animations": "^17.3.0",
"@angular/cdk": "^17.3.10",
"@angular/common": "^17.3.0",
"@angular/compiler": "^17.3.0",
"@angular/core": "^17.3.0",
"@angular/forms": "^17.3.0",
"@angular/material": "^17.3.10",
"@angular/platform-browser": "^17.3.0",
"@angular/platform-browser-dynamic": "^17.3.0",
"@angular/router": "^17.3.0",
"@ng-matero/extensions": "^17.3.2",
"ng-mocks": "^14.13.0",
"rxjs": "~7.8.0",
"tslib": "^2.3.0",
"zone.js": "~0.14.3"
},
"devDependencies": {
"@angular-builders/jest": "^17.0.3",
"@angular-devkit/build-angular": "^17.3.8",
"@angular/cli": "^17.3.8",
"@angular/compiler-cli": "^17.3.0",
"@types/jasmine": "~5.1.0",
"@types/jest": "^29.5.12",
"jasmine-core": "~5.1.0",
"jest": "^29.7.0",
"typescript": "~5.4.2"
}

Also example on Stackblitz: https://stackblitz.com/edit/stackblitz-starters-mlgvxc

I hope this provides enough context to help diagnose the issue. If you need any more information or further steps from my end, please let me know.

Thank you in advance for your assistance.

[nzbin]

17.3.3 has fixed, please have a try.

[jackedudok]

Fixed, thanks a lot