Notes
A collection of notes, blogposts and TIL (Today I Learned) type of posts. Some long, some not so long.
-
Inspired by Good Enough
A breath of fresh air in a world of VC-funded website-lookalike-contests
-
The single most effective Cypress trick to improve accessibility
Find and fix accessibility issues while writing Cypress tests.
-
Easy screen orientation management with the ScreenOrientation API
No more matchMedia to check screen orientation
-
Create a bruno collection from an Open API document
Using an intermediate Postman collection, we can create a bruno collection based on an Open API document
-
Multiple popovers with Popover API
use popover=manual to show multiple popovers at a time
-
Quickly serve a html document via https
I just needed to quickly serve a simple html document on a remote machine.
-
Automatic resizing of textareas and inputs using CSS
field-sizing: content lands in Chrome 123
-
Export JSDoc Type from Svelte Components
How to export/import JSDoc @typedef definitions in Svelte
-
CSS media query to check for JavaScript support
Use CSS to conditional styles depending if JavaScript is enabled
-
Pitch black darkness and the degradation of end user experience
Yesterday I rode my bike home in pitch black darkness, because the bike lamps ran out of battery. Luckily I was able to go almost all the way on backcountry gravel roads and/or cycle paths. No way I would have survived had I ridden on the main road without lights. I felt helpless without those lamps.
-
Svelte Tricks Collection
A collection of tricks and niceties you might find useful when working with Svelte.
-
Form with multiple submit buttons
How to handle HTML Forms with multiple submits
-
Editing Database in VS Code via SQLTools Plugin
Stay in the editor while working on your database.
-
CSS Background Position Offsets
Improved positioning of CSS background images
-
Submit forms in dialogs
using method=dialog
-
npm: only install production dependencies
Faster npm ci installs
-
Sort strings/numbers while respecting special characters
using localeCompare
-
<template> element
... for dynamic content
-
Cypress Testing Library Custom Error Message
How to reduce logging noise when using Cypress Testing Library
-
Group all DOM elements by font-size
Debug the distribution of font-size of DOM elements on the page
-
Mock navigator.share
For testing in non-secure environments
-
Import and Export a JS Module in one line
export { namedImport } from './path/to/module';
-
Was the page navigated to using back or forward button?
using PerformanceNavigationTiming.type
-
Detect if the tab is hidden or visible
using document.hidden
-
Make an element stick to top and bottom!
Useful CSS to make an element stick to the top and bottom of a scroll container!
-
Trigger download of remote images with Next.js
When the `download` attribute on an HTML anchor is not enough. Also: how to zip on the fly with Next.js API routes.
-
How to add a Leaflet map to a Gatsby site
Let's fix `window is not defined`