excaliburjs / Excalibur / 4418

84%

main: 89%

push

travis-ci

[chore] Tests: Migrate visual tests to Storybook (#1248)

## Changes:

- Add Storybook support and configure for TypeScript
- Add support for new `EngineOptions.canvasElement` option to directly pass `HTMLCanvasElement`
- Migrate a visual test as an example

## Summary

This PR is the beginning of a wholesale migration effort for existing visual tests to Storybook-based stories. The idea is that we use the current visual tests to make sure things work as expected but they are not well-documented nor truly designed for end-user consumption.

I'd like to move to Storybook to make our visual tests more like live documentation for us and end-users. For example, using Storybook we can:

- Organize visual examples
- Show code examples
- Add "knobs" for tweaking live in-browser
- Add DocPages support
- Double as test aids during releases
- Get hot module reload (HMR) during development 🔥 

This PR will introduce Storybook but each set of visual tests will be a follow-up PR until none remain. At the same time, I'll probably work on theming and having the docs repo deploy Storybook to the site (latest stable + edge-only?).

## Examples

![fade example](https://user-images.githubusercontent.com/563819/64312132-65a15400-cf6c-11e9-8eb6-56a6ae0679fa.png)

Basic story with Knobs configured and Notes

### Docs panel

![image](https://user-images.githubusercontent.com/563819/64345332-c903a400-cfb5-11e9-8643-bf0c2e05b884.png)

2009 of 3012 branches covered (66.7%)

6686 of 8173 relevant lines covered (81.81%)

16278.08 hits per line