如何强制可写的计算observable用Javascript编写

Question

我试图用Jasmine创建一个单元测试，我想检查我的计算Observable是否真的写了，它写了什么。为此，我需要知道如何编写它以及如何测试输出。

我们假设我们在这里有一个pureComputed Observable

#coffeescript
@myComputedObservable = ko.pureComputed
 read: ->
  if @x = @y then return 'not here'
 write: (val) -> return
 owner: @

现在我想测试它。

describe 'myComputedObservable', ->
 it 'can write', ->
  myObject.myComputedObservable.write #what comes here, how can it write?
  expect(myObject.myComputedObservable()).toBeTruthy()

Answer 1

当您致电ko.pureComputed(...)（或ko.computed(...)）时，您会返回一个功能，但该功能将不具有read或write属性。相反，你得到一个带有两个＆＃34;模式的功能＆＃34;：

• GET，myComputedObservable()：在没有参数的情况下调用，这将调用＆＃34; hidden＆＃34;您在创建时提供的read功能。
• SET，myComputedObservable("Some value")：使用参数调用，这将调用＆＃34;隐藏＆＃34;您在创建时提供的write功能。

所以你需要第二个表单来间接调用write函数并测试它。

当然，您确实需要确保write函数确实可以执行某些操作，否则您根本无法测试该位。

这是一个（非咖啡）示例：

＆＃13;

＆＃13;

function ViewModel() {
  var x = ko.observable("something"), y = ko.observable("another thing");
      
  this.myComputedObservable = ko.pureComputed({
    read: function() { 
      if (x() === y()) return 'not here'; 
      return undefined; 
    },
    write: function(val) { 
      x(val);
    }
 }, this);
}

describe('myComputedObservable', function() {
  var myObject;
  
  beforeEach(function() { myObject = new ViewModel(); });
  
  it('can write', function() {
    myObject.myComputedObservable("another thing");
    expect(myObject.myComputedObservable()).toBeTruthy();
  });
});

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine-html.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/boot.min.js"></script>

＆＃13;

＆＃13;

＆＃13;

您还会注意到我需要为该演示调整其他一些内容：

• x和y是可观察的，这是必需的，否则read在更改时不会被重新评估;
• 因此，它们被作为函数调用（用空括号来获取值，并设置值来设置它）;
• 为了清晰起见，我明确了return undefined行为
• 我为x，y和实际测试添加了一些测试值;
• 需要一个ViewModel和beforeEach来引导一个有意义的最小repro

还要注意，当read函数不再是纯函数时，应该从pureComputed切换到computed。有关详细信息，请参阅文档。