Picture this common scenario-
A user signs up to your web app for an account. You send them a verification email with a link. They click on the link, create a password, and log into your site.

Simple, right? Sure.
But how do you use an automated testing tool like Cypress to test it, if you can’t access the emails?

Ideally, we’re looking for a simple way to receive an email as a JSON object, that we can then run assertions against. Here’s 3 ways you can achieve just that:

A) Point your app to a dummy mail server

Suggested Products: Maildev, Mailslurper, Mailtrap

These solutions act as an…

Photo by Clément H on Unsplash

I’ve just started a new role working with a SalesForce package and there are times when I need to drop into the code-level space to investigate what’s going on. Setting up a local SalesForce developer environment on MacOS doesn’t need to be hard! Here’s some quick steps to get you up and running in minutes…

Prerequisites: These instructions were written for MacOS 10.15.
You’ll need Homebrew and VSCode installed.

Installing the tools

  1. Tap the keg:
    # brew tap AdoptOpenJDK/openjdk
  2. Install the required tools:
    Note: The SalesForce CLI only supports JDK 8 or 11.
    # brew cask install sfdx openjdk11
  3. Confirm the installation was…

Often, I’ll be trying to debug a popup, menu or timed animation- by hovering over the popup, then opening the dev tools, and then trying to look at the generated code in the Elements tab. But as soon as I move my cursor, the code disappears!

A cursor hovers over the menu. Two extra lines of code appear in the code viewer, but disappear when the mouse moves away.
A cursor hovers over the menu. Two extra lines of code appear in the code viewer, but disappear when the mouse moves away.
Notice the two elements appear on hover, but disappear when the mouse moves away! How frustrating!

The quick fix?

  1. Open Chrome Dev Tools (Cmd + Option + I)
  2. Open the Console tab
  3. Paste the following, the hit enter:
    setTimeout(function(){debugger;}, 5000)
  4. Navigate to your popup and wait- in 5 seconds, the debugger will pause the page, and you can see your code!

Enjoy your debugging! 🐛

Tailwind CSS is a utility-first CSS framework, designed to help you get up and running as quickly as possible. It’s tiny in comparison to it’s peers like Bootstrap, which includes hundreds of large, clunky, pre-built components.

Instead, Tailwind includes hundreds of simple, easy to chain together classes to style your pages. These classes can also be stripped and minified when you’re finished designing, resulting in a tiny css file.

Getting Started

  1. Create a new project: mkdir myProject && cd myProject
  2. Initialise the NPM directory: npm init
  3. Install tailwind, postcss (for processing) and autoprefixer (adds vendor prefixes to your code): npm install tailwindcss…

I’ve been brushing up on my ruby learning using the Exercism.io exercises. What I don’t love about the process, is continually having to jump back into Terminal to run the test suite. Instead, I implemented a simple Guardfile on the source directory, to continually monitor all the subdirectories.


(Put these in your Exercism track root directory, ie. ~/exercism/ruby/


  1. Change directory to your Exercism track folder ie:cd ~/exercism/ruby/
  2. Install guard, etc with bundle install


bundle exec guard

*Edited 2nd June, 2019 to add colour support.

Mitch Winkel-Davis

Test Analyst, iOS Developer, Youth Worker & Coffee Lover. www.mitchwd.com

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