ptomasroos / react-native-multi-slider

Android and iOS Pure JS react native multi slider
MIT License
770 stars 398 forks source link

Snapshot testing error: Cannot use import statement outside a module #164

Open M1chaelChen opened 4 years ago

M1chaelChen commented 4 years ago

version: master branch

Got SyntaxError: Cannot use import statement outside a module when shallow rendering with react-native-testing-library

Steps to Reproduce

Slider.js

import MultiSlider from '@ptomasroos/react-native-multi-slider';

<MultiSlider
  isMarkersSeparated
  values={prices}
  onValuesChange={values => {
    setPrices(values);
  }}
  min={1}
  max={50}
  sliderLength={windowWidth }
  customMarkerLeft={() => <SliderMarker />}
  customMarkerRight={() => <SliderMarker />}
  customLabel={() => null}
/>

Slider.test.js

import React from 'react';
import { render } from 'react-native-testing-library';
import Slider from '...';

describe('Slider tests', () => {
  test('renders correctly', () => {
    const output = render(
        <Slider />
    );
    expect(output).toMatchSnapshot();
  });
});

Expected Behavior

Snapshot tests pass

Actual Behavior

image

CoryFoy commented 3 years ago

If anyone else is running into this, I got around it by adding this to transformIgnorePatterns

"transformIgnorePatterns": [
      "node_modules/(?!(jest-)?react-native|@?ptomasroos/react-native-multi-slider|@?react-navigation)"
    ],