thoughtbot/fake_stripe: A Stripe fake so that you can avoid hitting Stripe servers in tests.

fake_stripe spins up a local server that acts like Stripe’s and also serves a fake version of Stripe.js, Stripe’s JavaScript library that allows you to collect your customers’ payment information without ever having it touch your servers. It spins up when you run your feature specs, so that you can test your purchase flow without hitting Stripe’s servers or making any external HTTP requests.

We've also had tests actually hitting the testing sandbox of Stripe, which worked OK most of the time (can be flakey).

How to preview an image before uploading it

When building a form with a file select field, you may want to offer your users a live preview before they upload the file to the server.

HTML5 via jQuery

Luckily, HTML5 has simple support for this. Just create an object URL and set it on an <img> tag's src attribute:

$('img').attr('src', URL.createObjectURL(this.files[0]))

Unpoly Compiler

As an Unpoly compiler, it looks like this:

up.compiler '[image_p...

VCR: An OAuth-compatible request matcher

OAuth requires a set of params to be carried along requests, among which a nonce. Some libraries pass these along as headers, some as query parameters. All fine.

When you're using VCR, the latter case is an issue. By default, requests are matched on method and URI. However, no request URI will equal another when they include a nonce. You won't be able to match these requests with VCR.

Solution

Obviously you need to...

Reading and writing cookies in JavaScript

You can use JavaScript to get or set cookie values on the client.

Using the vanilla JavaScript API

In JavaScript, document.cookie is an accessor to all cookies on the current site. It looks like a String, but its setter is actually more powerful.

When setting cookies this way, remember to set the path=/ option.

Reading cookies

A result may look like this:

hello=universe; foo=bar

This means that there are 2 cookies: "hello" with value "universe", and "foo" with value "bar...

jQuery promises: done() and then() are not the same

jQuery's deferred objects behave somewhat like standard promises, but not really.

One of many subtle differences is that there are two ways to chain callbacks to an async functions.

The first one is done, which only exists in jQuery:

$.ajax('/foo').done(function(html) {
  console.debug("The server responded with %s", html);
});

There is also then, which all promise libraries have:

$.ajax('/foo').then(function(html) {
  console.debug("The server resp...

Analyse short links

Sometimes you might want to check a short link for it's destination before clicking on it. Additional you get information about the redirects.

Use the magic + at the end of the short url!

Google:
https://goo.gl/TXe0Kx => https://goo.gl/TXe0Kx+
Since the original publication of this post, Google's URL shortening service goo.gl has been discontinued.

Bitly:
http://bit.ly/1VRwNVt => [http://bit.ly/1VRwNVt+](http:/...

Manually uploading files via AJAX

To upload a file via AJAX (e.g. from an <input type='file'>) you need to wrap your params in a FormData object.

You can initialize a FormData using the contents of a form:

var form = document.querySelector('form.my-form') // Find the <form> element
var formData = new FormData(form); // Wrap form contents

Or you can construct it manually, param by param:

var fileInput = document.querySelector('form input[type=file]');
var attachment = fileInput.files[0];

var f...

Heads up: Angular may break links to the current URL (e.g. when using ngInclude)

Angular's location provider stalls links to the current URL, i.e. window.location. As soon as the $location service is activated in an Angular app, it will intercept links. The click event handler is registered in $LocationProvider.$get().

The motivation is reasonable, as they want to keep the Browser history clean when Angular is controlling it. However, when Angular is NOT controlling your interaction with the browser history (i.e. you're just using Angular as JS sugar on your page), Angular will create the above issue as soon as you u...

How to fix routing error when using concerns in Rails up to 3.2.22.1

tl;dr

  • Don't write resources :people, :concerns => :trashable

  • Write

    resources :people do
      concerns :trashable
    end
    

Why

Writing a controller spec I encountered this error:

Failure/Error: get :index
ActionController::RoutingError:
  No route matches {:controller=>"people"}

caused by this route definition

resources :people, :concerns => :trashable

which renders strange routes:

      trash_person PUT    /people/:id/trash(.:format)             people#check {:concerns=>:trashable}
          ...

nginx: How to drop connections for a location

If you want to configure your nginx to drop connections to a specific location, you can do so by responding with HTTP response code 444.

Status 444 is a non-standard response code that nginx will interpret as "drop connection".

Example:

server {
  listen 127.0.0.1;
  
  location /api/ {
    return 444;
  }
}

An example use case is reverse-proxying with nginx and simulating a route that drops connections.

Rails route namespacing (in different flavors)

TL;DR There are three dimensions you can control when scoping routes: path helpers, URL segments, and controller/view module.

scope module: 'module', path: 'url_prefix', as: 'path_helper_name' do
  resources :examples, only: :index
end

as → prefixes path helpers: path_helper_name_examples_path and path_helper_name_examples_url
path → prefixes URL segments: /url_prefix/examples
module → nests the controller: controller Module::ExamplesController, found at app/controllers/module/examples_controller.rb with views ...

Create and send any HTTP request using the Postman request builder

Talking with APIs makes more fun using Postman. As an alternative you can also use command line tools like cURL.

Image

snap install postman

How does it help me?

  • Editing multiline JSON bodies is much more comfortable than in the terminal
  • Saving named requests in a collection (can be shared with others)
  • Syntax highlighting when writing JSON bodies
  • History with all my requests
  • Multiple environments
  • Cookie manager

HTTP 302 redirects for PATCH or DELETE will not redirect with GET

A HTTP 302 Found redirect to PATCH and DELETE requests will be followed with PATCH or DELETE. Redirect responses to GET and POST will be followed with a GET. The Rails form_for helper will use a workaround to send POST requests with a _method param to avoid this issue for PATCH/DELETE.

If you make requests yourself, watch out for the following behavior.

When you make an AJAX request PATCH /foo and the /foo action redirects to /bar, browsers will request PATCH /bar. You probably expected the second requ...

Centering with CSS vertically and horizontally (all options overview)

There are a million ways to center <div>s or text in CSS, horizontally or vertically. All the ways are unsatisfying in their own unique way, or have restrictions regarding browser support, element sizes, etc.

Here are two great resources for finding the best way of aligning something given your use case and browser support requirements:

How to center in CSS

A long form that lets you define your use case and browser support requirements, then shows you the preferred way of aligning.

[Centering CSS: A co...

Geordi 1.3 released

Changes:

  • Geordi is now (partially) tested with Cucumber. Yay!
  • geordi cucumber supports a new @solo tag. Scenarios tagged with @solo will be excluded from parallel runs, and run sequentially in a second run
  • Support for Capistrano 2 AND 3 (will deploy without :migrations on Capistrano 3)
  • Now requires a .firefox-version file to set up a test firefox. By default now uses the system Firefox/a test Chrome/whatever and doesn't print warnings any more.
  • geordi deploy --no-migrations (aliased -M): Deploy with `cap ...

Marvel | Elastic

Dashboard (Marvel Kibana) and query tool (Marvel Sense) for Elasticsearch.

Once installed you can access Kibana and Sense at these local URLs:

Showing a custom maintenance page while deploying

Note

The maintenance mode is enabled on all application server as soon as the file /public/system/maintenance.html is present.

Installation

Add this line to your application's Gemfile:

 gem 'capistrano', '~> 3.0'
 gem 'capistrano-maintenance', '~> 1.0'

Add this line to you application's Capfile:

require 'capistrano/maintenance'

Enable task

Present a maintenance page to visitors. Disables your application's web interface by writing a #{maintenance_basename}.html file to each web server. The servers m...

Puppet: Delete certificate request

To delete a certificate request run sudo puppet ca destroy $your.full.hostname on your puppetmaster.

How to open a new tab with Selenium

Until recently, you could open a new tab via window.open when using execute_script in Selenium tests. It no longer works in Chrome (will show a "popup blocked" notification).

This is because browsers usually block window.open unless the user interacted with an element for security reasons. I am not sure why it did work via Selenium before.

Here is an approach that will insert a link into the page, and have Selenium click it:

path = "/your/path/here"
id = "helper_#{SecureRandom.hex(8)}"
execute_script <<-JAVASCRIPT
  ...

How to encode or decode quoted-printable strings

E-mails are usually encoded using Quoted Printable. Here is how to decode or encode such strings.

You probably know Quoted Printable from e-mail bodies appearing in Rails logs, where =s become =3Ds in URLs, or where long lines are split up and trailed by = after each split.

Decode Quoted Printable

Decoding such strings is actually quite simple using plain Ruby:

"foo=3Dbar".unpack('M')[0]
# => "foo=bar"

Note that unpack will return an array. Our result is the 1st item.
...

A collection of SVG Logos for developers

A collection of 700+ svg vector logos. The logos are optimized (removed duplicated paths / excessive groups / empty defs, linting, etc).
Almost 100 logos were recreated from rastered images #vectorized.

All logos appearing on the site are the property of their respective owners.

http://svgporn.com/

RSpec & Devise: How to sign in users in request specs

You know that Devise offers RSpec test helpers for controller specs. However, in request specs, they will not work.

Here is a solution for request specs, adapted from the Devise wiki. We will simply use Warden's test helpers -- you probably already load them for your Cucumber tests.

First, we define sign_in and sign_out methods. These will behave just like ...

Adjust cron jobs to allow full backtraces for rake tasks

As we get an exception notification, when a cron job fails, we wish to have the full backtrace in this mail. A rake task doesn't output the full backtrace by default, so you need the --backtrace option.

Trigger

You will find fail mails with a shortened backtrace

#[...]
Tasks: TOP => some_namespace:some_task
(See full trace by running task with --trace)

What rake wants from you
Running the rake task like rake some_namespace:some_task --backtrace

How this works with whenever
Define a own job_type and use it for r...

Exclusive cronjobs with flock and whenever

I had a very frequent cronjob that in rare cases could be relatively slow. To avoid multiple instances of this cronjob running in parallel, I decided to use flock to ensure that only one instance could run at a time.

flock works by acquiring a lock to a file, and if it can do so running a command. In order not to wait but simply give up when the file is locked, you can add -n:

flock /tmp/my.task.lock -n -c "bin/my-long-running-job"

Using whenever, and since this was a rake task, the follo...