jacobmischka / svelte-flatpickr

Flatpickr component for Svelte.
https://www.npmjs.com/package/svelte-flatpickr
MIT License
160 stars 23 forks source link

Running jest : flatpickr is not a function #30

Closed bartektelec closed 1 year ago

bartektelec commented 3 years ago

I've tried running tests on components that include this package but they end up failing. At first I would get TypeError: Flatpickr is not a constructor then I added 'jest-svelte-resolver' to my jest.config.js which gave me SyntaxError: Unexpected token '<'

So I added transformIgnorePatterns: ['node_modules/(?!svelte-flatpickr)/'], in the jest.config and this is where I am stuck. I keep getting TypeError: flatpickr is not a function

I've previously tried doing import * as Flatpickr from 'svelte-flatpickr';, that would bypass the test problems, but break the app.

jest.config.js

const { pathsToModuleNameMapper } = require('ts-jest/utils');
const { compilerOptions } = require('./tsconfig');

module.exports = {
  preset: 'ts-jest',
  resolver: 'jest-svelte-resolver',
  testEnvironment: 'node',
  transform: {
    '^.+\\.svelte$': [
      'svelte-jester',
      {
        preprocess: true
      }
    ],
    '^.+\\.ts$': 'ts-jest'
  },
  transformIgnorePatterns: ['node_modules/(?!svelte-flatpickr)/'],
  setupFilesAfterEnv: [
    '@testing-library/jest-dom/extend-expect',
    './setupTests.ts'
  ],
  moduleFileExtensions: ['js', 'ts', 'svelte'],
  modulePathIgnorePatterns: ['<rootDir>/cypress/'],
  moduleNameMapper: pathsToModuleNameMapper(compilerOptions.paths, {
    prefix: '<rootDir>'
  })
};

Has anyone been able to fix this issue?

jacobmischka commented 3 years ago

Do you have a repo or setup with jest I can look at? I use jest for unit tests but not often for component testing.

jacobmischka commented 3 years ago

Nevermind, I was able to get to the same point you were: https://github.com/jacobmischka/svelte-typescript-jest/tree/svelte-flatpickr-test

I think this is fundamentally an issue with svelte-jester (https://github.com/mihar-22/svelte-jester/issues/16). Even when taking svelte-flatpickr out of the loop entirely and trying to just import flatpickr from 'flatpickr' also failed, despite having "allowSyntheticDefaultImports": true in tsconfig.json.