Skip to content

Instantly share code, notes, and snippets.

Avatar

Søren Louv-Jansen sqren

View GitHub Profile
@sqren
sqren / demo.js
Last active Apr 25, 2018
Recursively Iterate a nested structure and render strings as mustache templates
View demo.js
const input = {
email: {
subject: 'Happy birthday {{name}} 🎂',
body: 'Hi {{name}}, you are turning {{age}} today!'
}
};
const ctx = { name: 'Søren', age: 30 };
const tmpl = renderMustache(input, ctx);
// tmpl: {"email": {"subject": "Happy birthday Søren 🎂", "body": "Hi Søren, you are turning 30 today!"}}
@sqren
sqren / chromeless-random.js
Last active Sep 6, 2018
Randomly click around a webpage
View chromeless-random.js
// Deprecated. Use puppeteer instead: https://gist.github.com/sqren/94ab2b9c5e88c1c119182425b19bcd59
const { Chromeless } = require('chromeless');
const initialUrl = process.env.CHROMELESS_URL || 'https://www.dr.dk';
const chromeless = new Chromeless({
launchChrome: true
});
function sleep(ms) {
View keybase.md

Keybase proof

I hereby claim:

  • I am sqren on github.
  • I am sqren (https://keybase.io/sqren) on keybase.
  • I have a public key ASBUUQc0dmZTpHrgymt-8rvKrYuYbPx7R9WnAwNK6-F61wo

To claim this, I am signing this object:

@sqren
sqren / mock-router-and-redux.js
Last active Jan 9, 2018
Approaches to mocking React-router and Redux store
View mock-router-and-redux.js
import { mount } from 'enzyme';
import React from 'react';
import { createMockStore } from 'redux-test-utils';
import { Provider } from 'react-redux';
import { Router } from 'react-router-dom';
import createHistory from 'history/createHashHistory';
import PropTypes from 'prop-types';
export const mountWithRouterAndStore = (Component, storeState = {}) => {
const store = createMockStore(storeState);
@sqren
sqren / launch.json
Created Oct 11, 2017
Run Jest in vscode with breakpoints
View launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "Jest",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/node_modules/react-scripts/scripts/test.js",
"args": ["--runInBand", "--env=jsdom"],
"cwd": "${workspaceRoot}"
@sqren
sqren / launch.json
Created Sep 29, 2017
VSCode config for Jest runner
View launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "Jest",
"type": "node",
"request": "launch",
"args": ["--runInBand"],
"port": 9229,
"address": "localhost",
View jest-clear-cache.MD

Find cache location

npx jest --showConfig | grep cacheDirectory

Remove cache

rm -rf /var/folders/pg/hdsyy6t57jd8zgqlj4s2qk_r0000gn/T/jest_dx
@sqren
sqren / determine-changed-props.js
Last active Jan 20, 2021
Determine which props causes React components to re-render
View determine-changed-props.js
import React, { Component } from 'react';
export default function withPropsChecker(WrappedComponent) {
return class PropsChecker extends Component {
componentWillReceiveProps(nextProps) {
Object.keys(nextProps)
.filter(key => {
return nextProps[key] !== this.props[key];
})
.map(key => {
@sqren
sqren / compare.js
Created Aug 31, 2017
Compare react perf
View compare.js
const LOCAL_STORAGE_KEY = 'react_perf_benchmark';
function setBenchmark() {
localStorage.setItem(LOCAL_STORAGE_KEY, JSON.stringify(Perf.getWasted()));
}
function compareBenchmark() {
const originalWasted = JSON.parse(localStorage.getItem(LOCAL_STORAGE_KEY));
const newTable = Perf.getWasted()
.map(row => {
@sqren
sqren / eslint+prettier.MD
Last active Apr 16, 2018
ESLint + prettier setup
View eslint+prettier.MD

Install packages

yarn add eslint prettier eslint-{config,plugin}-prettier eslint-plugin-react  --dev --exact

package.json

{
  "scripts": {