Skip to content

Instantly share code, notes, and snippets.

Eric Bidelman ebidel

Block or report user

Report or block ebidel

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
ebidel / monitor_internet_connection.js
Last active Feb 28, 2018
Puppeteer: monitor status of internet connectivity using headless Chrome
View monitor_internet_connection.js
Moved to
ebidel / sw_caching_size.js
Last active Jan 30, 2020
Print service worker cache sizes and overall bytes cached.
View sw_caching_size.js
* @author ebidel@ (Eric Bidelman)
* License Apache-2.0
// Prints the bytes cached by service worker. Breaks out each cache
// overall in-memory bytes used by the Cache Storage API for the site.
async function getCacheStoragesAssetTotalSize() {
// Note: opaque (i.e. cross-domain, without CORS) responses in the cache will return a size of 0.
ebidel / feature_detect_es_modules.js
Last active Jan 30, 2020
Feature detect ES modules: both static import and dynamic import()
View feature_detect_es_modules.js
Complete feature detection for ES modules. Covers:
1. Static import: import * from './foo.js';
2. Dynamic import(): import('./foo.js').then(module => {...});
Thanks to @_gsathya, @kevincennis, @rauschma, @malyw for the help.
ebidel / smoothscroll.js
Last active Jan 17, 2019
Smooth scroll page
View smoothscroll.js
(function() {
const scroller = document.scrollingElement || document.body;
// Smooth scrolls to the bottom of the page.
window.smoothScrollPage = (y = scroller.scrollHeight) => { = 'smooth';
scroller.scrollTop = y; = '';
ebidel / ce.js
Created Feb 24, 2017
Custom elements bootup perf
View ce.js
'use strict';
customElements.define('x-hello', class extends HTMLElement {
static get observedAttributes() {
return ['name'];
constructor() {
attributeChangedCallback(attrName, oldVal, newVal) {
ebidel / deep_find_all_elements.js
Last active Sep 22, 2017
Find all nodes used on the page, deep within v0 and v1 shadow DOM.
View deep_find_all_elements.js
* @author ebidel@ (Eric Bidelman)
* License Apache-2.0
* Convenience method finding all the DOM child nodes of a parent,
* includibg those within shadow roots. By default, all children
* under `<body>` will be returned. The parent node can be overridden
* by passing the `selector` param.
ebidel / index.html
Created Sep 16, 2016
<card-swiper> custom element - demonstrates the usage of the v1 polyfills.
View index.html
<!DOCTYPE html>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<title>How to use the Custom Elements v1 + Shadow DOM v1 polyfills</title>
body {
font-family: sans-serif;
ebidel / demo_polymer.html
Last active Nov 24, 2017
Custom Element v0 + Shadow DOM v0 example. Vanilla (webcomponents.js polyfill) vs. Polymer.
View demo_polymer.html
<title>Polymer example</title>
<link href='' rel='stylesheet' type='text/css'>
// Enable native SD if available and lazy register.
window.Polymer = window.Polymer || {
dom: 'shadow',
lazyRegister: 'max',
useNativeCSSProperties: true
ebidel / template_vs_innerhtml.html
Last active Oct 7, 2019
Fastest way to create shadow DOM (.innerHTML vs. <template>)
View template_vs_innerhtml.html
<!doctype html>
<title>What's the fastest way to create shadow DOM</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
body {
padding: 3em;
font-family: "Roboto", sans-serif;
ebidel / fancy-tabs-demo.html
Last active Feb 9, 2020
Fancy tabs web component - shadow dom v1, custom elements v1, full a11y
View fancy-tabs-demo.html
function execPolyfill() {
// CustomElementsV1.min.js v1 polyfill from
Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at
The complete set of authors may be found at
You can’t perform that action at this time.