A list of all my contributions ❤️

• UI Testing Best Practices
• Instructor/Consultant
• Articles
• Speaker
• Plugins and utilities
• Inspiration
• Social links

UI Testing Best Practices

I created a GitHub repository/book, UI Testing Best Practices, aiming to share my knowledge about UI/E2E Testing and creating a starting point for every browser testing lover.

Instructor/Consultant

• August, 2024 - Javascript Testing, a Practical Approach @ Banca CF+
• April, 2024 - Javascript Testing, a Practical Approach @ Zelando
• February, 2024 - Javascript Testing, a Practical Approach @ Apropos / Accenture
• June, 2023 - Automatic frontend code generator @ Platformatic
• May, 2023 - Frontend project assessment @ Jointly
• Apr, 2023 - Javascript Testing, a Practical Approach @ Apropos / Accenture
• Apr, 2023 - Javascript Testing, a Practical Approach @ Apropos / Accenture
• Apr, 2023 - Javascript Testing, a Practical Approach @ Plannix
• Apr, 2023 - Javascript Testing, a Practical Approach @ Apropos / Accenture
• Apr, 2022 - Javascript Testing, a Practical Approach @ Shopware
• Jan, 2022 - Javascript Testing, a Practical Approach @ ORS
• Aug, 2021 - Javascript Testing, a Practical Approach @ Neratech
• Jul, 2021 - Javascript Testing, a Practical Approach @ Apropos / Accenture
• Jul, 2021 - Front-end testing on steroids with Cypress @ JSDay (Course description - Conference)
• Apr, 2021 - Javascript Testing, a Practical Approach @ Apropos / Accenture
• Jun, 2020 - Cypress course @ Educative.io
• Oct, 2019 - Front-end Testing week @ Talent Garden's CodeMaster 2019 (w/ Giacomo Zinetti - Course website)
• Oct, 2019 - React Testing 101: component, integration, and end-to-end testing @ ReactJSDay (w/ Jaga Santagostino - Course description - Conference)
• Dec, 2018 - E2E Testing with Puppeteer @ Frontenders Ticino (Slides - Meetup - Repository - FETI)

Articles

2024

• Design System visual coverage
  • Visual coverage: Why and How Preply Measures the Impact of the Design System (Part 1/2) (Preply engineering blog - dev.to)
  • The Implementation Details of Preply’s Design System Visual Coverage (Part 2/2) (Preply engineering blog - dev.to)

2023

• Some things I learnt from working on big frontend codebases (dev.to - Medium) - ⭐️ Featured on dev.to Top 7 Featured DEV Posts from the Past Week
• Frontend Platform use case - Acting before a real Product need (dev.to)
• Frontend Platform use case - Enabling features and hiding the distribution problems (dev.to)
• Frontend Platform use case - Creating a roadmap without a Product Manager (dev.to)
• Production-grade gradient bordered, transparent, and rounded button (dev.to)
• Hasura E2E tests chronicles, February 2023 (dev.to)
• Improving UI tests' code with debugging in mind (dev.to)
• One long E2E test or small, independent, ones? (dev.to)

2022

• Improving Hasura's Internal PR Review process (dev.to - Hasura blog)
• Decouple the back-end and front-end test through Contract Testing (dev.to)
• Re-building a branch and telling a story to ease the Code Review (dev.to)
• A Case History: Analysing Hasura Console's code review process (dev.to)
• Hasura Console UI coding patterns
  • Testing (dev.to)
• My take on Snapshot Testing (Medium - dev.to)
• Keeping TypeScript Type Guards safe and up to date (a simpler solution) (dev.to) - ⭐️ Featured on ThisWeekInReact newsletter
• The challenges of rendering an OpenLayers map in a popup through React (dev.to) - ⭐️ Featured on ThisWeekInReact newsletter
• Speed up E2E tests for Vite-based apps (dev.to)

2021

• How I ease the next developer reading my code (dev.to)
• From unreadable React Component Tests to simple, stupid ones (dev.to)
• How I strive for XState machine, types, and tests readability (Medium - dev.to)
• Support the Reviewers with detailed Pull Request descriptions (Medium - dev.to)
• WorkWave RouteManager UI coding patterns
  • Generic ones (dev.to)
  • Arrays (dev.to)
  • TypeScript (dev.to)
  • React (dev.to)
  • React Hooks (dev.to)
  • Immutability (dev.to)
  • Redux Saga (dev.to)
• Migrating a 150K LOC codebase to Vite and ESBuild - ⭐️ The first article out there about migrating a big codebase to Vite
  • Why? (Part 1/3) (Medium - dev.to)
  • How? (Part 2/3) (Medium - dev.to)
  • Is it worthile? (Part 3/3) (Medium - dev.to)
• Creating a book-driven course: is it worthwhile? (Medium - dev.to)

2020

• Choose what NOT to study and focus on one thing at a time (Medium - dev.to)
• Reimplementing the core Recoil’s APIs for fun and learning (Medium - dev.to)
• UI Tests Debugging Best Practices (Medium - dev.to)
• Unit Testing React components with Cypress (Medium - dev.to)
• Testing a Virtual List component with Cypress and Storybook (Medium - dev.to)
• Some UI testing problems and the Cypress way (Medium - dev.to)

2019

• Software tests as a documentation tool (Medium - dev.to - LinkedIn)
• Launching “$ npm run” programmatically with npm.run() (Medium - dev.to - LinkedIn)
• New to front-end testing? Start from the top of the pyramid! (Medium - dev.to - LinkedIn - Cypress blog)
• Who watches the watchmen? Mutation testing in action (Medium - dev.to - LinkedIn)
• Front-end productivity boost: Cypress as your main development browser (Medium - dev.to - LinkedIn) - ⭐️ Also appreciated by Kent C. Dodds
• The concept of “Monitoring Tests” (Medium - dev.to - LinkedIn)
• Component vs (UI) Integration vs E2E tests (Medium - dev.to - LinkedIn)
• Await, do not make your E2E tests sleep (Medium - dev.to - LinkedIn - Cypress Blog)
• React Hooks Memorandum (Medium)

Speaker

How to measure the impact of a Design System

• Sep, 2024 - Belka's AMA (Recording (in Italian))

Frontend scope of the Platform teams

• Sep, 2023 - Continuous Delivery's webinar (Recording (in Italian))

Some things I learnt from working on big frontend codebases

• Aug, 2023 - Educative.io webinar (Recording (requires login) - Related article)

The long road to remove the flakiness from the Hasura Console E2E tests

• Feb, 2023 - Continuous Testing Meetup Berlin (Slides - Recording - Related article)

How I avoid the next developer swearing at my code

• Oct, 2022 - ReactJSDay (Recording - Slides - Conference - Related article)
• Feb, 2022 (remote talk) - Fabio Biondi's Twitch (Recording (in Italian) - Code)

Testing Best Practices

• Jun, 2024 - Gitbar podcast (Podcast - Recording (in Italian))
• Oct, 2022 - ReactJS Milano (Slides - Meetup - Related article - Recording (in Italian))

Deepening a thing at a time

• Jun, 2021 (remote talk) - Ticino Software Craft (Slides - Meetup)
• Jan, 2021 (remote talk) - FEVR (Slides - Meetup - Recording (in Italian) - FEVR - Making transparent slides)
• Sep, 2020 (remote talk) - Cypress UK Community (Slides - Meetup - Recording)

Front-end testing on steroids

• Jul, 2021 (remote talk) - Web Marketing Festival (Slides - Conference)
• Apr, 2020 (remote talk) - Fabio Biondi's Twitch (Post - Recording (in Italian))
• Sep, 2020 (remote talk) - London's CityJSConf (Slides - Conference - Recording)
• Jun, 2020 (remote talk) - Javascript - developer Italiani (Facebook group - Recording (in Italian on a closed Facebook group))
• May, 2020 (remote talk) - JS Monthly London (Slides - Meetup - Companion repository - Recording)
• May, 2020 (remote talk) - Vienna's TestBustersNight (Slides - Meetup - Companion repository)

Breaking the fear of front-end testing

• Jan, 2021 (remote talk) - RomaJS (Slides - Meetup - Recording (in Italian))
• Feb, 2020 - Milano Frontend (Slides - Meetup - Milano Frontend)
• Feb, 2020 - Como Front End (Slides - Meetup - Cafe - Recording (in Italian))
• Nov, 2019 - JavaScript Community Day (Slides - Event - Javascript - developer Italiani)
• Nov, 2019 - Uqido (Slides - Event - Uqido - Article and recording (in Italian))

Mastering UI Testing

• Oct, 2019 - Voxxed Days Ticino (Slides - Conference - Recording)
• Jul, 2019 - Working Software conference (Slides - Conference - Companion repository - Recording)

UI Testing Best Practices

• Jun, 2019 - FEVR (Slides - Meetup - Recording (Italian) - FEVR)
• May, 2019 - Milano Frontend (Slides - Meetup - Recording (Italian) - Milano Frontend)

E2E Testing with Jest and Puppeteer

• Feb, 2019 - Como Front End (Slides - Meetup - Cafe)
• Jan, 2019 - PugMI (Slides - Meetup - post - pugMI)

Plugins and utilities

• Figma Select and Inspect (Figma Community - GitHub)
• Figma to XState (Figma Community - GitHub)
• Cypress Wait Until (NPM - GitHub)
• Cypress Protobuf (NPM - GitHub)
• Cypress OTP (NPM - GitHub)
• Platformatic CLI frontend command (GitHub - Platformatic docs)
• Gatsby Iubenda Cookie Footer (NPM - GitHub - Gatsby)
• Gatsby Preconnect (NPM - GitHub - Gatsby)
• VSCode Increase by 1 (VS Code marketplace - GitHub)
• Bitcoin Address Soft Regex Validation (NPM - GitHub)
• Cypress React Devtools (GitHub)
• gitbook-plugin-head-append (GitHub - NPM)
• WhatsApp Messages Batch (GitHub)
• nprr (Deprecated! Please check out https://fig.io/ or https://github.com/antfu/ni as possible alternatives) (NPM - GitHub)

Inspiration

I got inspired by:

• Quincy Larson's skills/reputation/network tweet
• Shawn Wang's Learn In Public
• Kent C. Dodds' Intentional Career Building
• Tim Urban's Inside the Mind of a Master Procrastinator talk
• Cedric Chin's Are You Playing to Play, or Playing to Win?
• ROdolfo Siles' Activity-Based vs. Results-Based Management

Social links

• Follow me on Twitter or LinkedIn
• Find my articles on Dev.to and my slides on Slides.com
• Find my published packages on NPM
• If you work out, let's connect on Strava