Cathal Mac Donnacha

I'm going to experiment with migrating to Vitest + browser mode to see if that improves things.

If you're still using Jest, you may find this article useful to help speed up your tests.

cathalmacdonnacha.com/fixing-slow-...

#frontend #jest #testing

claude --worktree is amazing 🤌

What are some ways AI tools have helped you with your frontend projects? Specifically the design side.

#frontend #ai #claude #chatgpt #webdev

Hey Artem, curious if you ever get around to this one? If so, how did it go?

I tend to use pagination when users need shareable links or to give a sense of how much data is left (e.g. “page 3 of 10 in blue t-shirts”).

Use virtual scroll for endless browsing (e.g. social feeds).
📑 Pagination = easy to share & measure.
📜 Virtual scroll = easy to scroll.

#frontend #ux #webdev

When diving into a new codebase I find that tests serve as the best documentation.

#software #webdev #programming

Screenshot of referrers from a blog (http://cathalmacdonnacha.com/)

I guess ChatGPT is training itself on my blog now 😂

#blogging #chatgpt #software

accessibility view in chrome dev tools elements tab

TIL: Chrome Dev Tools has an accessibility view ♿️

#frontend #chrome #webdev

The Truth About Software Development with Carl Brown | Better Offline YouTube video by Better Offline

This is a real level headed take on AI and the perceived notion that it's going to completely take over software engineering roles:

youtu.be/mbEzhI3cmmo?...

Google cloud build

We find our current jest/JSDOM/testing library setup varies quite considerably. Our fast Macbooks run test quote fast, but can sometimes fail on our CI machine due to timeouts.

How do you manage the difference in test times between local and ci? Tests which run fine locally could be slow on ci and timeout/fail. Depends on the resources used on the ci machine I guess.

I love the idea, but if I was to try and evangelise this in my team I feel like it would just come across as another thing to maintain. I can't say we've hit a pain point where API field changes have broken things either as we have good communication. Still intrigued though!

React Compiler RC – React The library for web and native user interfaces

React Compiler RC is now available! We've added support for swc and are working towards a stable release react.dev/blog/2025/04...

Before I begin any refactoring, I always have a look at the tests first to make sure they're up to scratch. This way I can be fairly confident that I won't break anything in the process.

Emphasis on "fairly". 😂

#software #programming #frontend

For sure. I'm cool to use it if it's in and around the same speed, and of course there's a trade off with gaining confidence with less mocking, but if a test suite takes double the amount of time, that's double the resources on our CI/CD machine, which could be a no-go.

Nice, I think I just need to sign up to the course 😁

That's the amazing thing, less mocking when not needed.

Have you noticed much of a speed difference between browser mode and running the likes of JSDOM?

Yea, mocking "navigate" in jsdom has been a pain for us.

Have you experienced slower test speeds given you're spinning up a browser?

I wonder what the reluctance is to move it from experimental to beta? For better or worse, companies I've worked for in the past have had policies to only use production ready libraries. Beta or experimental weren't allowed, no matter how safe they were perceived to be.

Nice. I'd be interested to hear about that experience in terms of speed and dx differences. Right now our jest tests often time out. We also often have to mock "window.location" if a button triggers a "navigate" to another URL. Can those scenarios be handled in vitest browser mode?

Yea I have been following browser mode in vitest, but it's still in experimental mode right? I don't think I could recommend it to my teams just yet until it's production ready. Do you find it much slower compared to a typical jest test?

I have been keeping an eye on that, but as far as I know it's still in experimental mode right? I wouldn't be able to start recommending that to my teams until it's production ready tbh. Looking forward to that though. Is running in browser mode with vitest slower than a typical jest test?

Do you still use Jest/Vitest with React Testing Library? I would much prefer testing using a real browser, but have always found these to be much faster to write and easier to maintain.

Cypress vs Playwright: Which is best for E2E testing? Cypress was our go-to end-to-end (E2E) testing tool, and we were pretty happy with it, up until recently that is. Lately, we've run into a couple of testing scenarios where Cypress support has been limited, notably around multiple domains/tabs and iF...

We actually use Playwright as well and I did up an ADR to compare it with Cypress before pulling the trigger. It's outdated, but these were the reasons:

cathalmacdonnacha.com/cypress-vs-p...

"To persuade a few is better than to convince many."

This has always been my approach when introducing any new tools or patterns to wider teams.

#software #programming #frontend

The first thing I do when I want to familiarize myself with a new area in a codebase is check out the tests.

Tests are a great form of documentation.

#frontend #software #programming

This is really nice for those obvious mistakes, thanks for adding it! My fear though is that junior devs will blindly commit suggestions, even though they may not be correct.

🔥 Want to improve UX on your frontend? Don't make users think. Keep it simple, intuitive, and effortless. The best UX is invisible - it just works.

#ux #frontend

I remember you were always so helpful (and still are) over in the discussions tab since the very first day I started using React Query. Especially in the case of thinking about the user experience, not just the technical side of things.