trotzig

import Button from './';

export const primary = () => 
  <Button primary>Submit</Button>;
export const secondary = () => 
  <Button secondary>Cancel</Button>;
export const disabled = () => 
  <Button disabled>Send</Button>;

trotzig

#!/usr/local/bin/dock bash

# Generates and uploads Happo diffs for the differences between the previous
# and current commit.
set -euo pipefail

PREVIOUS_SHA="$(git rev-parse ${1-HEAD^})"
CURRENT_SHA="$(git rev-parse ${1-HEAD})"
echo "Previous SHA: ${PREVIOUS_SHA}"
echo "Current SHA: ${CURRENT_SHA}"

trotzig

Report format:

[{
  component: 'Button', // The name of the component
  variant: 'default', // e.g. 'blue', 'with overflow', 'large', 'without user profile'
  target: 'android', // the combination of platform and viewport. For web, this will be 'firefox-mobile', 'firefox-desktop', 'chrome-desktop', etc. 
  width: 88, // the width of the image, not the viewport
  height: 30, // the height of the image, not the viewport

trotzig

Ideas for a report format for happo

After running happo, a snapshot report file is either created or updated. In it, all tests you have specified are listed, with urls to the screenshots. Here's an example format:

{
   // snapshot-report.json
   '<component-name>': {
     '<variant>': {
 '': 'https://url/to/screenshot',

trotzig

diff --git a/packages/brigade-core/src/test/types/BrigadePropTypes_spec.js b/packages/brigade-core/src/test/types/BrigadePropTypes_spec.js
index 06a395a..26d3749 100644
--- a/packages/brigade-core/src/test/types/BrigadePropTypes_spec.js
+++ b/packages/brigade-core/src/test/types/BrigadePropTypes_spec.js
@@ -7,30 +7,34 @@ import BrigadePropTypes from '../../types/BrigadePropTypes';
 
 function typeCheckFail(declaration, value, message) {
   const props = { testProp: value };
-  const error = declaration(
-    props,

trotzig

if [ ! -f .ORIGINAL_MAC_ADDRESS ]; then
  ifconfig en0 | grep ether | cut -d' ' -f2 > .ORIGINAL_MAC_ADDRESS
  echo "Backup of original MAC address saved in .ORIGINAL_MAC_ADDRESS"
fi

if [[ -z "$1" ]]; then
  echo "Usage: ./new-mac-address.sh [generate|reset]"
  exit 0
fi

trotzig

import { addEventListener, removeEventListener } from 'consolidated-events';
import React, { PureComponent } from 'react';

/**
 * HoC that injects a `contextWidth` prop to the component, equal to the
 * available width in the current context
 *
 * @param {Object} Component
 * @return {Object} a wrapped Component
 */

trotzig

const REGEX_CONST_LET_VAR = /\A(const|let|var)\s+([\s\S]+?)\s*=\s*(w+?)(('|")([^\('|")]+)('|"));?\s*\Z/

trotzig

const REGEX_CONST_LET_VAR = XRegExp(`
  \A
  (?<declaration_keyword>const|let|var)\s+ # <declaration_keyword>
  (?<assignment>.+?)  # <assignment> variable assignment
  \s*=\s*
  (?<import_function>\w+?)\( # <import_function> variable assignment
    (?<quote>'|\")    # <quote> opening quote
    (?<path>[^\\2\n]+) # <path> module path
    \k<quote>         # closing quote
  \);?

trotzig

    REGEX_CONST_LET_VAR = /
      \A
      (?<declaration_keyword>const|let|var)\s+ # <declaration_keyword>
      (?<assignment>.+?)   # <assignment> variable assignment
      \s*=\s*
      (?<import_function>\w+?)\( # <import_function> variable assignment
        (?<quote>'|")      # <quote> opening quote
        (?<path>[^\2\n]+)  # <path> module path
        \k<quote>          # closing quote
      \);?