Mocha + Chai

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mocha/2.3.4/mocha.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/mocha/2.3.4/mocha.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chai/3.4.1/chai.js"></script>
<script src="https://unpkg.com/webcompose@latest/dist/webcompose.min.js"></script>
<div id="mocha"></div>

JavaScript

const { ComposableElement, html, render, withProps } = window.webcompose

class MathAdd extends ComposableElement {
  static get observedAttributes() {return ['left','right']; }
  
  static get properties() {
    return {
      left:   {type:Number, value: 1, attr:"left"},
      right:  {type:Number, value: 1, attr:"right"}
    }
  }
  
  static get composition(){
    return [
      withProps(({left,right}) => ({
        result: left+right
      }))
    ]
  }

  static render({left, right, result}){
    return html`${left} + ${right} = ${result}`
  }
}

customElements.define("math-add", MathAdd);

mocha.setup('bdd');

var expect = chai.expect;

describe('MathAdd Tests', function() {
	it('2 + 2 = 4', function() {
  	const container = document.createElement('div');
    render(MathAdd.render({left:2, right: 2, result:4}),container)
  	expect(container.innerHTML).to.equal(`2 + 2 = 4`);
  });
});

mocha.run();