GenerateDOM

generateDOM-test.js

var expect = require('chai').expect;
var jsdom = require('mocha-jsdom');
var generateDOM = require('../src/index');

describe('Generate', function() {

  jsdom();

  it('should render children nodes', function(){
    var source = {
      root: {
        children: {
          node1: {
            children: {
            }
          },
          node2: {
            children: {
              node3: {
                children: {
                  node5: {
                    children: {
                    }
                  }
                }
              },
              node4: {
                children: {
                }
              },
            }
          }
        }
      }
    }

    var nodes = generateDOM(source);

    expect(nodes.childNodes.length).to.be.equal(2);
    expect(nodes.id).to.be.equal('root');

    expect(nodes.childNodes[0].id).to.be.equal('node1');

    // 1st lv
    expect(nodes.childNodes[0].childNodes.length).to.be.equal(0);

    // 2nd level
    expect(nodes.childNodes[1].childNodes.length).to.be.equal(2);

    // 3rd level
    expect(nodes.childNodes[1].childNodes[0].childNodes.length).to.be.equal(1);
  });

  it('should render children nodes', function(){
    var source = {
      root: {
        children: {
          node1: {
            children: {
            }
          },
          node2: {
            children: {
            }
          }
        }
      }
    }

    var nodes = generateDOM(source);

    expect(nodes.childNodes.length).to.be.equal(2);
    expect(nodes.id).to.be.equal('root');

    expect(nodes.childNodes[0].id).to.be.equal('node1');
    expect(nodes.childNodes[0].childNodes.length).to.be.equal(0);
    expect(nodes.childNodes[1].childNodes.length).to.be.equal(0);
  });

  it('should render just root node', function() {
    var source = {
      root: {
      }
    }

    var rootNode = generateDOM(source);
    expect(rootNode.id).to.be.equal('root');
  });

  it('return null when data is mailformed', function() {
    var source = {
    }

    var rootNode = generateDOM(source);
    expect(rootNode).to.be.null;
  });

});

generateDOM.js

function createDivElementWithID(id) {
  var divElement = document.createElement('div');
  divElement.id = id || "";
  return divElement;
}

function generateDOM(jsObject) {
  if (!jsObject.hasOwnProperty('root')) {
    return null;
  }
  var pRoot = createDivElementWithID('root');
  _generateDOM(jsObject.root.children || {}, pRoot);
  return pRoot;
}

function _generateDOM(jsObject, parentNode) {

  var childrenNodes = Object.keys(jsObject).map(function(key) {
    var node = createDivElementWithID(key);

    var hasChildren = Object.keys(jsObject[key]['children']).length > 0;

    if (hasChildren) {
      _generateDOM(jsObject[key]['children'], node);
    }
    return node;
  });

  for(var i = 0; i < childrenNodes.length; i++) {
    parentNode.appendChild(childrenNodes[i]);
  }
}

module.exports = generateDOM;