时间戳

首页 > 解决方案 > 使用来自 WebPack.DefinePlugin 的全局注入变量进行 NodeJS Mocha 单元测试

node.js - 使用来自 WebPack.DefinePlugin 的全局注入变量进行 NodeJS Mocha 单元测试

问题描述

通过 WebPack.DefinePlugin 注入的全局变量似乎与我的 Mocha 单元测试不太吻合。运行测试时无法识别全局变量，并且Mocha 文档似乎没有办法注入这些全局变量。

如何注入这些变量以便它们在单元测试中起作用？

详细说明

给定一个具有以下配置的 WebPack 项目：

{
    ...
    plugins: [
        ...
        new webpack.DefinePlugin({
            __ENV__: JSON.stringify(process.env.ENVIRONMENT),
            ...
        }),
        ...
    ]
}

在我的项目中有以下打字稿代码：

declare let __ENV__: string;

...

export const ENV = __ENV__;

如果我使用以下选项运行 Mocha：

mocha --compilers ts:ts-node/register --require ./test/entry.ts **/*.test.ts

Mocha 会遇到以下错误：

C:\git\project\src\constants\config.ts:7
export const ENV = __ENV__;
                   ^
ReferenceError: __ENV__ is not defined
    at Object.<anonymous> (C:\git\project\src\constants\config.ts:7:20)
    ...

我试过的

我想我应该__ENV__在我的entry.ts文件中定义。运行 mocha 时，以下尝试均因各种错误而失败：

const __ENV__ = 'dev'; // Same message as above.
window.__ENV__ = 'dev'; // Property '__ENV__' does not exist on type 'Window'.
window['__ENV__'] = 'dev'; // ReferenceError: window is not defined
global.__ENV__ = 'dev'; // Property '__ENV__' does not exist on type 'Global'.
export declare let __ENV__ = 'dev'; // Initializers are not allowed in ambient contexts.
export declare const __ENV__ = 'dev'; // Initializers are not allowed in ambient contexts.

标签： node.jsunit-testingtypescriptmocha.js

解决方案

✨ 哇哦

我已经使用https://stackoverflow.com/a/62874686/5244937解决了这个问题。

> 索引.ts

这是我的中心环境。我有两个类（DevTool、EmptyProdTool）为 DEV 和 PROD 实现不同的行为。

这通常被 webpack 取代。

import { DevTool } from "./dev";
import { EmptyProdTool } from "./prod";

declare global {
  /** https://stackoverflow.com/a/62874686/5244937 */
  var __IS_DEV__: boolean;
  var __IS_PROD__: boolean;
}

export interface ENVClass {
  dev_log(message: any): void;
  dev_error(message: any): void;
  backgroundColor: string;
  isDev: boolean;
  isProd: boolean;
}

export const ENV = __IS_DEV__ ? new DevTool() : new EmptyProdTool();

> webpack.config.js

plugins: [

    ...

      new webpack.DefinePlugin({
        __IS_DEV__: JSON.stringify(env.NODE_ENV == "development"),
        __IS_PROD__: JSON.stringify(env.NODE_ENV == "production")
      }),
    
    ...

    ]

> 测试/_env_injection.ts

这取代了注入 __IS_DEV__和__ID_PROD__用于 mocha 测试。

/** https://stackoverflow.com/a/62874686/5244937 */
globalThis.__IS_DEV__ = true;
globalThis.__IS_PROD__ = false;

> package.json > 在没有 webpack 的情况下启动 mocha & ts-node

  "scripts": {

    "test": "mocha -r ts-node/register --require test/_env_injection.ts test/**/*.spec.ts",

    }

推荐阅读