rinogo

///////
//To test this code, execute it locally or copy/paste it at https://try.playwright.tech/
//Usage example: `await waitForMutationToStop(await page.$("#container"));`
///////

// @ts-check
const playwright = require("playwright");

//Wait for `elem` to have no mutations for a period of `noMutationDuration` ms. If `timeout` ms elapse without a "no mutation" period of sufficient length, throw an error. If `waitForFirstMutation` is true, wait until the first mutation before starting to wait for the `noMutationDuration` period.
const waitForMutationToStop = async (elem, noMutationDuration = 3000, timeout = 60000, waitForFirstMutation = true) => {

nite

import { Observable } from 'rxjs';
import { computed, IValueDidChange } from 'mobx';
import isNil from 'lodash/isNil';
import omit from 'lodash/omit';
import { IEqualsComparer } from 'mobx/lib/internal';

interface ToObservableOptions<T> {
    initial?: boolean;
    equals?: IEqualsComparer<T>;
}

nzvtrk

import { debounce } from 'lodash';
import axios from 'axios';

// or vanilla debounce
// const debounce = (func, timeOut) => { 
//   let timer
// 
//   return (...args) => {
//      if (timer) clearTimeout(timer)
//      timer = setTimeout(func, timeOut)

shilman

Storybook Docs w/ CRA & TypeScript

This is a quick-and-dirty walkthrough to set up a fresh project with Storybook Docs, Create React App, and TypeScript. If you're looking for a tutorial, please see Design Systems for Developers, which goes into much more depth but does not use Typescript.

The purpose of this walkthrough is a streamlined Typescript / Docs setup that works out of the box, since there are countless permutations and variables which can influence docs features, such as source code display, docgen, and props tables.

Step 1: Initialize CRA w/ TS

npx create-react-app cra-ts --template typescript

Spencatro

I've been working with plot.ly dash a bit lately, and let me tell you: this tool is incredible. I won't spend too long gushing about it, but definitely check it out if you ever need to draw graphs, but don't want to have to learn a million javascript graphing libraries to get it done. This gist will assume you have a decent base knowledge of plot.ly dash, so if you don't have much experience, you probably will want to go play around with it some.

While composing various interactive graphs, I found that I needed a way to use clickData events from multiple graphs as inputs to a callback, so that when a user clicked on any of three graphs, some other graph could redraw using a subset of data from whichever graph was clicked. This starts out sounding like a pretty

nite

/**
 * Serialise input as key-value pair string, eg. for human-readable logs.
 *
 * @param {any} body
 * @param {number} nest
 * @param {string} delimiter
 * @param {string} arrayDelimiter
 * @param {boolean} nested
 * @returns {string}
 */

hdodov

function iframeURLChange(iframe, callback) {
    var lastDispatched = null;

    var dispatchChange = function () {
        var newHref = iframe.contentWindow.location.href;

        if (newHref !== lastDispatched) {
            callback(newHref);
            lastDispatched = newHref;
        }

fokusferit

Shallow

Real unit test (isolation, no children render)

Simple shallow

Calls:

• constructor
• render

sinedied

Introduction to Angular

Angular (aka Angular 2) is a new framework completely rewritten from the ground up, replacing the famous AngularJS framework (aka Angular 1.x).

More that just a framework, Angular should now be considered as a whole platform which comes with a complete set of tools, like its own CLI, debug utilities or performance tools.

Getting started

kidsil

const AWS = require('aws-sdk');
const CognitoSDK = require('amazon-cognito-identity-js-node');
AWS.CognitoIdentityServiceProvider.AuthenticationDetails = CognitoSDK.AuthenticationDetails;
AWS.CognitoIdentityServiceProvider.CognitoUserPool = CognitoSDK.CognitoUserPool;
AWS.CognitoIdentityServiceProvider.CognitoUser = CognitoSDK.CognitoUser;

const Username = 'testuser';
const TempPassword = 'TemporaryPassword2!';
const NewPassword = 'NewPassword@#@!19';
const Email = 'some@email.com';