SyntaxError: Missing initializer in const declarat

问题:

I am writing a simple test using react-native-testing-library (my first steps with that library) in my react native expo app. But I am getting a confused error coming from somewhere inside react-native code base itself. Either there is something wrong with my code or there is a bug with react-native-testing-library npm library.

Here is simple jest test:

describe("AppTitle", () => {
  it("should display applicaton title", () => {
    const { getByText } = render(<AppTitle />);
    expect(getByText('App Name')).toBeTruthy();
  });
});

And here is the simple <AppTitle /> component (just a View and a Text)

export const AppTitle = () => {
  return (
    <View>
      <Text>App Name</Text>
    </View>
  );
};

But I am getting this error when I run the test:

...../Utilities/warnOnce.js:15

const warnedKeys: {[string]: boolean} = {};
      ^^^^^^^^^^

SyntaxError: Missing initializer in const declaration

at ScriptTransformer.transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:471:17)
at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:513:25)
at Object.<anonymous> (node_modules/react-native/Libraries/react-native/react-native-implementation.js:14:18)
...

This is a simple and straight forward template. Any help from a react-native + react-native-testing-library would be appreciate.

1. react: 16.8.3
2. react-native: fork from Expo 33
3. jest-expo: "^33.0.2"
4. react-native-testing-library": "1.7.0"

回答1:

I resolved this added "preset": "react-native" in jest.config.js file

回答2:

Const is easy to declare and it is not possible to reallocate literal values and must be assigned values at the same time as the declaration.

However, there is no return value in the current value. Your AppTitle class cannot be returned in the Render you put in.

Because you made it a arrow function. That's why the usage is different.

import { AppTitle } from "path"
...
describe("AppTitle", () => {
  it("should display applicaton title", () => {
    const { getByText } = render( AppTitle() );
    expect(getByText('App Name')).toBeTruthy();
  });
});

OR

describe("AppTitle", () => {
  it("should display applicaton title", () => {
    const { getByText } = render(<View>
                                    <Text>App Name</Text>
                                 </View>);
    expect(getByText('App Name')).toBeTruthy();
  });
});

lambda component

export const AppTitle = () => (
    <View>
      <Text>App Name</Text>
    </View>
  );

回答3:

I am using expo in my project. I have same issue. i forgot to add "preset": "jest-expo" to package.json. i added then the problem solved.

 "jest": { "preset": "jest-expo" },