Black Sheep Code

How to configure Remix and mdx-bundler for a serverless platform - barrel files approach, Remix v1

If using Remix on a serverless platform such as Netlify we can use a build time compilation and barrel files to access frontmatter metadata.

How to get started testing a React codebase that has no tests.

You've inherited a React codebase that has no tests. You're having trouble with regressions and think that tests might help, but how do you get started?

Run a Docker image on AWS ECS + Postgres using Terraform CDK

CDKTF is a tool that allows us to use fully fledged programming languages to do Terraform deployments, having the advantage of being type safe for one.

Why I've gone off React Testing Library

React Testing Library is perhaps the most popular tool for testing React applications. However its use of JSDOM under-the-hood means we often spend time dealing with browser APIs that JSDOM has not implemented.

How to configure Remix and mdx-bundler (with file system access)

How to use Remix and mdx-bundler to use of frontmatter headers. This will allow adding publication dates, or grouping posts into series, adding tags, etc. This solution works for a non-serverless solution - it requires file system access.

Testing Easy Markdown Editor

Easy Markdown Editor is a handy markdown editor with formatting keyboard shortcuts. This post outlines how to write tests for applications using it, using either Testing Library or Cypress.

Various approaches for testing an Single Page Application as it relates to state management

The presence of state management is often what makes testing an Single Page Application difficult. Various approaches such as API mocking, dependency injection, component composition and error boundaries can help.

Today I learned: The Etc/GMT+x timezones actually mean UTC-x

Counter-intuitively Etc/GMT+x timezones means the opposite of how they appear in an ISO 8601 formatted date string.

Black box contract testing - third party API mocking using Mockbin

We have an API that makes calls out to a third party - how do we test it? We can use .HAR files to configure a tool like Mockbin to act as the third party service.

The horseshoe model for software development

I propose that the designer and the QA should be one and the same.

OpenAPI contract tests - Performance testing

We can use a tool called jest-timing-reporter to provide a performance diff in our Github pull request.

OpenAPI and contract tests with Jest

Using good ol' Jest to write some contract tests with our OpenAPI generated client SDK.

Postman and OpenAPI

Syncing Postman with our Github repo, generating queries from our OpenAPI spec.

Postman and OpenAPI - Automated Tests

Postman has an automated testing feature, but how well does it work?

The case for blackbox tests

Blackbox tests do not require knowledge of the implementation details - they're a 'how the consumer sees it' style of test.

This blog now features comments

You can very easily add comment functionality to a webpage via the Github-powered Utterances plugin

Thoughts about JSON API

JSON API is an opinionated REST API structuring spec. I think it has some good ideas about what can be useful in a RESTful API, but ultimately the complexity of using it makes it not worth using.

Generating MSW mocks from an OpenAPI spec.

We're using msw-auto-mock to generate MSW mocks to test our React application.

Why I don't like API mocking as a necessary frontend testing strategy

A lot of state management frameworks recommend doing API mocking as the testing strategy. I think dependency injection is a better approach.

User Experience reflects data the underlying data structure

I propose a variation of Conway's Law.

Generating server and client code using OpenAPI tooling?

We'll use openapi-generators to generate a Go backend and a React frontend.

I'm playing with Remix

Using Remix to generate a static blog.

Why use OpenAPI?

OpenAPI is a spec for describing HTTP APIs. It has a healthy ecosystem of tooling that supports it.

The case for splitting Cypress tests into multiple it blocks

Cypress recommends long running tests with lots of assertions. I argue that it would be helpful if we had granular visibility of the parts of the test.

A model of extensible changes.

Making changes in an extensible manner avoids having to do significant code rewrites or being disruptive to downstream consumers of your API.

Dependency injection when using redux.

An unconventional strategy to inject the behaviour of your state management in testing contexts

Different Approaches to Form Element State Management in React

Working with lists of data for form inputs such as radio buttons or checkboxes is non-trivial. I outline three approaches.

Agnostic state and service management in React

Avoid make state framework specific calls inside of your React components, and instead access them via hooks. This reduces the cognitive overhead in understanding your components, and likely allows reuse of those data fetching functions elsewhere.

What is the role of QA and how should their tests fit into the development process?

If we're doing shift left testing, and developers are writing their own tests - then where does that leave QA?

How to effectively hire contractors

Contractors are best utilised to plough through a well defined scope of work.