Eric Bidelman ebidel

Distinguished Engineer @ Yahoo. xLyft. xGoogle, Chrome team. ❤️ all things web.

ebidel / chromelauncher-puppeteer.js

Last active February 28, 2018 18:29

How to use chrome-launcher to launch chrome, then connect to it using Puppeteer.

Moved to https://github.com/ebidel/puppeteer-examples/blob/master/lighthouse/chromelauncher_puppeteer.js

ebidel / lighthouse_puppeteer_throttling.js

Last active February 28, 2018 18:28

Custom network throttling for Lighthouse Testing using Puppeteer

Now at https://github.com/ebidel/puppeteer-examples/blob/master/lighthouse/throttling.js

ebidel / monitor_internet_connection.js

Last active February 28, 2018 18:32

Puppeteer: monitor status of internet connectivity using headless Chrome

Moved to https://github.com/ebidel/puppeteer-examples/blob/master/monitor_internet_connection.js

ebidel / sw_caching_size.js

Last active November 16, 2022 11:31

Print service worker cache sizes and overall bytes cached.

	/**
	* @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 September 4, 2023 13:56

Feature detect ES modules: both static import and dynamic import()

	<!--
	Complete feature detection for ES modules. Covers:

	1. Static import: import * from './foo.js';
	2. Dynamic import(): import('./foo.js').then(module => {...});

	Demo: http://jsbin.com/tilisaledu/1/edit?html,output

	Thanks to @_gsathya, @kevincennis, @rauschma, @malyw for the help.
	-->

ebidel / smoothscroll.js

Last active January 17, 2019 02:22

Smooth scroll page

	(function() {
	const scroller = document.scrollingElement \|\| document.body;

	// Smooth scrolls to the bottom of the page.
	window.smoothScrollPage = (y = scroller.scrollHeight) => {
	scroller.style.scrollBehavior = 'smooth';
	scroller.scrollTop = y;
	scroller.style.scrollBehavior = '';
	};

ebidel / ce.js

Created February 24, 2017 20:06

Custom elements bootup perf

	'use strict';

	customElements.define('x-hello', class extends HTMLElement {
	static get observedAttributes() {
	return ['name'];
	}
	constructor() {
	super();
	}
	attributeChangedCallback(attrName, oldVal, newVal) {

ebidel / deep_find_all_elements.js

Last active September 22, 2017 18:45

Find all nodes used on the page, deep within v0 and v1 shadow DOM.

	/**
	* @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 September 16, 2016 03:06

<card-swiper> custom element - demonstrates the usage of the v1 polyfills.

	<!DOCTYPE html>
	<html>
	<head>
	<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>

	<style>
	body {
	font-family: sans-serif;

ebidel / demo_polymer.html

Last active November 24, 2017 10:11

Custom Element v0 + Shadow DOM v0 example. Vanilla (webcomponents.js polyfill) vs. Polymer.

	<html>
	<head>
	<title>Polymer example</title>
	<link href='https://fonts.googleapis.com/css?family=Playfair+Display' rel='stylesheet' type='text/css'>
	<script>
	// Enable native SD if available and lazy register.
	window.Polymer = window.Polymer \|\| {
	dom: 'shadow',
	lazyRegister: 'max',
	useNativeCSSProperties: true