intermock VS testing-library-docs

Yep, I felt the same. I'd been using the builder functions this produces for a while to at least speed up test writing but thought it should be easy to automate so went looking. Turns out there is a tool out there, Intermock, and, while fantastic, it is command line only. Our tool is built on top of that to provide a way to run it in VSCode with a couple of other niceties added.

Whenever I found myself creating another mock object for testing I kept looking at my Typescript types and thinking, can’t something look at that and do it for me? This sent me down a search for a solution and I was so stoked to find intermock which is a command line tool that does just that. While it is still a work in progress and has some limitations I have found it super helpful when writing tests.

I found Intermock a little while ago when I was looking for something similar. It looks relatively inactive, but I didn't even try it out or look into it any further.

My most recent Inception Week has helped me grow significantly as a developer as I worked on an application outside of the browser for the first time in my career. Building on the work of the awesome folks who built intermock, I adapted their tool to be used within the VSCode IDE with the extension Emulative (coming soon to a marketplace near you!). In doing so, I am hoping to do my (very) small part to improve the lives of my fellow developers by building upon the tool chain that so many others have built in order to make the work we do easier and more rewarding.

Testing Library provides a great set of accessibility-focused tools to locating elements when writing tests. It was created by Kent C Dodds, one of my longtime favorite educators on front-end and testing topics. Since the initial release in 2018 as "React Testing Library", it's grown in popularity beyond its React component testing roots. It now has plugins for all major test runners and JavaScript frameworks, and in 2022 some of its patterns were adopted in Playwright's test runner as the recommended way to locate elements.

Probably Enzyme was the first to popularize component testing in React by doing shallow rendering and expecting some things to be there in the React component tree. Then React Testing library came and took component testing to a whole new level.

18.react-testing-library

Jest has long been my favorite got to test runner when it comes to UI unit and integration testing. With tools like React Testing Library (Testing Library framework for React) you get the benefit of very easy to write and maintain tests, as well as a quick and efficient way to run our tests.

I'm writing an intergration test with Testing Library where I'm on a boards dashboard area and a user can click a button to create an item on the board. I'm using an intercepting route to do show the popup form. Once finished the user goes back to their area and should see the created board.

This article uses Jest and React Testing Library. It's okay if you want to use other libraries, the fundamentals in this article will help you there as well.

This is the idea behind Testing-Library from what I understand.

https://testing-library.com/

The Testing Library: The Testing Library offers guidance on best practices for testing user interfaces effectively, with a focus on user-centric testing.

There are great tools like Testing Library that render a single component in a single state and then programmatically inspect the resulting DOM. However, the salient details of the rendered HTML – like color, layout, and scale – are hard to express. So, the tests end up brittle (over-specified) or insufficient (under-specified).