A rather geeky/technical weblog, est. 2001, by Bramus
jest-puppeteerWith jest-puppeteer – and its included expect-puppeteer assertion library – it’s possible to use Puppeteer within your Jest tests. Writing integration test can be done using Puppeteer API but it can be complicated and hard because API is not designed for testing. To make it simpler, an expectPage() is automatically installed and available, it provides …
Continue reading “Run your tests using Jest & Puppeteer with jest-puppeteer“
Extensive writeup by Philip Walton on how he tackles the Container Queries problem. Instead of narrowly focusing on the specific CSS feature proposal we call “container queries”, I want to focus on the broader concept of building components that respond to their environment. And if you accept this larger framing, there are actually new web …
Continue reading “Responsive Components: a Solution to the Container Queries Problem”
Nice little library by Martin Kool / Q42. Delighters.js toggles classnames as you scroll. You do the rest! 🤓 Late 2013 I created a likewise thingy (dependent on jQuery) 🙂 The main class toggled is .delighter, with an extra .started or .ended to know if the animation just started or ended. /* when the library …
Continue reading “Delighters.JS – Add CSS animations to delight users as they scroll down”
Using the hanging-punctuation CSS property it’s possible to control whether a punctuation mark should hang at the start or end of a line of text, so that they do not disrupt the ‘flow’ of a body of text or ‘break’ the margin of alignment. Here’s a pen: See the Pen mWJJNx by Joel Drapper (@joeldrapper) …
Remember Lottie? It’s a library that can play back animations in React (Native) using a JSON file. One would define the animation in After Effects, and then export it to a JSON file for Lottie to use. But what if you don’t have After Effects? And is AE really the tool to do this job? …
In “Let’s talk about usernames” James Bennett – author of django-registration – digs deeper into an at first seemingly simple thing such as usernames and how to keep ‘m safe and unique. And no, you can’t make it by just doing a a simple comparison. You’ll have to think of more than that if you …
laravel-cspSpeaking of Content Security Policy, the folks at Spatie – who else? – have created a Laravel Package to easily take care or your CSP needs in a Laravel-based app. Even without knowing the inner workings of the packge, the custom Policy below is easy to understand: namespace App\Services\Csp; use Spatie\Csp\Directive; use Spatie\Csp\Policies\Policy as BasePolicy; …
Continue reading “Easily set Content Security Policy headers in Laravel with laravel-csp“
Chrome is really tightening up the security game here. In Chrome 66 it will untrust Symantec-issued SSL/TLS certificates, after Symantec has repeatedly screwed up by wrongly issuing certificates for domains, including google.com itself. Thanks to a decision in September by Google to stop trusting Symantec-issued SSL/TLS certs, from mid-April Chrome browser users visiting websites using …
Continue reading “Chrome 66 to Untrust Symantec-issued Certificates”
Unlike Electron this one results in true Native Components being outputted. Proton Native does the same to desktop that React Native did to mobile. Build cross-platform apps for the desktop, all while never leaving the React eco-system. Popular React packages such as Redux still work. import React, { Component } from 'react'; import { render, …
Continue reading “Proton Native – Create Native Desktop Applications Powered by React”