33

我正在研究使用 TypeScript 进行 TDD 的可能性。如果我用 TypeScript 编写测试，是否可以让 import 语句为我的测试类返回模拟？还是用纯 JavaScript 编写测试并自己处理注入 AMD 的唯一可行方法？

4

9 回答 9

23

我开发了一个名为 InversifyJS 的 IoC 容器，它具有诸如上下文绑定之类的高级依赖注入功能。

您需要遵循3 个基本步骤才能使用它：

1.添加注释

注释 API 基于 Angular 2.0：

import { injectable, inject } from "inversify";

@injectable()
class Katana implements IKatana {
    public hit() {
        return "cut!";
    }
}

@injectable()
class Shuriken implements IShuriken {
    public throw() {
        return "hit!";
    }
}

@injectable()
class Ninja implements INinja {

    private _katana: IKatana;
    private _shuriken: IShuriken;

    public constructor(
        @inject("IKatana") katana: IKatana,
        @inject("IShuriken") shuriken: IShuriken
    ) {
        this._katana = katana;
        this._shuriken = shuriken;
    }

    public fight() { return this._katana.hit(); };
    public sneak() { return this._shuriken.throw(); };

}

2. 声明绑定

绑定 API 基于 Ninject：

import { Kernel } from "inversify";

import { Ninja } from "./entities/ninja";
import { Katana } from "./entities/katana";
import { Shuriken} from "./entities/shuriken";

var kernel = new Kernel();
kernel.bind<INinja>("INinja").to(Ninja);
kernel.bind<IKatana>("IKatana").to(Katana);
kernel.bind<IShuriken>("IShuriken").to(Shuriken);

export default kernel;

3.解决依赖关系

解析 API 基于 Ninject：

import kernel = from "./inversify.config";

var ninja = kernel.get<INinja>("INinja");

expect(ninja.fight()).eql("cut!"); // true
expect(ninja.sneak()).eql("hit!"); // true

最新版本 (2.0.0) 支持许多用例：

  • 内核模块
  • 内核中间件
  • 使用类、字符串文字或符号作为依赖标识符
  • 注入常​​量值
  • 注入类构造函数
  • 工厂注入
  • 汽车厂
  • 注入提供者（异步工厂）
  • 激活处理程序（用于注入代理）
  • 多次注射
  • 标记绑定
  • 自定义标签装饰器
  • 命名绑定
  • 上下文绑定
  • 友好的异常（例如循环依赖）

您可以在https://github.com/inversify/InversifyJS了解更多信息

于 2016-04-19T09:47:34.957 回答
21

我在 TypeScript 中使用infuse.js进行依赖注入。

参考 d.ts

/// <reference path="definition/infusejs/infusejs.d.ts"/>

在启动时初始化您的注射器

this.injector = new infuse.Injector();

映射依赖项

this.injector.mapClass( 'TodoController', TodoController );
this.injector.mapClass( 'TodoView', TodoView );
this.injector.mapClass( 'TodoModel', TodoModel, true );  // 'true' Map as singleton

注入依赖

export class TodoController
{
    static inject = ['TodoView', 'TodoModel'];

    constructor( todoView:TodoView, todoModel:TodoModel )
    {

    }
 }

它是基于字符串的，而不是基于类型的（因为在 TypeScript 中还不能实现反射）。尽管如此，它在我的应用程序中运行良好。

于 2015-03-24T11:20:16.667 回答
6

试试这个依赖注入器（Typejector）

GitHub打字机

使用新的 TypeScript 1.5，可以使用注释方式

例如

    @injection
    class SingletonClass {
        public cat: string = "Kitty";
        public dog: string = "Hot";

        public say() {
            alert(`${this.cat}-Cat and ${this.dog}-Dog`);
        }
    }
    @injection
    class SimpleClass {
        public say(something: string) {
            alert(`You said ${something}?`);
        }
    }

    @resolve
    class NeedInjectionsClass {
        @inject(SingletonClass)
        public helper: SingletonClass;
        @inject(SimpleClass)
        public simpleHelper: SimpleClass;

        constructor() {
            this.helper.say();
            this.simpleHelper.say("wow");
        }
    }
    class ChildClass extends NeedInjectionsClass {

    }

    var needInjection = new ChildClass();

对于问题案例：某些属性应该实现伪接口（或抽象类），如下例所示。

    class InterfaceClass {
        public cat: string;
        public dog: string;

        public say() {

        }
    }

    @injection(true, InterfaceClass)
    class SingletonClass extends InterfaceClass {
        public cat: string = "Kitty";
        public dog: string = "Hot";

        public say() {
            alert(`${this.cat}-Cat and ${this.dog}-Dog`);
        }
    }

    @injection(true, InterfaceClass)
    class MockInterfaceClass extends InterfaceClass {
        public cat: string = "Kitty";
        public dog: string = "Hot";

        public say() {
            alert(`Mock-${this.cat}-Cat and Mock-${this.dog}-Dog`);
        }
    }

    @injection
    class SimpleClass {
        public say(something: string) {
            alert(`You said ${something}?`);
        }
    }

    @resolve
    class NeedInjectionsClass {
        @inject(InterfaceClass)
        public helper: InterfaceClass;
        @inject(SimpleClass)
        public simpleHelper: SimpleClass;

        constructor() {
            this.helper.say();
            this.simpleHelper.say("wow");
        }
    }

    class ChildClass extends NeedInjectionsClass {

    }

    var needInjection = new ChildClass();

注意： 模拟注入应该在源代码之后定义，因为它重新定义了接口的类创建器

于 2015-05-12T11:49:03.080 回答
2

对于使用 Angular2 的人，我开发了 Fluency Injection https://www.npmjs.com/package/fluency-injection。文档非常完整，它模仿了 Angular2 的 DI 的行为。

非常感谢您的反馈，希望对您有所帮助:)

于 2016-10-16T16:08:29.903 回答
2

您可以使用解决方案：
JavaScript/TypeScript 的轻量级依赖注入容器

import {autoInjectable, container} from "tsyringe";

class MyService {
  move(){
    console.log('myService move 123', );
  }
}

class MyServiceMock {
  move(){
    console.log('mock myService move 777', );
  }
}

@autoInjectable()
export class ClassA {
  constructor(public service?: MyService) {
  }
  move(){
    this.service?.move();
  }
}

container.register(MyService, {
  useClass: MyServiceMock
});

new ClassA().move();

输出：

模拟 myService 移动 777

于 2020-02-03T01:32:32.690 回答
1

我一直在开发一个名为Pigly的 DI 解决方案。给出有关注入和测试的原始问题的示例（诚然不是自动模拟生成-尽管您可以像我在这里所做的那样尝试ts-auto-mock ）：

鉴于：

interface IDb {
  set(key: string, value: string);
}

interface IApi {
  setName(name: string);
}

class Api implements IApi {
  constructor(private db: IDb) {}
  setName(name: string){
    this.db.set("name", name);
  }
}

我们可以绑定类型，

import { Kernel, toSelf, to, toConst } from 'pigly';
import * as sinon from 'sinon';

let spy = sinon.spy();

let kernel = new Kernel();

kernel.bind(toSelf(Api));
kernel.bind<IApi>(to<Api>());
kernel.bind<IDb>(toConst({ set: spy }));

然后解决并测试：

let api = kernel.get<IApi>();

api.setName("John");

console.log(spy.calledWith("name", "John"));

此示例的执行/编译需要一个 typescript 转换器 - 将接口符号和构造函数提供程序编译成普通的 javascript。有几种方法可以做到这一点。ts-node + ttypescript 方法是有一个 tsconfig.json：

{
  "compilerOptions": {
    "target": "es2015",
    "module": "commonjs",
    "moduleResolution": "node",
    "plugins": [{
      "transform": "@pigly/transformer"
    }]
  }
}

并执行

ts-node --compiler ttypescript example-mock.ts

Pigly 的区别在于不需要对您的（或第三方）类进行任何更改，代价是使用打字稿转换器，或者如果（您不想使用转换器）则使用更详细的绑定。它仍然是实验性的，但我认为它显示出希望。

于 2019-11-04T16:34:01.597 回答
0

TypeScript 可以很好地与 AMD 加载器（如 requirejs）配合使用。如果配置正确，TypeScript 将输出完全符合 AMD 的 javascript。

在测试情况下，您可以配置 requirejs 以注入可测试的模块。

于 2013-04-17T20:18:08.433 回答
0

你可以试一试：https ://www.npmjs.com/package/easy-injectionjs 。它是一个通用的依赖注入包。

@EasySingleton 在整个应用程序中创建依赖项的单个实例。它是某种服务的理想选择。

@EasyPrototype 根据需要创建尽可能多的依赖项实例。它是可变依赖项的理想选择。

@EasyFactory 主要用于继承：

你可以使用这个包做任何事情：简单用法（来自自述文件）：

import { Easy, EasyFactory, EasyPrototype, EasySingleton } from 'easy-injectionjs';

@EasyFactory()
abstract class Person {
  abstract getName();
  abstract setName(v: string);
}

// @EasyObservable()
@EasySingleton()
class Somebody extends Person{
  // @Easy()
  constructor (private name: string) {
    super()
    this.name = 'Sal';
  }

  public getName() {
    return this.name;
  }
  public setName(v: string) {
    this.name = v;
  }
}

@EasyPrototype()
class Nobody extends Person{
  @Easy()
  somebody: Person;
  constructor () {
    super()
  }

  public getName() {
    return this.somebody.getName();
  }

  public setName(v: string) {
    this.somebody.setName(v);
  }
}

@EasyPrototype()
class Data {
  @Easy()
  somebody: Person;
  name: string;

  change(v: string) {
    this.somebody.setName(v);
  }

  getName(): string {
    return this.somebody.getName();
  }
}

let n = new Nobody();
console.log(n.getName()) // Prints Sal
n.setName('awesome');
console.log(n.getName())  // Prints awesome
let d = new Data()
console.log(d.getName())  // Prints awesome
d.change('Gelba')
console.log(n.getName())  // Prints Gelba
d.change('kaa')
console.log(n.getName())  // Prints Kaa

即使你想注入节点模块，你也可以这样做：

import * as IExpress from 'express';
import { Easy, EasySingleton } from 'easy-injectionjs';

@EasySingleton()
class Express extends IExpress {} 

@EasySingleton()
export class App {
  @Easy()
  private _express: Express;
}

let app = new App();
console.log(app)

当然，快速服务器的使用不适用于控制台日志记录。它仅用于测试：D。

希望有帮助：D

于 2018-04-20T18:08:17.410 回答
-6

我从事受 AutoFixture 启发的 AutoFixtureTS。AutoFixtureTS 通过自动化不相关的测试夹具设置使 TypeScript 开发人员更容易进行测试驱动开发，使测试开发人员能够专注于每个测试用例的基本要素。

http://ronniehegelund.github.io/AutoFixtureTS/

它仍然只是原型代码，但请检查一下:-)

/罗尼

于 2013-11-20T16:30:34.687 回答