Photo by Jeremy Thomas

Two months ago I released Cosmos Next and showed you the future. The feedback has been positive and it’s time to move forward. Today we’re adding some new features make the new Cosmos platform even more enticing!

Multi fixture files

Using the file system to organize fixtures is a Cosmos trademark. We already organize our files, so why create an additional structure to browse them? This proved an effective strategy with one drawback: Creating an extra file for every fixture can get repetitive, especially for simple components.

Guess what? Now you can put multiple fixtures in one file.

Satellite over the coast

This release has two parts:

  • For existing Cosmos users, it’s the seasonal bundle of bug fixes and improvements (15-contributor-strong!)
  • For those eager to try something new and exciting, it’s a trojan horse-esque release that contains a brand new platform at the mere flick of a switch!

Psst! What is this about, you ask? React Cosmos, a dev tool for UI developers. You may call it a “component playground” or an “isolated dev environment”, but at the end of the day all you need to remember is that it rocks. Check it out.

Meet Cosmos Next

After a week of debauchery abroad, I was overly caffeinated and ridden with pizza guilt. It felt like the right time to take a stab at fasting and reset my body.

So after a 5pm meal last Friday I decided to begin the experiment, as I could afford the energy loss throughout the weekend. And until Sunday evening I consumed nothing but water. It wasn’t hard, but it was defintely challanging.

Here are some notes I took in the process:

Note that I won’t mention any benefit of fasting. There are already tons of resources available if you’re interested. …

Last week was fun.

I had the pleasure to be part of reactjsday in Verona. Fun people and thought-provoking talks. If you’d like to see some nerds geek out, watch this.

Aside from the cool conference, I explored bits of Northern Italy and caught some beautiful sights in Verona, Venice, Bologne and the stunning Dolomites.

React Native support and responsive display mode

Here’s the idea: Upgrade Cosmos and you’ll get exciting features with no breaking changes!

GitHub release, 32 PRs strong. Authored by maxsalven, SimeonC, extramuros, xavczen, sdgandhi, Pyrolistical and yours truly.

React Native support

Possibly the most requested feature has arrived. No new package to install. Upgrade react-cosmos and put Cosmos in your mobile device.

React Native in Cosmos

How does it work?

The Cosmos server finds your fixtures and puts them inside your existing Metro build. The Cosmos UI runs on your computer and tells the Cosmos renderer (running on your device) what to load as you browse fixtures.

Pop the docs to get started.

I never worked with RN before…

Goodbye, Mango! I’ll miss your heavenly taste. I accidentally eat about a hundred of your cousins these past months.

An imaginary conversation with fruit seems out of touch, but for a good while my reality also felt out of touch. I spent most of this spring in Thailand and detoured to Saigon towards the end.

It’s a lot of time to unpack, but I’ll let the photos do the work. I recommend you view this on a big screen!

Photo by Aperture Vintage

The previous major version was the one you fell in love with. It came with an easier config, improved error handling and a brand new fixture tree view.

Then we introduced a brand new testing API for Cosmos fixtures, which makes it possible to reuse the setup from visual examples when writing automated tests. This propelled Cosmos into a new era, from a visual component explorer to a platform for mocking component inputs.

Here’s another major version packed with impactful contributions!

I hope you read about all in detail, but here’s a brief summary if you can’t:

Automatic fixture detection. Improved monorepo dev experience. webpack 4 support. Revamped…

I planned to stay two or three months in Berlin. Ended up staying five, and I would’ve stayed more if not for the winter chill. Not complaining, but so far I’ve posted two photo journal entries depicting a colorful spectrum of Berlin experiences, save for one important detail. The sharp, cruel cold.

or: How to test asynchronous code

The Persistence of Memory by Salvador Dalí

Testing UIs is tricky. One reason for this is the async nature of JavaScript, and of the SPA ecosystem in particular. This is what we’ll dive into today. We’ll look at how async code makes it difficult to know when something happened and then learn how we can use await until(...) to overcome it.

This is a complement to Testing React Components, a short guide for testing UI components with ease.

Can I assert now? What about now?

Picture this scenario: On mount, our component makes a server request and uses the response to generate a new state, which in turn activates a specific render path. More…

Wisdom from writing countless UI tests and a new API for component testing

Photo by Jason Wong

Testing should make us confident. Confident that our software does what we think it does, and that it will continue to do so as we pile up functionality. But testing UI components rarely breeds confidence. Instead, it often makes us feel angry and unproductive.

Why bring this up? Because I’ve had this problem for years, since before the days of React, and I’ve recently put a ridiculous amount of time and thought into solving it. I believe I’ve found a set of tools and practices that make testing React components as easy as writing them.

We’ll start with two core…

Ovidiu Cherecheș

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