Skip to content

Jest test fails due to ESM syntax in 'gridstack/dist/angular' - SyntaxError: Unexpected token 'export' #3073

Open
@boopathy435

Description

@boopathy435

Describe the bug

When writing Jest unit tests in an Angular (Nx monorepo) project, importing GridstackModule from 'gridstack/dist/angular' fails with the following error:

Full error:
({"Object.":function(module,exports,require,__dirname,__filename,jest){export * from './lib/types';
^^^^^^

SyntaxError: Unexpected token 'export'

This seems to happen because Jest cannot parse untranspiled ESM code from gridstack/dist/angular.

Test suite failed to run

      Cannot find module 'gridstack-angular' from 'src/app/components/dashboard/dashboard/dashboard.component.ts'

      Require stack:
        src/app/components/dashboard/dashboard/dashboard.component.ts
        src/app/components/landing/landing.component.ts
        src/app/components/landing/landing.component.spec.ts

      > 18 | import { nodesCB, GridstackModule } from 'gridstack/dist/angular';
           | ^
       

        at Resolver._throwModNotFoundError (../../node_modules/jest-resolve/build/resolver.js:427:11)
        at Object.<anonymous> (src/app/components/dashboard/dashboard/dashboard.component.ts:18:1)
        at Object.<anonymous> (src/app/components/landing/landing.component.ts:18:1)
        at Object.<anonymous> (src/app/components/landing/landing.component.spec.ts:11:1)

To Reproduce

  1. Create an Angular app in an Nx workspace
  2. Import GridstackModule in any component like:

import { GridstackModule } from 'gridstack/dist/angular';

Run unit tests using Jest
Observe the error

Environment
gridstack version: ^10.1.1
Angular: 19.2.10
Jest: 29.7.0
ts-jest: 29.1.2
Nx workspace: yes

Steps to reproduce

https://stackblitz.com/edit/stackblitz-starters-q1pn8jce?file=src%2Findex.html

Expected behavior

Jest should be able to run test files that use GridstackModule without throwing ESM-related syntax errors.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions