UMD的咕哝测试

Grunt test for UMD

本文关键字：测试 UMD      更新时间：2023-09-26

我试图找出使用UMD工厂测试Javascript模块定义的最佳方法，类似于:https://github.com/umdjs/umd/blob/master/returnExportsGlobal.js

我不想测试模块本身，我想测试模块是否在各种环境中正确地"导出/创建":

  1. 如果CommonJS(节点)，模块导出正确吗?
  2. 如果是AMD，定义是否正确?
  3. 如果浏览器(没有要求)，是正确的全局创建?

我想使用grunt和jasmine运行这些测试。我可以使用grunt-contrib-jasmine来测试第2点和第3点，但不能测试第1点。

我想我可以使用grunt-contrib-jasmine和grunt-jasmine-node的混合物来测试正确的模块定义(具体的实现我仍然需要弄清楚)，但感觉非常混乱。

在高层次上，有没有人知道任何现有的方法来实现这一点，而不使用多个grunt插件?

最后，我决定使用混合任务，使用grunt-contrib-jasmine进行浏览器全局和浏览器AMD测试，使用jasmine_node进行CommonJS测试。我只有一个规格支持所有3个模块类型测试的文件。

这是我的grunt配置:

grunt.initConfig({
  pkg: grunt.file.readJSON('package.json'),
  jasmine: {
    browserGlobal: {
      src: ['src/Foo.js'],
      options: {
        specs: 'spec/**/*.spec.js'
      }
    },
    browserAMD: {
      src: ['src/Foo.js'],
      options: {
        specs: 'spec/**/*.spec.js',
        template: require('grunt-template-jasmine-requirejs')
      }
    }
  },
  jasmine_node: {
    specNameMatcher: 'spec',
    projectRoot: 'spec/'
  }
});

我的茉莉规格文件现在支持UMD:

(function (root, factory) {
  if (typeof module === 'object' && module.exports) {
    // Node/CommonJS
    factory(
      require('modulename')
    );
  } else if (typeof define === 'function' && define.amd) {
    // AMD
    define([
      'modulename'
    ], factory);
  } else {
    // Browser globals
    factory(root.ModuleName);
  }
}(this, function factory(ModuleName) {
 // Tests here
}));

这里是我使用我的模块的UMD工厂:

(function (root, factory) {
  if (typeof module === 'object' && module.exports) {
    // Node/CommonJS
    module.exports = factory();
  } else if (typeof define === 'function' && define.amd) {
    // AMD. Register as an anonymous module.
    define(factory);
  } else {
    // Browser globals
    root.ModuleName = factory();
  }
}(this, function factory() {

  // public API
  return {
    foo: 'bar'
  };
}));

您还可以使用uRequire，并在使用声明性特性的同时，将自己从所有模块中的所有UMD样板文件中保存出来。

您只需编写普通AMD或普通CommonJS模块(或两者的混合)并转换为UMD(或rjs优化的combined.js，按原样运行在nodejs， Web/AMD &Web/Script)与一个简单的构建步骤和配置，无论是在CLI或grunt。

产生的UMD是基于众所周知的模板，如https://github.com/umdjs/umd/blob/master/templates/returnExportsGlobal.js，与各种调整，其中之一是，你可以声明导出到window/global。

然后你可以将普通的AMD或commonJS规格转换为UMD和/或'combined.js'，并在浏览器或grunt-mocha中点击两者。

相关文章：