业力中的茉莉花测试:未捕获的ReferenceError:未定义require

时间:2022-07-02 20:26:09

Karma can not recognize 'require' statement in JSFileSpec.js file. Running karma.conf.js:

Karma无法识别JSFileSpec.js文件中的'require'语句。运行karma.conf.js:

(function() {
    describe("DummyEmitter creation", function(){
        return it("creation", function(){
            var DummyEmitter = require('Util.DummyEmitter');
            var dummy = new DummyEmitter('someName');
            return expect(dummy).toBeDefined();
        });
    });
})();

ReferenceError: require is not defined

ReferenceError:未定义require

7 个解决方案

#1


44  

I was facing same issue, when trying to use require('module_name') (CommonJS style modules) inside a test case and running it using Karma.

当我尝试在测试用例中使用require('module_name')(CommonJS样式模块)并使用Karma运行它时,我遇到了同样的问题。

The reason was require function is not available to browser (it is undefined). To provide it to browser we can browserify the test js files before Karma runs test case in browser using karma-browserify.

原因是浏览器无法使用require函数(未定义)。为了将它提供给浏览器,我们可以在Karma使用karma-browserify在浏览器中运行测试用例之前浏览化测试js文件。

Install karma-browserify using npm install karma-browserify --save-dev

使用npm install karma-browserify --save-dev安装karma-browserify

Update karma.conf.js

更新karma.conf.js

 frameworks: ['jasmine', 'browserify'],
 preprocessors: {
    'app/tests/*.js': [ 'browserify' ]
 },
 plugins: [..., 'karma-browserify'],

After these changes browserified file is run in browser by Karma, in which require is defined, and test case runs successfully

在这些更改之后,浏览器化文件由Karma在浏览器中运行,其中定义了require,并且测试用例成功运行

#2


21  

You might be using a glob pattern that is picking up stuff inside karma's bin directory. Try to execute your tests by using absolute paths to see if that fixes it.

你可能正在使用一个在karma的bin目录中拾取东西的glob模式。尝试使用绝对路径执行测试以查看是否修复了它。

If so then you know your glob pattern is grabbing stuff you did not want to.

如果是这样,那么你知道你的glob模式正在抓住你不想要的东西。

For example change

例如改变

{pattern: '**/**/*_test.js'},

to

{pattern: 'stuff/dashboard/home-page_test.js'},

see if that fixes your problem.

看看是否能解决您的问题。

#3


6  

Karma is a test runner that runs your tests in a browser. Whatever browser you setup doesn't know what the require function is.

Karma是一个在浏览器中运行测试的测试运行器。无论您设置什么浏览器都不知道需要的功能是什么。

To use jasmine with node try jasmine-node. https://github.com/mhevery/jasmine-node

要在节点上使用jasmine,请尝试使用jasmine-node。 https://github.com/mhevery/jasmine-node

To have karma run jasmine node tests, try (wait for it....) jasmine-node-karma. https://npmjs.org/package/jasmine-node-karma

要让业力运行茉莉花节点测试,请尝试(等待它......)jasmine-node-karma。 https://npmjs.org/package/jasmine-node-karma

Here's the jasmine wiki pages where I found the above info. https://github.com/pivotal/jasmine/wiki

这是我找到上述信息的茉莉维基页面。 https://github.com/pivotal/jasmine/wiki

Hope this helps.

希望这可以帮助。

#4


2  

I've encountered today a similar issue. In my case the solution was quite simple. I am using Babel via Webpack to process .jsx files. Files with the .jsx extension did test successfully, while simple .js files throwed a reference error.

我今天遇到过类似的问题。就我而言,解决方案非常简单。我通过Webpack使用Babel来处理.jsx文件。扩展名为.jsx的文件测试成功,而简单的.js文件引发了引用错误。

If anyone has a similar or equivalent setup they might be able to share the same solution.

如果任何人有类似或相同的设置,他们可能能够共享相同的解决方案。

In karma.config.js I had to specify preprocessors for .js files as I did for the .jsx ones. Here's an example:

在karma.config.js中,我必须像.jsx那样为.js文件指定预处理器。这是一个例子:

preprocessors: {
  "app/tests/**/*.test.jsx": ["webpack", "sourcemap"],
  "app/tests/**/*.test.js": ["webpack", "sourcemap"]
},

I better add that in my case Webpack passes the code to Babel to compile so that it can run in the browser. I can copy and paste the entire webpack.config.js and karma.config.js if anyone needs them.

我最好补充说,在我的情况下,Webpack将代码传递给Babel进行编译,以便它可以在浏览器中运行。如果有人需要,我可以复制并粘贴整个webpack.config.js和karma.config.js。

#5


0  

I use webpack for that purpose. I published my configuration on npm to save my time for the future projects. Just run npm install webpack-karma-jasmine, and create config files for webpack and karma as described in docs: https://www.npmjs.com/package/webpack-karma-jasmine

我为此目的使用webpack。我在npm上发布了我的配置,以节省我未来项目的时间。只需运行npm install webpack-karma-jasmine,并按照文档中的描述为webpack和karma创建配置文件:https://www.npmjs.com/package/webpack-karma-jasmine

#6


0  

  module.exports = function(config) {
    config.set({

      basePath: '',


      frameworks: ['mocha', 'chai'],

      files: [
        'test/*.test.js'
      ],

      exclude: [
      ],

      preprocessors: {
        'test/*.test.js': ['webpack']
      },

      webpack: {
        mode: "none",
        module: {
          rules: [
            { test: /\.js?$/, loader: "babel-loader",  options: { presets: ["env"] }, }
          ]
        }
      },

      reporters: ['progress'],

      port: 9876,

      colors: true,

      logLevel: config.LOG_INFO,

      autoWatch: true,

      browsers: ['Chrome'],

      singleRun: false,

      concurrency: Infinity,

      browserNoActivityTimeout: 100000
    })
  }

use webpack

使用webpack

#7


-1  

If someone still couldnt resolve with the above solutions, this is what helped me. yarn add browserify and watchify

如果有人仍然无法解决上述解决方案,这对我有帮助。纱线添加浏览器并观察

#1


44  

I was facing same issue, when trying to use require('module_name') (CommonJS style modules) inside a test case and running it using Karma.

当我尝试在测试用例中使用require('module_name')(CommonJS样式模块)并使用Karma运行它时,我遇到了同样的问题。

The reason was require function is not available to browser (it is undefined). To provide it to browser we can browserify the test js files before Karma runs test case in browser using karma-browserify.

原因是浏览器无法使用require函数(未定义)。为了将它提供给浏览器,我们可以在Karma使用karma-browserify在浏览器中运行测试用例之前浏览化测试js文件。

Install karma-browserify using npm install karma-browserify --save-dev

使用npm install karma-browserify --save-dev安装karma-browserify

Update karma.conf.js

更新karma.conf.js

 frameworks: ['jasmine', 'browserify'],
 preprocessors: {
    'app/tests/*.js': [ 'browserify' ]
 },
 plugins: [..., 'karma-browserify'],

After these changes browserified file is run in browser by Karma, in which require is defined, and test case runs successfully

在这些更改之后,浏览器化文件由Karma在浏览器中运行,其中定义了require,并且测试用例成功运行

#2


21  

You might be using a glob pattern that is picking up stuff inside karma's bin directory. Try to execute your tests by using absolute paths to see if that fixes it.

你可能正在使用一个在karma的bin目录中拾取东西的glob模式。尝试使用绝对路径执行测试以查看是否修复了它。

If so then you know your glob pattern is grabbing stuff you did not want to.

如果是这样,那么你知道你的glob模式正在抓住你不想要的东西。

For example change

例如改变

{pattern: '**/**/*_test.js'},

to

{pattern: 'stuff/dashboard/home-page_test.js'},

see if that fixes your problem.

看看是否能解决您的问题。

#3


6  

Karma is a test runner that runs your tests in a browser. Whatever browser you setup doesn't know what the require function is.

Karma是一个在浏览器中运行测试的测试运行器。无论您设置什么浏览器都不知道需要的功能是什么。

To use jasmine with node try jasmine-node. https://github.com/mhevery/jasmine-node

要在节点上使用jasmine,请尝试使用jasmine-node。 https://github.com/mhevery/jasmine-node

To have karma run jasmine node tests, try (wait for it....) jasmine-node-karma. https://npmjs.org/package/jasmine-node-karma

要让业力运行茉莉花节点测试,请尝试(等待它......)jasmine-node-karma。 https://npmjs.org/package/jasmine-node-karma

Here's the jasmine wiki pages where I found the above info. https://github.com/pivotal/jasmine/wiki

这是我找到上述信息的茉莉维基页面。 https://github.com/pivotal/jasmine/wiki

Hope this helps.

希望这可以帮助。

#4


2  

I've encountered today a similar issue. In my case the solution was quite simple. I am using Babel via Webpack to process .jsx files. Files with the .jsx extension did test successfully, while simple .js files throwed a reference error.

我今天遇到过类似的问题。就我而言,解决方案非常简单。我通过Webpack使用Babel来处理.jsx文件。扩展名为.jsx的文件测试成功,而简单的.js文件引发了引用错误。

If anyone has a similar or equivalent setup they might be able to share the same solution.

如果任何人有类似或相同的设置,他们可能能够共享相同的解决方案。

In karma.config.js I had to specify preprocessors for .js files as I did for the .jsx ones. Here's an example:

在karma.config.js中,我必须像.jsx那样为.js文件指定预处理器。这是一个例子:

preprocessors: {
  "app/tests/**/*.test.jsx": ["webpack", "sourcemap"],
  "app/tests/**/*.test.js": ["webpack", "sourcemap"]
},

I better add that in my case Webpack passes the code to Babel to compile so that it can run in the browser. I can copy and paste the entire webpack.config.js and karma.config.js if anyone needs them.

我最好补充说,在我的情况下,Webpack将代码传递给Babel进行编译,以便它可以在浏览器中运行。如果有人需要,我可以复制并粘贴整个webpack.config.js和karma.config.js。

#5


0  

I use webpack for that purpose. I published my configuration on npm to save my time for the future projects. Just run npm install webpack-karma-jasmine, and create config files for webpack and karma as described in docs: https://www.npmjs.com/package/webpack-karma-jasmine

我为此目的使用webpack。我在npm上发布了我的配置,以节省我未来项目的时间。只需运行npm install webpack-karma-jasmine,并按照文档中的描述为webpack和karma创建配置文件:https://www.npmjs.com/package/webpack-karma-jasmine

#6


0  

  module.exports = function(config) {
    config.set({

      basePath: '',


      frameworks: ['mocha', 'chai'],

      files: [
        'test/*.test.js'
      ],

      exclude: [
      ],

      preprocessors: {
        'test/*.test.js': ['webpack']
      },

      webpack: {
        mode: "none",
        module: {
          rules: [
            { test: /\.js?$/, loader: "babel-loader",  options: { presets: ["env"] }, }
          ]
        }
      },

      reporters: ['progress'],

      port: 9876,

      colors: true,

      logLevel: config.LOG_INFO,

      autoWatch: true,

      browsers: ['Chrome'],

      singleRun: false,

      concurrency: Infinity,

      browserNoActivityTimeout: 100000
    })
  }

use webpack

使用webpack

#7


-1  

If someone still couldnt resolve with the above solutions, this is what helped me. yarn add browserify and watchify

如果有人仍然无法解决上述解决方案,这对我有帮助。纱线添加浏览器并观察