Auto-destruct in 59 days

Updated: Execution of shell code in Ruby scripts

  • Deprecated all methods to execute shell code that are not capture3.
  • Added a list of reasons why backticks, system, exec, etc. are all horrible ways to execute commands.

Always use capture3.

Sending errors to sentry from development

For the initial setup or changes in the sentry reporting it might be useful to enabled reporting of sentry in development. Don't commit these changes and prefer to report to the staging environment. As other developers might be confused of these errors try to given them a proper message and delete them afterwards.

  1. Add config.raven_dsn = 'your-dns' in config/environments/development.rb.
  2. Add development to existing environments in the Raven.configure block: config.environments = ['development', 'staging', 'production'].
External contentRepeats

Ag: Very fast grep replacement

Ag (aka "the silver searcher") is a very fast replacement for grep.

It will parse your .gitignore for additional speedup. To ignore even more files (node_modules, *.min.js etc), add an .agignore with syntax identical to .gitignore.

On Ubuntu 14.04, don't install via apt-get, but build from source to get a current version.

See Faster Grepping in Vim for hints about vim integration.


A common mistake in validations using regular expressions

You certainly use regular expressions for validating strings, e.g. e-mail addresses by saying

validate :email, :with => /.../

Such regular expressions often look something like the following: /^[\w+\-.]+@[a-z\d\-.]+\.[a-z]+$/i which perfectly matches as expected:

>> "".match /^[\w+\-.]+@[a-z\d\-.]+\.[a-z]+$/i
=> #<MatchData "">

… and does not match unwanted values:

?> "invalid email@invalid".match /^[\w+\-.]+@[a-z\d\-.]+\.[a-z]+$/i
=> nil

I know that the express…

Vim read-only option

You can start vim with a read-only option. This prevents making accidentally changes in files you don't want to touch.

view /file/to/open

view is actually vim.

Use case

You have opened many similar files and accidentally type :wq in the wrong one. Did you make changes? Which changes you made? When do you notice you edited the wrong file?

External content

Auto-squashing Git Commits

git command line options for automating common rebasing tasks, like adding a fix to a commit that was already rebased into the history.

CSS: Don't target multiple vendor-prefixed pseudo-elements in a single rule

Some pseudo-elements need to be addressed with vendor prefixes. E.g. ::selection is not supported by Firefox, you need to use ::-moz-selection instead.

What you cannot do is to define a single CSS rule to address both the standard and vendor-prefixed form:

::selection, ::-moz-selection {
  background-color: red;

This rule will be ignored by all browsers. The reason is that if a browser doe…

External contentRepeats

The developer console can do more than you think!

You can do so much more than console.log(...)! See the attached link for a great breakdown of what the developer console can give you.

Some of my favorites:

console.log takes many arguments

E.g. console.log("Current string:", string, "Current number:", 12)

E.g. console.log("Check out the current %o, it's great", location)


How to view Image Metadata on the Linux Command Line with ImageMagick

ImageMagick has a command line tool called identify which can read image metadata:

>identify -verbose DSC00136.JPG
Image: DSC00136.JPG
Format: JPEG (Joint Photographic Experts Group JFIF format)
Class: DirectClass
Geometry: 5472x3648+0+0
Resolution: 350x350
Print size: 15.6343x10.4229
Units: PixelsPerInch
Type: TrueColor
Endianess: Undefined
Colorspace: sRGB
Depth: 8-bit
Channel depth:
red: 8-bit
green: 8-bit
blue: 8-bit
Channel statistics:
min: 0 (0)
max: 255 (1)
mean: 11…


Use "overflow: hidden" to avoid floating elements from wrapping a container's text

Consider this HTML:

<div id="container">
  <div id="actions">
    <a href="#">Click me!</a>
  <div id="content">
    Hello Universe! Hello Universe! Hello Universe! Hello Universe! Hello Universe! Hello Universe!

If you want the actions element to float on the left, you'd just say this in your CSS:

#actions { float: left; }

Unfortunately, any content of the content's text will wrap underneath it:


Beware: Nested Spreewald patiently blocks are not patient

When doing integration testing with cucumber and selenium you will often encounter problems with timing - For example if your test runs faster than your application, html elements may not yet be visible when the test looks for them. That's why Spreewald (a collection of cucumber steps) has a concept of doing things patiently, which means a given block that fails will be retried for a certain amount of time. Only if the time is up and the block still fails an error is thrown. This reduces flickering …

When does support end for a version of Internet Explorer?

The maximum version of Internet Explorer you can have depends on your version of Windows. E.g. Windows 7 users can use Internet Explorer up to version 11, but they cannot upgrade to Edge.

Since early 2016, Microsoft only supports the latest version of IE that is available for a given version of Windows. If you are using an older version of IE than you could, you will no longer receive security patches for your version.

In April 2017, this means the following:

  • Intern…

Sass: Do not use comments between selector definitions

Sass lets you easily specify multiple selectors at once like this:

    outline: 1px solid red

This will add a red outline on either real hover or when the has-hover class is present. However, adding a comment will void the definition of that line:

  &.has-hover, // From hoverable.js <-- DON'T
    outline: 1px solid red

… will simply drop the &.has-hover part.


Capybara/Selenium: evaluate_script might freeze your browser, use execute_script

In a nutshell: Do not use evaluate_script. Use execute_script instead!

Capybara gives you two different methods for executing Javascript:


While you can use both, the first line (with evaluate_script) might freeze your Firefox window for 10 seconds.

The reason is that evaluate_script will always return a result. The return value will be converted back to Ruby objects, which in case of complex objects (e.g. a jQuery collection) is *ver…

iOS Safari scales text in landscape mode

iOS Safari tries to be helpful and enlarges some(!) texts when you turn to landscape mode. In precise CSS building, this is annoying. Disable this behavior with:

  -webkit-text-size-adjust: 100% // Prevent font scaling in iOS landscape

LoDash: isBlank and isPresent mixins

When you need to check a value for presence, don't rely on JavaScript since it considers 0 or "0" false. Also don't rely on LoDash's _.isEmpty:

if ('0') { ... } // false
if (0) { ... } // false
if (!_.isEmpty('0')) { ... } // true (= good)
if (!_.isEmpty(0)) { ... } // false (= not good)

This is because isEmpty it is only meant for objects with a length.

While the name implies that it's meant only for collections, you probably still want something like isBlank or `is…

Generating barcodes with the Barby gem

Barby is a great Ruby gem to generate barcodes of all different sorts.

Example usage

Generating a barcode is simple:

>>'Hello Universe').to_png
=> "\x89PNG\r\n\u001A..."


Barby supports several barcode types and you must require all necessary files explicitly.

For the example above these are barby/barcode/code_128 and barby/outputter/png_outputter.
You can specify that in your Gemfile like so:

gem 'barby', require: %w(ba…

External contentAuto-destruct in 41 days

Unpoly 0.35.0 released


Compatible changes

  • Remove a use of global $ that prevented Unpoly from being used with with jQuery.noConflict().
  • Fix a bug where replacing the <body> element would lose the body class and other attributes
  • Fix a bug where Unpoly would set the document title to a <title> tag of an inline SVG image.

Incompatible changes

  • Drop support for IE 9, which hasn't been supported on any platform since January 2016.
  • Drop support for IE 10, which hasn't been supported…
3275 cards