
Carte Blanche – isolated development space with integrated fuzz testing - tilt
https://github.com/carteb/carte-blanche
======
randompotato
The UI looks very similar to the Cosmos project
([https://github.com/skidding/cosmos](https://github.com/skidding/cosmos)).

Could you outline the main differences and the motivation behind creating a
different project in favor of contributing to an existing one?

~~~
nik-graf
I have met skidding last February when this was project was in its early
stages. We walked through Cosmos and it definitely was an inspiration to Carte
blanche. Skidding even helped us to design the initial props form:
[https://github.com/carteb/carte-
blanche/issues/47](https://github.com/carteb/carte-blanche/issues/47)

Cosmos in my opinion is a fantastic tool and covers even some areas we haven't
touch yet, but planning to do soon like injecting/manipulating the internal
state of a component.

While there a many more differences these are probably the most interesting
ones:

\- The core of Carte blanche is a Webpack plugin. By hooking into the main
compilation of Webpack Carte blanche can identify your components and list
them in an application living within your running server on different URL
path. The coolest part from my perspective is that we inherit all your webpack
settings by default. No need to configure your loaders. Cosmos in comparison
is a separate app.

\- In Cosmos your need to write your examples by hand. Carte blanche reads out
your propTypes/Flow types and allows us to generate a form input for each of
your properties including nested structures like a person object containing an
avatarUrl, firstName & lastName. This approach allowed us to create some kind
of UI fuzz-testing feature in the interface. While I believe that it's
important to focus your efforts designing/developing for the most likely cases
it's also relevant to cover edge-cases. Fuzz-testing is a great way to
discover them.

I hope this help. Let me know if you any other questions :)

~~~
glenjamin
Do you only support autogenerated inputs? Is there also a way to create
scenario-like examples?

I say this because I'm working on an app with a large drawing canvas component
at the moment, and being able to produce hand crafted examples of specific
drawing scenarios is really powerful.

I'm doing with this devboard[1] and I've created a mini-DSL within my cards to
describe a series of mouse interactions, which can either be played back
immediately or one-at-a-time to display the interaction and animations.

Being able to combine this with fuzz-testing would be really cool!

[1] Shameless plug :)
[https://github.com/glenjamin/devboard](https://github.com/glenjamin/devboard)

~~~
mxstbr
This is not yet implemented, but since the core of CarteBlanche is a plugin
system[0] making this happen is definitely possible!

We're happy to provide any support you need to create this, we'd love to see
the ecosystem around CarteBlanche thrive to all sorts of different use cases.

[0]: [https://github.com/carteb/carte-
blanche/tree/master/WRITING-...](https://github.com/carteb/carte-
blanche/tree/master/WRITING-PLUGINS.md)

------
ac360
Awesome project :)

