tomcask

import { Component } from "React";

export var Enhance = ComposedComponent => class extends Component {
  constructor() {
    this.state = { data: null };
  }
  componentDidMount() {
    this.setState({ data: 'Hello' });
  }
  render() {

tomcask

React (Virtual) DOM Terminology

In React's terminology, there are five core types that are important to distinguish:

• ReactElement / ReactElement Factory
• ReactNode
• ReactComponent / ReactComponent Class

React Elements

tomcask

// default exports
export default 42;
export default {};
export default [];
export default foo;
export default function () {}
export default class {}
export default function foo () {}
export default class foo {}

tomcask

// === Arrays

var [a, b] = [1, 2];
console.log(a, b);
//=> 1 2


// Use from functions, only select from pattern
var foo = () => [1, 2, 3];

tomcask

const createBlocksWithImage = ()=>{
    const url = "https://www.google.es/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png";
    const entityKey = Entity.create( 'image', 'IMMUTABLE', { src: url } );
    const charData = CharacterMetadata.create({ entity: entityKey })
    const blockSpec = {
        type : 'atomic',
        text : ' ', 
        key: genKey(),
        depth: 0,
        characterList: List(Repeat(charData, 1))

tomcask

const initialState = {
    "entityMap": {
        "0": {
            "type": "image",
            "mutability": "MUTABLE",
            "data": {
                "src": "https://www.google.es/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png"
            }
        }
    },

tomcask

const getEditorState = this.props.store.getItem('getEditorState');
		const setEditorState = this.props.store.getItem('setEditorState');
		const selection = this.props.store.getItem('lastSelection');
		const editorState = getEditorState();
		const updateSelection = new SelectionState({
			anchorKey: selection.anchorKey,
			anchorOffset: selection.anchorOffset,
			focusKey: selection.anchorKey,
			focusOffset: selection.focusOffset,
			isBackward: false,

tomcask

//http://danburzo.ro/grunt/chapters/handlebars/
//In templating languages, partials are templates that can be reused in other templates. In Handlebars, you use the {{> partial }} helper to include partials. Let's take an example:
//Note: It's important to register the partial before compiling any template that includes it, otherwise it will throw an error.

<script type='text/x-handlebars' id='post-list-template'>
    <h2>{{ title }}</h2>
    <ul>
        {{#each posts}}
            <li>{{> post-item}}</li>
        {{/each}}

tomcask

Monitor events by ID:

monitorEvents(document.getElementById('id'))

Monitor events by class:

monitorEvents(document.querySelector('.class'))

tomcask

callLog = [];

/* set up an override for the Function call prototype
 * @param func the new function wrapper
 */
function registerOverride(func) {
   oldCall = Function.prototype.call;
   Function.prototype.call = func;
}