Paul Grenier AutoSponge

Keybase proof

I hereby claim:

I am autosponge on github.
I am autosponge (https://keybase.io/autosponge) on keybase.
I have a public key ASBMNb8DiTIPYIougr8ILfSo8NgNS9hjLGo0Z9N5ASoFFQo

To claim this, I am signing this object:

Better local require() paths for Node.js

Problem

When the directory structure of your Node.js application (not library!) has some depth, you end up with a lot of annoying relative paths in your require calls like:

var Article = require('../../../models/article');

Those suck for maintenance and they're ugly.

Possible solutions

Lovable

Lovable modules maximize developer trust.

To learn how to maximize trust, I studied developers I trust and some of their most popular modules. It's no coincidence that I ended up using some of their modules to build mine!

Dependencies

Dependencies introduce friction. Most of the modules I trust have a small number of dependencies (including siblings). This makes sense. Removing dependencies from your module will remove friction of adoption. I decided that my first lovable module should have zero dependencies.

	// node --experimental-repl-await ./repl.js
	// OLD API (See below for a newer one)
	const repl = require('repl');
	const playwright = require('playwright');
	const config = {
	headless: false,
	args: [
	// https://tink.uk/playing-with-the-accessibility-object-model-aom/
	'--enable-blink-features=AccessibilityObjectModel',
	],

	<!DOCTYPE html>
	<html lang="en">

	<head>
	<title>Hello!</title>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="/style.css">
	<script

	function createWalker(el = document.body) {
	const walker = document.createTreeWalker(
	el,
	NodeFilter.SHOW_ELEMENT,
	{ acceptNode: node => {
	if (node.tabIndex > -1) {
	if (!isVisible(node)) {
	return NodeFilter.FILTER_REJECT;
	}
	return NodeFilter.FILTER_ACCEPT;

	const IDLE = Symbol('IDLE')
	const idle = fn => {
	let result = IDLE
	const resolve = requestIdleCallback(() => {
	result = fn()
	})
	return () => {
	if (result === IDLE) {
	cancelIdleCallback(resolve)
	result = fn()

	class Emitter {
	constructor (data) {
	this.data = data
	this.events = new Map()
	}

	on (name, fn) {
	const fns = this.events.get(name) \|\| new Set()
	fns.add(fn)
	this.events.set(name, fns)


	;(function (w, c) {
	var s, o = new MutationObserver(d(a), 1000)
	if (typeof axe === 'undefined') {
	s = w.createElement('script')
	s.src = 'https://cdnjs.cloudflare.com/ajax/libs/axe-core/3.0.2/axe.min.js'
	s.onload = function () {
	o.observe(w.body, c)
	}
	w.body.appendChild(s)

	const PrettyError = require('pretty-error')

	process.on('unhandledRejection', error => {
	const err = new PrettyError()
	console.log(err.render(error))
	})

	// OR

	const createCallsiteRecord = require('callsite-record')