JSFiddle - React, Tailwind, and code Playground

by Elvis de Freitas

HTML

<fieldset>
  <legend>entrada JSON</legend>
  <textarea id="entradaJson"></textarea>
</fieldset>
<fieldset>
  <legend>saida cucumber</legend>
  <textarea id="saidaCucumber" readonly></textarea>
</fieldset>
<br />
<button>converter</button>

CSS

textarea {
  width: 100%;
  height: 50px;
}
#saidaCucumber{
  height: 200px;
}

JavaScript

$("button").click(function() {
	log(true);
  try{
  var json = JSON.parse($("#entradaJson").val());
	}catch(e){
  	return log("please pass a JSON");
  }

  log(json2Cucumber(json));
 
});

function json2Cucumber(json){
  var buffer = '';
  function log(str){
    buffer += str;
  }
  if(!Array.isArray(json)){
  	json = [json];
  }
  var first = true;
  json.map(function(json){
    if(first){
      log(jsonHeader2Cucumber(json));
      log('\n');
      first = false;
    }
    log(jsonContent2Cucumber(json));
    log('\n');
  });
  return buffer;
}

function jsonHeader2Cucumber(json){
  var buffer = '';
  function log(str){
    buffer += str;
  }
	log("| ")
  for (var k in keys = Object.keys(json)) {
    log(keys[k]);
    log(" | ");
  }
  return buffer;
}

function jsonContent2Cucumber(json){
  var buffer = '';
  function log(str){
    buffer += str;
  }
  log("| ")
  for (var k in json) {
    log(json[k]);
    log(" | ")
  }
  return buffer;
}

function log(text) {
  var out = $("#saidaCucumber");
  out.val(out.val() + text);
  if(text === true){out.val('');}
}