3740 cards
Linked content

FactoryBot: Traits for enums

FactoryBot allows to create traits from Enums since version 6.0.0

The automatic definition of traits for Active Record enum attributes is enabled by default, for non-Active Record enums you can use the traits_for_enum method.


factory :user do
  traits_for_enum :role, %w[admin contact] # you can use User::ROLES here, of course

is equivalent to

factory :user do
  trait :admin do
    role { 'admin' }

  trait :contact do
    role { 'c...

The HTML5 video element

# Basic HTML example
<video poster="preview_image.png" controls>
  <source src="or_here.webm" type="video/webm" />
  <source src="alternative_if_browser_cant_pay_first_source.mp4" type="video/mp4" />
  <track src="optional_subtitles.vtt" kind="subtitles" srclang="de" label="Deutsch" default>

# Javascript API (notable methods and properties)
video = document.querySelector('video')
video.load() // Reset to the beginning and select the best available source
video.currentSrc // The selected source
Linked contentAuto-destruct in 57 days

Updated: JavaScript: Testing the type of a value

Added a section about duck typing:

Duck typing

To check whether an object contains a property ("responds to a method" in Ruby lingo), use the in operator. It checks whether a property exists in the object or its prototype chain:

let parent = { parentKey: 1 }
let child = Object.create(parent)
child.childKey = 2

'childKey' in child  // => true
'parentKey' in child // => true
'otherKey' in child  // => false

Note that there is a difference between a property that is missing from an object, or a property being set to ...

Shorthand function properties in ES6

Here is an ES5 object literal with two string properties and a function property:

let user = { 
  firstName: 'Max',
  lastName: 'Muster',
  fullName: function() { return this.firstName + ' ' + this.lastName }

user.fullName() // => 'Max Muster'

In ES6 we can define a function property using the following shorthand syntax:

let user = { 
  firstName: 'Max',
  lastName: 'Muster',
  fullName() { return this.firstName + ' ' + this.lastName }

user.fullName() // => 'Max Muster'

We can also define a gette...

The JavaScript Object Model: A deep dive into prototypes and properties

Speaker today is Henning Koch, Head of Development at makandra.

This talk will be in German with English slides.


As web developers we work with JavaScript every day, even when our backend code uses another language. While we've become quite adept with JavaScript at a basic level, I think many of us lack a deep understanding of the JavaScript object model and its capabilities.

Some of the questions we will answer in this talk:

  • How does the new keyword construct an object?
  • What is the differenc...

Merging two JavaScript objects

Let's say you want to merge the properties of two JavaScript objects:

let a = { foo: 1, bar: 2 }
let b = { bar: 3, baz: 4 }

let merged = merge(a, b) // => { foo: 1, bar: 3, baz: 4 }

Depending on your build, there are several ways to implement merge().

When you have ES6

When you have an ES6 transpiler or don't support IE11, you may use the spread operator (...) to expand both objects into a new object literal:

let merg...

Test Driven Development with Cucumber and RSpec

Test Driven Development is the paradigm to "first write a test, then implement the code". This guide shows how to apply it in practice, with Cucumber and RSpec as integration and unit test frameworks.

Hierarchical approach

I like to view TDD as a process with three levels:

  • Cucumber level (integration test)
  • Code level
  • RSpec level (unit test)

During development you are frequently changing levels. It may look something like this:

Integration __               _
Code          \__   ___   __/
Spec             \_/   \_/



Webmock normalizes arrays in urls

Typhoeus has a different way of representing array params in a get request than RestClient.

Typhoeus: http://example.com/?foo[0]=1&foo[1]=2&foo[2]=3
RestClient: http://example.com/?foo[]=1&foo[]=2&foo[]=3

Webmock normalizes this url when matching to your stubs, so it is always http://example.com/?foo[]=1&foo[]=2&foo[]=3. This might lead to green tests, but in fact crashes in real world. Rack::Utils.build_nested_query might help to build a get re...


Use find_in_batches or find_each to deal with many records efficiently

Occasionally you need to do something directly on the server -- like having all records recalculate something that cannot be done in a migration because it takes a long time.

Let's say you do something like this:


Even though you may have been successful with this on your development machine or the staging server, keep in mind that production machines often hold a lot more records. Using all may just work, even with lots of records, but when you iterate over such records and fetch associati...

Auto-destruct in 55 days

Spreewald 2.5.0 released

You might not have noticed, but our gem Spreewald was already downloaded over 1.000.000 times!
Here is what has changed in the most recent version:


  • Add a set of steps to control browser tabs (Selenium only):
    • I open ... in a new browser tab
    • I close the browser tab
    • I switch to the new browser tab
    • I switch to the previous browser tab
    • I may open a new browser tab (required for the following step)
    • I should( not)? have opened a new browser tab
    • `there should ...
Linked content

PostgreSQL: Prefer text over varchar columns

PostgreSQL offers three character types for your columns:

  • character varying(n) (also called varchar or just string): Contents are limited to n characters, smaller contents are allowed.
  • character(n): All contents are padded with spaces to allocate exactly n characters.
  • text: There is no upper or lower character limit (except for the absolute maximum of 1 GB).

The documentation states:

There is no performance difference among these three types, apart from...

HTTP Client in RubyMine

RubyMine has a HTTP Client that can be useful to test web APIs.
Just create a .http scratch file an write your request in it.
The request can then be executed with the "Run all requests in File" button above the file.

The format for request is like this:

Method Request-URI HTTP-Version
Header-field: Header-value


Some examples:

// A basic get request
GET http://example.com/api/
// A POST with json body
POST http://example.com/api/
Content-Type: application/json

{ "key" : "value" }

It also sup...

Select2 alternatives without jQuery

Select2 is a fantastic library for advanced dropdown boxes, but it depends on jQuery.

We have used Selectr with some success, but that project is no longer maintained.

Choices.js has also been used in production and works. It uses the powerful Fuse search library for filtering list items.

We're currently testing out tail.select, which looks good but says it's still...

How to use Active Job to decouple your background processing from a gem

In a web application you sometimes have tasks that can not be processed during a request but need to go to the background.
There are several gems that help to you do that, like Sidekiq or Resque.

With newer Rails you can also use ActiveJob as interface for a background processing library. See here for a list of supported queueing adapters.
For ...

Linked content

Howto: Select2 with AJAX

Select2 comes with AJAX support built in, using jQuery's AJAX methods.
For remote data sources only, Select2 does not create a new element until the item has been selected for the first time. This is done for performance reasons. Once an has been created, it will remain in the DOM even if the selection is later changed.

If you have a huge collection of records for your select2 input, you can populate it via AJAX in order to not pollute your HTML with lots of <option> elements.

All you have to do is to provide...

Linked content

Testing for XSS in Markdown Fields

If you render markdown from user input, an attacker might be able to use this to inject javascript code into the source code of your page.
The linked github page is a collection of common markdown XSS payloads which is handy for writing tests.

Producing arbitrary links:

[Local Storage](javascript:alert(JSON.stringify(localStorage)))
[In Quotes]('javascript:alert("InQuotes")')

Using onload...

Linked contentAuto-destruct in 50 days

Updated: Jasmine: Expecting objects as method invocation arguments

Added that toEqual() also works with partial matchers:


Error handling in DOM event listeners

When an event listener on a DOM element throws an error, that error will be silenced and not interrupt your program.

In particular, other event listeners will still be called even after a previous listener threw an error. Also the function that emitted the event (like element.dispatchEvent() or up.emit()) will not throw either.

In the following example two handlers are listening to the foo event. The first handler crashes, th...

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