DRYing茉莉嵌套描述块

Question

我试着用茉莉花来测试一些视图代码。当视图对象处于不同的包含状态时，我需要测试某些元素的存在，而不必在每种状态中重复大量代码。

我得到了类NodeView，它表示一个具有某些端点的节点，以便允许用户用某些行将该节点连接到其他节点。每个节点都被放置在一个列(组)中，因此如果将该节点放置到第一个组中，它将不会显示左端点。如果节点进入最后一个组，它将不会显示正确的端点。我可以使用jasmine中的嵌套描述块来管理这种情况：

var node, subject, model;

describe("render", function() {
  beforeEach(function() {
    model = mockModel();
  });

  describe("when the node is into first group", function() {
    beforeEach(function () {
      model.isInFirstGroup.andReturn(true);
      model.isInLastGroup.andReturn(false);

      node = new NodeView(model);
    });

    it("has the left endpoint hidden", function() {
      expect(node.el.find('.endpoint .left')).toBeHidden();
    });

    it("has the right endpoint visible", function() {
      expect(node.el.find('.endpoint .left')).toBeVisible();
    });
  });

  describe("when the node is into last group", function() {
    beforeEach(function () {
      model.isInFirstGroup.andReturn(false);
      model.isInLastGroup.andReturn(true);

      node = new NodeView(model);
    });

    it("has the left endpoint visible", function() {
      expect(node.el.find('.endpoint .left')).toBeVisible();
    });

    it("has the right endpoint hidden", function() {
      expect(node.el.find('.endpoint .left')).toBeHidden();
    });
  });

到目前为止一切都还好。当我们有其他不同的状态时，麻烦就开始了，在这种情况下，这种状态是允许输入的。这是一个布尔值，它指示用户是否可以画线。如果此布尔值为真，则节点必须包含“输入”类以及其他内容。下面是代码(重新呈现函数)：

describe("when the node is in input state", function() {
  beforeEach(function() {
    model.input = true;
    node = new NodeView(model);
  });

  it("has the class input", function(){
    expect(node.el).toHaveClass('input');
  });
});

describe("when the node is not in input state", function() {
  beforeEach(function() {
    model.input = false;
    node = new NodeView(model);
  });

  it("has not the class input", function(){
    expect(node.el).not.toHaveClass('input');
  });
});

好的，我在构建节点时测试生成的html标记(没有显式调用render方法)，但是它在内部完成了这一工作。在构建对象时调用呈现(构造函数调用呈现)，这就是我在代码中没有显式调用node.render()的原因。

测试这些不同的州需要测试包括所有可能的情况：

• 第一组-输入
• 最后一组输入
• 第一组-没有输入
• 最后一组-没有输入

如果我添加另一个布尔状态，那么我将有8个场景，等等。我尝试通过使用共享示例http://pivotallabs.com/drying-up-jasmine-specs-with-shared-behavior/来稍微清理它。

sharedExamplesForGroupState = function() {
  describe("(shared)", function() {
    describe("when the node is into first group", function() {
      beforeEach(function () {
        model.isInFirstGroup.andReturn(true);
        model.isInLastGroup.andReturn(false);

        node = new NodeView(model);
      });

      it("has the left endpoint hidden", function() {
        expect(node.el.find('.endpoint .left')).toBeHidden();
      });

      it("has the right endpoint visible", function() {
        expect(node.el.find('.endpoint .left')).toBeVisible();
      });
    });

    describe("when the node is into last group", function() {
      beforeEach(function () {
        model.isInFirstGroup.andReturn(false);
        model.isInLastGroup.andReturn(true);

        node = new NodeView(model);
      });

      it("has the left endpoint visible", function() {
        expect(node.el.find('.endpoint .left')).toBeVisible();
      });

      it("has the right endpoint hidden", function() {
        expect(node.el.find('.endpoint .left')).toBeHidden();
      });
    });
  });
});

describe("when the node is in input state", function() {
  beforeEach(function() {
    model.input = true;
    node = new NodeView(model);
  });

  it("has the class input", function(){
    expect(node.el).toHaveClass('input');
  });

  sharedExamplesForGroupState();
});

describe("when the node is not in input state", function() {
  beforeEach(function() {
    model.input = false;
    node = new NodeView(model);
  });

  it("has not the class input", function(){
    expect(node.el).not.toHaveClass('input');
  });

  sharedExamplesForGroupState();
});

上面的行不像预期的那样工作，因为输入状态测试是在没有设置输入状态的情况下完成的，因此，我们真正要测试的是：

• 独立于组的输入和不输入
• 第一组，也是最后一组，不包括输入测试用例，但包含model.input属性

这并不是真正测试所有4种情况。

对于如何改进这一点，以避免指数重复代码，有什么想法吗？

非常感谢。

Answer 1

我认为最新描述块上的beforeEach正在注册的回调函数正在被对sharedExamplesForGroupState()调用的beforeEach调用覆盖。如果您为sharedExamplesForGroupState调用创建了一个新的作用域(比如将它封装在一个描述块中)，那么它应该可以工作：

describe("when the node is in input state", function() {
  beforeEach(function() {
    model.input = true;
    node = new NodeView(model);
  });

  it("has the class input", function(){
    expect(node.el).toHaveClass('input');
  });

  describe("shared examples for group state", function() {
    sharedExamplesForGroupState();
  });
});