Code
-
Testing React Hooks with React Testing Library
I recently re-wrote a small Announcement Bar component at work using React Hooks. After finishing rewriting it, my manager brought it to my attention that the tests that were previously written for the component were all failing.
-
Mocking Axios Requests
One of the challenges to writing good tests for frontend code is getting components in the correct state to test them. A lot of components follow the same pattern of making a network request, displaying some loading state, and then displaying data once it is returned from the server. When writing tests, to avoid making actual network requests, we create mock requests to return certain values as if they actually made the request. At Losant, we use axios to make requests, so I wanted to make some notes on how I went about mocking them with Jest to refer back to in the future.
-
Using forwardRef in React
I used React’s forwardRef the other day at work in order to focus on a input component when our sidebar opens. Without forwardRef, I had a long chain of refs that I was passing down from my parent component, which made a long and ugly reference to target the ref and made the code confusing to read too.
-
Breaking Out of Overflow Hidden
I ran into a problem at work today where I needed to create a popover menu that needed to “break out” of its container that had
overflow: hiddenon it. -
TIL - Git Reset
TIL to undo a commit but keep the working files, do
git reset HEAD^.