Search code examples
mocha.jspolymer-2.xweb-component-tester

Reuse Mocha unit tests code for dev or demo

I'm developing webcomponents with Polymer v2 and unit tests with web-component-tester, which uses Mocha.

The components developed are charts/graphs and need some configuration to be displayed (data especially), so the suiteSetup adds boilerplate for the charts to be displayed correctly.

How could I reuse this boilerplate for other usages than unit tests ? Is there any standard way ?

For example, I would like to use this codebase as a workbench to work on a chart without integrating it in a real app. The primary issue I have, is that Mocha closes the iFrame containing the components as soon as the tests are done. So I can't even see what it looks like, and can't interact with it.

This codebase could also be reused in a demo gallery of existing charts

Thanks in advance

Solution

  • the simplest approach that is probably used for most of the the behaviors is to have a specific "demo implementation".

    e.g.

    demo/index.html
demo/my-behavior-demo.html
test/index.html
my-behavior.html

    demo/index.html

    <link rel="import href="my-behavior-demo.html">
<body>
  <my-behavior-demo></my-behavior-demo>
</body>

    you could easily reuse the same concept for tests.