3674 cards

Bookmarklet to generate a Pivotal Tracker story from Zammad Ticket

This is a bookmarklet you can add to Chrome or Firefox which will allow you to create a story in Pivotal Tracker from a Zammad ticket. This might come in handy when creating stories for SWAT Teams.

But first you will have to set two variables in the script below:

  • pt_project_id: the ID of the Pivotal Tracker Project you want to add stories to. This can be found as part of the URL of the project (https://www.pivotaltracker.com/n/projects/<pt_project_id>)
  • pt_token: the Pivotal Tracker token used for authentication. Can be found in y…

Linux, Arial and Helvetica: Different font rendering in Firefox and Chrome

When text renders differently in Firefox and Chrome, it may be caused by a font alias that both browsers handle differently.


A machine running Linux, and a website with the Bootstrap 3 default font-family: "Helvetica Neue", Helvetica, Arial, sans-serif.


Anti-aliasing and kerning of text looks bad in Firefox. Worse, it is rendered 1px lower than in Chrome (shifted down).


Firefox resolves "Helvetica" to an installed ["TeX Gyre Heros", which is its Ghostscript clone](https://www.fontsquirrel.com/fonts/…

Linked content

Guideline for moving from jQuery to vanilla JavaScript

jQuery is still a useful and pragmatic library, but chances are increasingly that you’re not dependent on using it in your projects to accomplish basic tasks like selecting elements, styling them, animating them, and fetching data—things that jQuery was great at. With broad browser support of ES6 (over 96% at the time of writing), now is probably a good time to move away from jQuery.

[Practical and clear reference with the most common jQuery patterns and their equivalent translations in vanilla JS](https://tobiasahlin.com/blog/move-from-j…

Ruby: The YAML safe_load method hides some pitfalls

The Ruby standard lib ships with a YAML Parser called Psych. But serializing and deserializing data seems not as obvious as if you are using JSON.

To safely write and read YAML files you should use Psych#dump (String#to_yaml) and Psych.safe_load (YAML.safe_load):

data = {'key' => 'value'}.to_yaml
=> "---\nkey: value\n"
=> {"key"=>"value"}

Unfortunately you might encounter a few pitfalls which are not obvious in the first place. All of them are a side effect that you can not configure Psych#dump to w…

Linked contentRepeats

Don't open user-supplied links with target="_blank"

This will give the target site full access to your Javascript environment through window.opener, if the target is on the same domain.

Even if the target site is on another domain, it still has some access and can for example manipulate window.location to perform a phishing attack.

You may use a rel="noopener" attribute to avoid this in modern browsers, except IE or Edge.


Don't require files in random order

A common pattern in Ruby is to to require all files in a specific diretory, using something like

Dir.glob(Rails.root.join('lib/ext/**/*.rb')).each do |filename|
  require filename

However, this causes files to be required in an order determined by the file system. Since load order can be important, this may lead to different behavior on different machines which are hard to debug.

Simply add a .sort:

Dir.glob(Rails.root.join('lib/ext/**/*.rb')).sort.each do |filename|
  require filename

Merge request check list

Merge requests are regularly rejected for the same few reasons.

We don't want that any more. Please attach the following list (colloquially known as "the TPS report") to future merge requests and check all (relevant) boxes:

I confirm that the code in this merge request… ————————————————
[ ] has green tests
[ ] has been manually tested in the browser
[ ] has no missing translations in the UI
[ ] has no ugly UI changes (long content breaking out of boxes, elements without margins, etc.)
[ ] works wi…


Capybara: you can use `evaluate_async_script` to execute asynchronous JavaScript

Capybara provides execute_script and evaluate_script to execute JavaScript code in a Selenium-controlled browser. This however is not a good solution for asynchronous JavaScript.

Enter evaluate_async_script, which allows you to execute some asynchronous code and wait until it finishes. There is a timeout of a couple of seconds, so it will not wait forever.

Use it like this:

let [done] = arguments
doSomethingAsynchronous().then(() => {
done() // call this to indicate we're done

Email validation regex

There is a practical short list for valid/invalid example email addresses - Thanks to Florian L.! The definition for valid emails (RFC 5322) can be unhandy for some reasons, though.

Since Ruby 2.3, Ruby's URI lib has a built in email regex. Probably that's the best solution to work with:


=> /\A[a-zA-Z0-9.!#$%&'*+\/=?^_`{ }~-]+@[a-zA-Z0-…

How to show jQuery event handler on element

Chrome gives you the currently selected element in the inspector with $0. If you select a button in the DOM you can set and inspect the event handler with the following two code lines:

$($0).on('click', function() { console.log('Hello') })
jQuery._data($0, "events").click[0].handler
// => "function () { console.log('Hello') }"

This is useful for debugging.


Be careful to use correct HTTP status codes for maintenance pages

When your public-facing application has a longer downtime for server maintenance or long migrations, it's nice to setup a maintenance page to inform your users.

When delivering the maintenance page, be very careful to send the correct HTTP status code. Sending the wrong status code might get you kicked out of Google, or undo years of SEO work.

Here are some ways to shoot yourself in the foot durign maintenance:

  • If all your routes send a "200 OK" with a HTML body "We're b…

How to bulk-unwatch many repositories on Github

To easily opt out of notifications for a large number of Github repositories, go to https://github.com/watching.

Rails: Verify the CSRF token

Rails uses a CSRF token in forms and AJAX requests to verify a user request. Internally it compares the injected CSRF token of the form data with the CSRF token in the encrypted user session. To prevent SSL BREACH attacks, the CSRF token from the form data is masked.

To better debug issues, when these tokens do not match, it is useful to unmask the CSRF token from the form da…

Rails: Decrypt a session cookie

This method helps you to manually decrypt the session cookie in Rails 5.2. Chrome can retrieve the session cookie string from Dev Tools > Application > Cookies > _application_name_session.

By default Rails >= 5.2 app uses JSON as cookie serializer. Before Marshal was used to serialize cookies. You can find out your application's cookies serializer with Rails.application.config.action_dispatch.cookies_serializer.

require 'cgi'
require 'json'
require 'active_support'

def verify_and_decrypt_json_session_cookie(cookie)

Unicorn: How to force a single threaded boot in development

Unicorn allows you to specify the maximum number of workers. In development this could be useful if you use a debugger, but do not want to overflow the console with other request like from ActionCable. Then just set the maximum number of workers to 1 and the other requests have to wait.

UNICORN_WORKERS=1 rails server

How to fix webpack-dev-server not found

The bin/webpack-dev-server command is not as smart as e.g. rails server, where it shows the proper fix within the error message.

$ bin/webpack-dev-server                                                                  
yarn run v1.19.1
error Command "webpack-dev-server" not found.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Run yarn install --check-files to fix this error.


Preload associations in loaded records

Sometimes you want to fetch associations for an ActiveRecord that you already loaded, e.g. when it has deeply nested associations.

Edge Rider gives your models a static method preload_associations. The method can be used to preload associations for loaded objects like this:

class UsersController < ApplicationController
  def show
    @user = User.find(params[:id])
    User.preload_associations [@user],  { :threads => { :posts => :author }, :messages => :sender }
end ...
Linked contentRepeats

sessionStorage: Per-window browser storage

All major browsers (IE8+, FF3.5+, Safari 4+, any Chrome) support sessionStorage, a JavaScript storage object that

  • survives page reloads and browser restores,
  • but is different per new tab/window (in contrast to localStorage which is shared across all tabs).

MDN says:

The sessionStorage object is most useful for hanging on to temporary data that should be saved and restored if the browser is accidentally refreshed


Example usage:

``` …

This website uses cookies to improve usability and analyze traffic.
Accept or learn more