JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<div style="width : 200px; height : 80px; border: 1px solid red" data-bind="click : clicked">
  <input type="text" data-bind="textInput : input1, event : { keydown : function(){ return tabOut(event)}}" />
  <input type="text" data-bind="textInput : input2" />
  <span data-bind="text : result"></span>
</div>

JavaScript

function MyVM() {
  this.input1 = ko.observable('');
  this.input2 = ko.observable('');
  this.result = ko.computed(function() {
    	console.log('Computed fired at ' + new Date());
    return this.input1() + ' ' + this.input2();

  }, this);

  this.clicked = function() {
  }

  this.tabOut = function() {
    if (event.keyCode == 9) {
    	console.log('Tab fired at ' + new Date());
      this.clicked(event);
    };
    return true;
  }
}

var viewModel = new MyVM();
ko.applyBindings(viewModel);