Skip to content

Instantly share code, notes, and snippets.

Avatar
🟨
getting things done 💪🏻

Stefan Natter natterstefan

🟨
getting things done 💪🏻
View GitHub Profile
@natterstefan
natterstefan / 0_reuse_code.js
Created Jul 28, 2016
Here are some things you can do with Gists in GistBox.
View 0_reuse_code.js
// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console
View keybase.md

Keybase proof

I hereby claim:

  • I am natterstefan on github.
  • I am natterstefan (https://keybase.io/natterstefan) on keybase.
  • I have a public key ASDj9cIeoiAekkMwiS1ZlqPPfts4yWHQ89OQNX8b_TOaHAo

To claim this, I am signing this object:

@natterstefan
natterstefan / plate-snitch.js
Created Sep 1, 2017 — forked from taitems/plate-snitch.js
(Extract) Check the status of a vehicle registration and scrape results.
View plate-snitch.js
// Open form and submit enquire for `rego`
function getInfo(rego) {
horseman
.userAgent('Mozilla/5.0 (Windows NT 6.1; WOW64; rv:27.0) Gecko/20100101 Firefox/27.0')
.open(url)
.type('#registration-number-ctrl input[type=text]', rego)
.click('.btn-holder input')
.waitForSelector('.ctrl-holder.ctrl-readonly')
.html()
.then(function(body) {
View jest-react-intl-setup.js
/**
* Components using the react-intl module require access to the intl context.
* This is not available when mounting single components in Enzyme.
* These helper functions aim to address that and wrap a valid,
* English-locale intl context around them.
*
* Docs
* - https://github.com/yahoo/react-intl/wiki/Testing-with-React-Intl#enzyme
* - https://github.com/yahoo/react-intl/wiki/Testing-with-React-Intl#snapshot-testing
*
@natterstefan
natterstefan / scrollbar.css
Created Jul 4, 2018
CSS: vertical scrollbar
View scrollbar.css
/* width */
::-webkit-scrollbar {
width: 5px;
border: 1px solid #d5d5d5
}
/* Track */
::-webkit-scrollbar-track {
background: #f1f1f1;
}
@natterstefan
natterstefan / list.js
Created Jul 31, 2018
React - Example Component connected to react-router server w/ prefetching data
View list.js
/* eslint-disable no-underscore-dangle */
import React from 'react'
import PropTypes from 'prop-types'
import get from 'lodash.get'
import BemHelper from 'react-bem-helper'
import { apiClient } from '../../../common/api/client'
// Styling
const classes = new BemHelper('list')
@natterstefan
natterstefan / promise-all.js
Created Aug 7, 2018
Avoiding promise.all to fail
View promise-all.js
// inspired by (Credits):
// - A: https://davidwalsh.name/promises-results
// - B: https://nmaggioni.xyz/2016/10/13/Avoiding-Promise-all-fail-fast-behavior/
// Solution A
await Promise.all(loadDataRequests.map(p => p.catch(() => undefined)))
// Solution B
await Promise.all(
loadDataRequests.map(p =>
@natterstefan
natterstefan / README.md
Last active Mar 29, 2019
JEST | Debug with Google Chrome and/or VS Code
View README.md

How to debug Jest tests with Chrome

Taken from Jest's troubleshooting page:

  • Place a debugger; statement in any of your tests, and then, in your project's directory
  • yarn test-debug
  • open Chrome and go to chrome://inspect
  • click on "Open Dedicated DevTools for Node"
  • click on the address displayed in the terminal (usually something like
@natterstefan
natterstefan / README.md
Last active Apr 2, 2019
Lint-Staged - lint only staged files with eslint and stylelint
View README.md

Lint-Staged - lint only staged files with eslint and stylelint

Based on the solution created by luuuis, I added two npm scripts lint-css-staged and lint-js-staged. They both lint (with ESLint and stylelint) only staged files.

You could also use pre-commit.sh from luuuis, if you do not want to put this into your package.json.

Prettier provides an example as well.

@natterstefan
natterstefan / test.js
Created Apr 6, 2019
JEST & ENZYME | test component with React.createRef()
View test.js
import React from 'react'
import { mount } from 'enzyme'
describe('Foo', () => {
it('enzyme should mount object refs', () => {
// inspired by:
// - https://stackoverflow.com/a/55292957/1238150
// - https://github.com/styled-components/styled-components/blob/e6f1b85726512cde163dd5fcdd7fb0f2439d4a09/packages/styled-components/src/test/basic.test.js
// - https://github.com/styled-components/styled-components/blob/e6f1b85726512cde163dd5fcdd7fb0f2439d4a09/packages/styled-components/src/hoc/withTheme.js