个人中心
gpt4 book ai didi

react-native - 语法错误 : Unexpected identifier - Nonsensical error in React Enzyme testing

转载 作者：行者123 更新时间：2023-12-04 15:46:26 24 4
gpt4 key购买 nike

我正在使用 React Native 进行开发，并尝试按照 https://airbnb.io/enzyme/docs/guides/react-native.html 中的说明设置玩笑测试。 .

我想我已经正确设置了所有内容。这是我的配置:

//setup-tests.js

import "react-native";
import "jest-enzyme";
import Adapter from "enzyme-adapter-react-16";
import Enzyme from "enzyme";

 // Set up DOM in node.js environment for Enzyme to mount to
const { JSDOM } = require("jsdom");

const jsdom = new JSDOM("<!doctype html><html><body></body></html>");
const { window } = jsdom;

function copyProps(src, target) {
  Object.defineProperties(target, {
    ...Object.getOwnPropertyDescriptors(src),
    ...Object.getOwnPropertyDescriptors(target)
  });
}

global.window = window;
global.document = window.document;
global.navigator = {
  userAgent: "node.js"
};
copyProps(window, global);

// Set up Enzyme to mount to DOM, simulate events, and inspect the DOM in tests.
Enzyme.configure({ adapter: new Adapter() });

/* Ignore some expected warnings
 * see: https://jestjs.io/docs/en/tutorial-react.html#snapshot-testing-with-mocks-enzyme-and-react-16
 * see https://github.com/Root-App/react-native-mock-render/issues/6
 */
const originalConsoleError = console.error;
console.error = message => {
  if (message.startsWith("Warning:")) {
    return;
  }

  originalConsoleError(message);
};

// jest.config.js

module.exports = {
  setupFilesAfterEnv: "<rootDir>setup-tests.js"
};

// Test.test.js

import React from "react";
import renderer from "react-test-renderer";
import { mount, ReactWrapper } from "enzyme";
import { Provider } from "react-redux";
import { Text } from "react-native";

import LoginView from '../js/LoginView'

您会看到 LoginView 的顶部一会儿。

您会注意到我什至没有在测试文件中编写任何测试，我只是想让 jest 运行到可以评估测试的程度。

没有 import LoginView ，笑话运行并“失败”，因为我的测试套件必须至少包含一个测试。听起来不错。

加入 import LoginView ，我收到此错误(显示 LoginView 顶部的导入语句:

    import Button from './buttons/Button';
           ^^^^^^

    SyntaxError: Unexpected identifier

      1 | import React, { Component } from "react";
    > 2 | import { Input, Button, Image } from "react-native-elements";
        | ^
      3 | import { Text, View } from "react-native";
      4 | import { connect } from "react-redux";
      5 | import F8StyleSheet from "./F8StyleSheet";

      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> (js/LoginView.js:2:1)

所以这对我来说没有意义，原因有很多。

  1. LoginView在实际应用程序中呈现良好，没有“意外标识符”崩溃或警告或任何东西
  2. 第 2 行错误中下方的箭头指向 import ，这当然不应该出乎意料。
  3. 然后是上方的箭头，表示来自 react-native-elements 的一行，所以，我不知道。

现在，我确实想到 jest.config.js文件确实要求我使用 module.exports , 当我尝试使用 export default { setupFiles } 时失败/崩溃(或者我尝试这样做，允许 VS Code 将其更新为 ES6 语法)。所以也许这就是它不喜欢 import 的原因.

就算是这样，我也不知道接下来要做什么。

更新

我输入了 Brian 的回答中建议的代码，但我现在遇到了所有新错误。尽管错误建议修复，但似乎无济于事——我已将以下内容添加到我的 package.json在 jest 下.我不确定在哪里 Dimensions.js反正是；另外，我假设我正在为 React Native 做的所有这些设置都知道如何识别 file.ios.js 的约定。和 file.android.js相当于file .

这是我按照说明进行的“修复”，但一点用都没有。

 "moduleFileExtensions": [
      "js",
      "json",
      "jsx",
      "ts",
      "tsx",
      "node",
      "ios.js",
      "android.js"
    ]

这是新的错误。

 FAIL  tests/Test.test.js
  ● Test suite failed to run

    Cannot find module './Platform' from 'Dimensions.js'

    However, Jest was able to find:
        './Platform.android.js'
        './Platform.ios.js'

    You might want to include a file extension in your import, or update your 'moduleFileExtensions', which is currently ['js', 'json', 'jsx', 'ts', 'tsx', 'node'].

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

    However, Jest was able to find:
        '../Utilities/Dimensions.js'

    You might want to include a file extension in your import, or update your 'moduleFileExtensions', which is currently ['js', 'json', 'jsx', 'ts', 'tsx', 'node'].

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

    However, Jest was able to find:
        'buttons/Button.js'

    You might want to include a file extension in your import, or update your 'moduleFileExtensions', which is currently ['js', 'json', 'jsx', 'ts', 'tsx', 'node'].

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

    However, Jest was able to find:
        '../js/LoginView.js'

    You might want to include a file extension in your import, or update your 'moduleFileExtensions', which is currently ['js', 'json', 'jsx', 'ts', 'tsx', 'node'].

    See https://jestjs.io/docs/en/configuration#modulefileextensions-array-string

      at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:229:17)
      at Object.require (node_modules/react-native/Libraries/Utilities/Dimensions.js:14:18)

最佳答案

react-native-elements 包含 ES6 代码。

ES6 代码需要编译后才能被 Jest 运行。

默认情况下 Jest 不会在 node_modules 中编译任何东西，但是 react-native 有一个 jest-preset 那tells Jest to compile react-native and @react-native-community modules .

要包含react-native-elements，您需要通过adding the following to your Jest config 告诉Jest 编译它。 :

transformIgnorePatterns: [
  'node_modules/(?!(jest-)?react-native|@react-native-community|react-native-elements)',
]

关于react-native - 语法错误 : Unexpected identifier - Nonsensical error in React Enzyme testing，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55599859/

24 4 0
文章推荐： linux-kernel - 从 GRUB 菜单项运行脚本
文章推荐： import - Google 日历不显示 S3 上托管的 iCalendar (ics) 文件中的事件
文章推荐： azure - 为 Azure Web App 配置应用程序网关时出现 502 错误
文章推荐： groovy - 如何从单个 sh 脚本输出定义多个环境变量
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com