Brad Dougherty bdougherty

Are Web Standards Toast?

I find myself in a tempest in a toaster. Yesterday I (and much of the web standards world) learned about two possible new HTML elements proposed by Google, std-toast and std-switch. I had no idea what “toast” meant in the context of the web, a problem shared my many other people. It turns out it’s a UI pattern, those little notices that pop up and then disappear without user interaction.

But wow, new HTML elements! This is the holy grail. In my part of the web we don’t even dream about new HTML elements. Oh, we’ve tried, but Hixie didn’t much care for footnote, WICG didn’t much care for list titles, and no one much cared about author. Just last week the author of the extensible web manifesto warned me to never expect new HTML elements, due to the difficulty of changing the parser.

But my concern wasn’t so much about the nature of the new elements, but of how we learned about them and what that says about how web standardization works. My [first tweet](https://twitter.com

finally-polyfill

A tiny ~150-byte polyfill for Promise.prototype.finally.

Useful for browsers that support Promise but not the .finally() method.

Usage

npm install finally-polyfill

	//
	// BottomSheetView.swift
	//
	// Created by Majid Jabrayilov
	// Copyright © 2019 Majid Jabrayilov. All rights reserved.
	//
	import SwiftUI

	fileprivate enum Constants {
	static let radius: CGFloat = 16

	/*
	Copy this into the console of any web page that is interactive and doesn't
	do hard reloads. You will hear your DOM changes as different pitches of
	audio.

	I have found this interesting for debugging, but also fun to hear web pages
	render like UIs do in movies.
	*/

	const audioCtx = new (window.AudioContext \|\| window.webkitAudioContext)()

	const { execSync } = require('child_process')
	const { createHash } = require('crypto')
	const invertColor = require('invert-color')

	const branchName = execSync('git rev-parse --abbrev-ref HEAD')
	const hash = createHash('sha256')
	hash.update(branchName)
	const color = '#' + hash.digest().toString('hex').substring(0, 6)
	const invertedColor = invertColor(color, true)

	module Entry::TrackerBlocking
	extend ActiveSupport::Concern

	included do
	has_many :blocked_trackers
	end

	email_service_blockers = {
	"ActiveCampaign" => /lt\.php(.*)?l\=open/,
	"AWeber" => "openrate.aweber.com",

	<?xml version="1.0" encoding="UTF-8"?>
	<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
	<plist version="1.0">
	<dict>
	<key>UnifiedBar</key>
	<dict>
	<key>DisclosureRequired</key>
	<string>ace440ac-b4f6-4b43-aade-02bba1589aef</string>
	<key>Enabled</key>
	<false/>

	// Restores old tab bar in Safari 15.0 (16612.1.29.41.4, 16612)
	// clang -fmodules -shared -Wall -Os -o libsafariinject.dylib safariinject.m
	//
	// If SIP off:
	// DYLD_INSERT_LIBRARIES=$PWD/libsafariinject.dylib /Applications/Safari.app/Contents/MacOS/Safari
	//
	// If SIP on, you can demo this by manually removing Safari's code signing signature, but many
	// features (eg saved logins) won't be readable by the resigned app:
	// cp -a /Applications/Safari.app ./
	// codesign --remove Safari.app/Contents/MacOS/Safari

	struct ContentView: View {

	@State var selected: Bool = false

	var body: some View {
	Color.clear
	.frame(width: 900, height: 400)
	.toolbar {
	ToolbarItem {
	Button(action: {}, label: {

	// This is part of the blog post here: https://whistlr.info/2022/abortcontroller-is-your-friend/
	// ...and can be used to detect/polyfill the `signal` argument to addEventListener.
	//
	// Note that at writing, 86%+ of active browsers already support it:
	// https://caniuse.com/mdn-api_eventtarget_addeventlistener_options_parameter_options_signal_parameter
	// ...but that 92% of browsers support `AbortController` and signal.
	//
	// So there's 6% of total browsers which will fail silently when adding the `signal` argument.
	// Eyeballing it, this is mostly Safari 11-15 and Chrome 66-90. These snippets can help with those targets.
	//