nfcampos/esnextbin.md

## esnextbin.md

      
    Raw
  

              esnextbin.md
            
          
    made with esnextbin

  
## index.html
<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>ESNextbin Sketch</title>
  <!-- put additional styles and scripts here -->
</head>
<body>
  <!-- put markup and other contents here -->
</body>
</html>

## index.js
const realCreateElement = React.createElement

const Components = new Set()

const patchPrototype = (Component) => {
  Components.add(Component)
  for (const method of Object.keys(Component.prototype)) {
    if (typeof Component.prototype[method] == 'function') {
      const bind = (ctx, ...boundArgs) => {
        const fn = (...args) => {
          return Component.prototype[method].call(ctx, ...boundArgs, ...args)
        }
        fn.bind = bind
        return fn
      }
      Component.prototype[method].bind = bind
    }
  }
}

React.createElement = function createElement(type, ...args) {
  if (React.Component.prototype.isPrototypeOf(type) && !Components.has(type)) {
    patchPrototype(type)
  }

  return realCreateElement(type, ...args)
}

// actually this still doesn't work for eg. flux store listeners (I think)
// but I think I know how to make it work
// (ie. how to make sure Component.prototype[method] always points to the same reference)

## package.json
{
  "name": "esnextbin-sketch",
  "version": "0.0.0"
}

## transpiled.js
/*
unknown: Property id of VariableDeclarator expected node to be of a type ["LVal"] but instead got null
*/
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>ESNextbin Sketch</title>
	<!-- put additional styles and scripts here -->
	</head>
	<body>
	<!-- put markup and other contents here -->
	</body>
	</html>
	const realCreateElement = React.createElement

	const Components = new Set()

	const patchPrototype = (Component) => {
	Components.add(Component)
	for (const method of Object.keys(Component.prototype)) {
	if (typeof Component.prototype[method] == 'function') {
	const bind = (ctx, ...boundArgs) => {
	const fn = (...args) => {
	return Component.prototype[method].call(ctx, ...boundArgs, ...args)
	}
	fn.bind = bind
	return fn
	}
	Component.prototype[method].bind = bind
	}
	}
	}

	React.createElement = function createElement(type, ...args) {
	if (React.Component.prototype.isPrototypeOf(type) && !Components.has(type)) {
	patchPrototype(type)
	}

	return realCreateElement(type, ...args)
	}

	// actually this still doesn't work for eg. flux store listeners (I think)
	// but I think I know how to make it work
	// (ie. how to make sure Component.prototype[method] always points to the same reference)
	/*
	unknown: Property id of VariableDeclarator expected node to be of a type ["LVal"] but instead got null
	*/