solidjs/templates

Jest SyntaxError: Cannot use import statement outside a module

denbon05 opened this issue · 1 comments

denbon05 commented

Describe the bug

There is an issue with importing '@solidjs/router' in ts file during test execution.
I've been trying to adjust jest config

const config: Config = {
  preset: 'solid-jest/preset/browser',
  setupFilesAfterEnv: [
    '<rootDir>/node_modules/@testing-library/jest-dom/extend-expect',
  ],
  roots: ['<rootDir>'],
  modulePaths: [compilerOptions.baseUrl],
  moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths, {
    prefix: '<rootDir>/',
  }),
  transform: {
    '^.+\\.ts?$': 'ts-jest',
    '^.+\\.[t|j]sx?$': 'babel-jest',
  },
  transformIgnorePatterns: [
    '<rootDir>/node_modules/',
    '<rootDir>/node_modules/@solidjs/(?!router/.*)',
  ],
};

But still facing the error:

    Details:

  /home/den/Dev/blockexplorer/node_modules/@solidjs/router/dist/index.js:1
  ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){import { isServer, delegateEvents, createComponent as createComponent$1, spread, mergeProps as mergeProps$1, template } from 'solid-js/web';
                                                                                    ^^^^^^

  SyntaxError: Cannot use import statement outside a module

  > 1 | import { useSearchParams } from '@solidjs/router';

Your Example Website or App

https://github.com/denbon05/blockexplorer/blob/main/__tests__/unit/utils/Paginator.test.ts

Steps to Reproduce the Bug or Issue

  1. Create ts file where you '@solidjs/router' will be imported;
  2. Use this file in the test with jest

Expected behavior

Could you provide configuration sample with jest https://github.com/solidjs/templates/tree/main/ts-router

Screenshots or Videos

image
image

Platform

  • OS: Ubuntu
  • Browser: Chrome, Brave
  • Version:
    "solid-js": "^1.7.8",
    "@solidjs/router": "^0.8.2",
    "jest": "^29.6.2",
    "jest-environment-jsdom": "^29.6.2",
    "jsdom": "^22.1.0",
    "solid-jest": "^0.2.0",
    "solid-testing-library": "^0.5.1",
    "ts-jest": "^29.1.1",
    "ts-node-dev": "^2.0.0",
    "typescript": "^5.1.6",

Additional context

No response

ryansolid commented

Scenario here looks like the project is not type "module" and so any non-transpiled code is not going to be able to have import statements without being in a .mjs file. This is a weird one because @solidjs/router is type module and I would have expected other imports to fail. Although I'm going to push this issue back to the template side as the problem is more with the project setup/defaults than with the router.

  • 👍1