Error on Galio files when run tests with jest

[felipebergamin]

Describe the bug Got an error when galio is imported by tested file. I'm not sure if it's a problem with Galio or Jest. Jest was configured like expo docs suggests.

/home/felipe/Dev/GoAppDesign/node_modules/galio-framework/src/index.js:4
    import Accordion from './Accordion';
           ^^^^^^^^^

    SyntaxError: Unexpected identifier

      2 | import { StyleSheet } from 'react-native';
      3 | import PropTypes from 'prop-types';
    > 4 | import { Button } from 'galio-framework';
        | ^
      5 | 
      6 | import { argonTheme } from '../constants';
      7 | 

      at Runtime.createScriptFromCode (node_modules/@jest/core/node_modules/jest-runtime/build/index.js:1059:14)
      at Object.<anonymous> (src/argon/Button.js:4:1)

To Reproduce Steps to reproduce the behavior:

1. A published a minimal project that reproduces the error
2. Clone https://github.com/felipebergamin/reproduce-galio-test-error
3. Install deps with yarn
4. Run test with yarn jest

Expected behavior Success test

Screenshots

[palingheorghe]

Hi @felipebergamin ! Thanks for opening up this issue. I'll have to take a look at this, right now I'm not sure where exactly is the problem and why is this error showing up.

[davidsierradz]

Hi, I have:

  "jest": {
    "preset": "react-native",
    "transformIgnorePatterns": [
      "node_modules/(?!(react-native|galio-framework|react-native-vector-icons)/)"
    ]
  }

This fixes OP error. But now I'm getting this one:

yarn run v1.22.4
$ jest
 FAIL  __tests__/App-test.js
  ● Test suite failed to run

    /home/neuromante/code/mobile/node_modules/galio-framework/src/fonts/galio.ttf:1

    SyntaxError: Invalid or unexpected token

      at Runtime._execModule (node_modules/jest-runtime/build/index.js:1166:56)
      at Object.<anonymous> (node_modules/galio-framework/src/index.js:23:19)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        3.241 s
Ran all test suites.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

[iswanj]

@davidsierradz Have you managed to solve this issue?

[davidsierradz]

@iswanj No, sorry.

[tuttodev]

I have the equal @davidsierradz problem too

[Thremulant]

Having the same problem. @davidsierradz did you find a solution?

[Thremulant]

I modified my jest configuration to add this:

"moduleNameMapper": {
 +     "galio": "identity-obj-proxy"
    }

And installed the identity-obj-proxy package npm i identity-obj-proxy and it solved the font problem. It seems that the problem was that the font was not recognized, because it doesn't know the extension.

Here's where I found the solution link

[gartennoel]

@felipebergamin the problem is that Jest needs some modules compiled before it runs the tests and is unable to do this without you telling it which ones to "pre-compile". This posting has details. In short, I had to keep doing an npm run test and every time look to a line that looks like this:

    Details:

    /Users/noelmiller/workspace/ginfinity/node_modules/@unimodules/core/build/index.js:1
    export * from './AdapterProxy';
    ^^^^^^

to see which module was a problem and add it to the jest.config.js transformIgnorePatterns list. I was confused and thought the transformIgnorePatterns list is in package.json, but it won't work if you try to put it there. This is what my list looks like

  transformIgnorePatterns: [
    'node_modules/(?!(react-native'
    + '|galio-framework'
    + '|@expo/vector-icons'
    + '|expo-font'
    + '|@unimodules'
    + '|expo-asset'
    + '|expo-constants'
    + '|expo-linear-gradient'
    + '|react-native-modal-dropdown'
    + '|deprecated-react-native-listview'
    + ')/)',
  ],

[julienclaerhout]

Anyone found a solution?