Skip to content

Instantly share code, notes, and snippets.

Avatar

Matt Ziemer mziemer21

  • Pinterest
  • San Francisco, CA
View GitHub Profile
@mziemer21
mziemer21 / create-required-context.js
Created May 16, 2018 — forked from kentcdodds/create-required-context.js
create react context that has a validated consumer.
View create-required-context.js
// create a React context Provider/Consumer pair that
// validates the consumer is rendered within a provider
function createRequiredContext(name) {
const Context = React.createContext()
function Consumer(props) {
return (
<Context.Consumer {...props}>
{val => {
if (!val) {
@mziemer21
mziemer21 / login.js
Created Mar 15, 2018 — forked from kentcdodds/login.js
Example of a test that doesn't use enzyme or TestUtils
View login.js
import React from 'react'
function Login({onSubmit}) {
return (
<div>
<form
data-test="login-form"
onSubmit={e => {
e.preventDefault()
const {username, password} = e.target.elements
@mziemer21
mziemer21 / cssCoverage.js
Last active Jan 19, 2018
CSS rule coverage example
View cssCoverage.js
'use strict';
launchChrome()
.then(async chrome => {
const cdp = await CDP({port: chrome.port});
try {
const {CSS, DOM, Page, Profiler} = cdp;
setupDevToolsTarget(cdp);
@mziemer21
mziemer21 / README.md
Created Sep 27, 2016 — forked from addyosmani/README.md
108 byte CSS Layout Debugger
View README.md

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

@mziemer21
mziemer21 / simulate_keypress.js
Created Sep 18, 2016 — forked from ejoubaud/simulate_keypress.js
Simulate keypress that works in Google nav in Chrome
View simulate_keypress.js
// Based on http://stackoverflow.com/a/10520017/1307721 and http://stackoverflow.com/a/16022728/1307721
Podium = {};
Podium.keydown = function(k) {
var oEvent = document.createEvent('KeyboardEvent');
// Chromium Hack
Object.defineProperty(oEvent, 'keyCode', {
get : function() {
@mziemer21
mziemer21 / ReactPerfTester.js
Created Sep 12, 2016 — forked from saifelse/ReactPerfTester.js
Example of how to use react-addons-perf in tests
View ReactPerfTester.js
/* eslint-disable no-console */
import Perf from 'react-addons-perf';
import sinon from 'sinon';
/**
* Counts the number of DOM operations that occurred while executing `fn`.
*
* Example usage:
# import React from 'react';
# import ReactDOM from 'react-dom';
@mziemer21
mziemer21 / RecordPerfButton.js
Created Sep 5, 2016
just the same as the original, run through `coffee` and `standard-format`
View RecordPerfButton.js
/*
Usage: `require('debug/RecordPerfButton').attachToDOM()`
Add to any file to attach a record button to the DOM, toggleable via click and <alt> keypress.
Useful for quickly testing performance as it will:
- start/stop a perf measurement,
- make Perf accessible on window,
- and log the wasted time.
*/
@mziemer21
mziemer21 / README.md
Created Jun 9, 2016 — forked from Dr-Nikson/README.md
Auth example (react + redux + react-router)
View README.md
View gist:ca3d3e3a1a9baaffefbc
-> tempExtremities
| normal -> lesion
| | no -> peripheralPulse
| | | normal -> capFillTime
| | | | low -> hadSurgery
| | | | | yes -> pain : +
| | | | | yes -> pain
| | | | | | severe -> rectalExam
| | | | | | | normal -> abdominalDistension
| | | | | | | | slight -> pulse
View lolz
|tempExtremities
| |pain
| | |lesion
| | | |packedCellVolume
| | | | |hadSurgery
| | | | -Died
| | | | |peripheralPulse
| | | | | |abdominalDistension
| | | | | | |abdominalDistension
| | | | | | | |abdomen