Cosmos 3.0 — the version you’ll fall in love with

Three months ago I forced myself to make a decision. After years of on and off involvement with Cosmos, I had to either give it the attention required to fully mature or step away and move on. I’m glad I went with the former. I’ve put in the work and this is the first version I feel truly confident about.

If you‘re new to Cosmos, it’s a dev tool you can throw any React component at. It mocks API calls, Redux state, Router location and any other input. Check it out.

What’s new?

Easy configuration

No more component path config hell. Cosmos works with any file structure now and can be adopted incrementally, one component at a time. No config file is needed to get started and in some cases (only Create React App for now) a personalized config is automatically generated on first run.

Component tree view

The folding state persists between sessions and searching through the new tree view is a lot of fun. Special thanks to Max Salvén for the massive effort behind this. The Cosmos UI is starting to feel like a desktop experience.

Advanced error handling

Another significant contribution came from Create React App maintainer Joe Haddad, who integrated the excellent react-error-overlay and took Cosmos’ DX to the next level. Once you try it you understand that the state injection mechanism of fixtures and the error overlay were meant to be together.

… and other goodies

There are more contributions in 3.0, like TypeScript support, the httpProxy option, and extra onboarding screens. But the main idea is this:

Try it.

Are you a Cosmos veteran? Here’s a guide for upgrading fixtures to v3.

What’s next?

It’s cliché to say stuff like “it’s just the beginning,” but 3.0 was an effort to consolidate the Cosmos foundation and make way for exciting new features. I was close to releasing an API for writing automated tests using fixtures when I realized that piling up more features wasn’t going to do Cosmos or the community any good. New users might come, but they’ll leave like many before them if they fail to onboard.

So along with putting in the work, I set to rethink Cosmos’ onboarding and pause ongoing features until I felt confident enough to recommend Cosmos to anyone using React. Well now I do. Use it, it’s awesome! 😄 It’s a good feeling and I can’t wait to release the other features I’ve been experimenting with.

This is a big step, but I’ll continue working hard to make Cosmos better in the coming period. Documenting a technical roadmap is also on my short list. But you don’t have to wait for that if you want to help. We have free for all issues (aka good first issue) and I’m always open to new ideas.

I’d love to hear your feedback! Our Slack is small but lively.

As always, don’t forget to set your components free!

As of 2018 I’m dedicating all my time to making Cosmos an awesome open source tool for developing React apps. If your team is looking to level up and add a solid testing foundation to your dev practices, get in touch at

Written by

Slow thinker. INFJ. Fluent in JavaScript. Love to learn by creating. Evergreen newbie.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store