Skip to content

Instantly share code, notes, and snippets.

Jonathan Neal jonathantneal

Block or report user

Report or block jonathantneal

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
jonathantneal / getUnsupportedBrowsersByCaniuseId.js
Last active Jun 20, 2019
Return a list (`[]`) of all unsupported browsers (`"${browser} ${version}"`) by a caniuse id (`"${id}"`)
View getUnsupportedBrowsersByCaniuseId.js
const caniuse = require('caniuse-lite');
// return a list of all unsupported browsers by a caniuse id
function getUnsupportedBrowsersByCaniuseId (caniuseId) {
// get compressed feature details from caniuse-lite by a caniuse id
const featureDetails = caniuse.features[caniuseId];
// if the feature exists
if (featureDetails) {
// get browsers stats for the feature
jonathantneal / getPropertyDescriptor.js
Created Jun 19, 2019
The getPropertyDescriptor method returns a property descriptor of a given object
View getPropertyDescriptor.js
* Return the property descriptor of a given object
* @param {Object} obj - The object for which to access property descriptors
* @param {String|Symbol} key - The name or Symbol of the property whose descriptor is to be retrieved
* @return {Object} The property descriptor of the given object
function getPropertyDescriptor (obj, key) {
if (obj === undefined || obj === null) {
throw new TypeError('Cannot convert undefined or null to object');
jonathantneal /
Last active May 21, 2019
JavaScript Array Transduce and FlatMap Alternative


The transduce function creates a new array of elements passing a filter and resulting from a map.


function transduce (filterCallbackFn, mapCallbackFn, ...transduceArgs) {
jonathantneal /
Created May 1, 2019
babel-plugin-transform-globals: How I generate browserGlobals.js
  1. In each browser, I get a JSON-stringified array of every property name on window except itself. I place these names into files like or name.firefox.json.
<!doctype html>
(function () {
	const windowNames = Object.getOwnPropertyNames(window).filter(name => name !== 'window');
	const textarea = document.createElement('textarea');
	textarea.value = JSON.stringify(windowNames);
View babel-plugin-utils.js
function getReplacementIdentifiers (globals, types) {
return Object.keys(Object(globals)).reduce(
(object, name) => Object.assign(object, {
[name]: module.exports.createMemberExpressionFromString(globals[name], types)
function getImportsBySource (globals) {
jonathantneal /
Last active Aug 20, 2019
Create or update macOS Mojave Recovery Partition Without Reinstalling
# Set the macOS installer path as a variable
MACOS_INSTALLER="/Applications/$(ls /Applications | grep "Install macOS")"
echo "macOS installer is \"$MACOS_INSTALLER\""
# Set the target disk as a variable
TARGET=$(diskutil info "$(bless --info --getBoot)" | awk -F':' '/Volume Name/ { print $2 }' | sed -e 's/^[[:space:]]*//')
echo "Target disk is \"$TARGET\""
jonathantneal / css-tree-test.js
Created Oct 4, 2018
CSS Tree Experiment: Write Custom Property Fallbacks
View css-tree-test.js
var csstree = require('css-tree');
var ast = csstree.parse(':root { --color: blue; color: var(--color); }');
// match custom properties `--foo`
const customPropertyRegExp = /^--[A-z][\w-]*$/;
// match var functions `var(--foo)`
const varFunctionRegExp = /^var$/i;
// return whether a node is a custom property declaration `--foo: bar`
jonathantneal /
Created Sep 18, 2018
Goto GitHub Project: No more cd’ing between multiple user/project directories
# USAGE: `goto some-project-dirname`
goto () {
# where `~/GitHub` is the directory where you put all of your projects
DIR=$(find ~/GitHub -type d -name "node_modules" -prune -o -type d -name "$1" -print)
cd -P -- "$DIR"
jonathantneal / detect-autofill.js
Created Sep 11, 2018
Detect autofill in Chrome, Edge, Firefox, and Safari
View detect-autofill.js
export default scope => {
// match the filter on autofilled elements in Firefox
const mozFilterMatch = /^grayscale\(.+\) brightness\((1)?.*\) contrast\(.+\) invert\(.+\) sepia\(.+\) saturate\(.+\)$/
scope.addEventListener('animationstart', onAnimationStart)
scope.addEventListener('input', onInput)
scope.addEventListener('transitionstart', onTransitionStart)
function onAnimationStart(event) {
// detect autofills in Chrome and Safari by:
jonathantneal / postcss.js
Last active Jun 24, 2018
PostCSS using only the old CSSOM
View postcss.js
/* CSSNode
/* ========================================================================== */
function CSSNode(source) {
this.source = source;
Object.defineProperties(CSSNode.prototype, {
index: {
get() {
You can’t perform that action at this time.