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...

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

This talk will be in German with English slides.

Introduction

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 differen...

Running Cucumber tests while your cucumber.yml is 100% valid may still produce the following error.

cucumber.yml was found, but could not be parsed. Please refer to cucumber's documentation on correct profile usage.

This may in fact be due to your rerun file (e.g. tmp/rerun.txt) being invalid. Delete it and try again.

tl;dr

Don't forget require 'English' if you use a named global such as $LAST_MATCH_INFO. Otherwise this could result in an annoying bug.

With Ruby's build-in library English you can reference global variables with an english name. This makes you code easier to read and is also suggested by Rubocop's Style/GlobalVars cop.

Example before:

if 'foo' =~ /foo/
  puts $~[1] # => foo
end

Example af...

betterspecs.org is a documentation on how to write better RSpec tests.

Note that there are also other approaches like The Self-Contained Test, which is complementary to the dry-approches in betterspecs. Like usual you need to weight the different recommendation and there is no rule of thumb for all specs.

With Rspec you can mock objects or functions, for example like this:

expect(my_object).to receive(:my_function).and_return('hello world')

It's also easy to remove mocks for an object:

RSpec::Mocks.space.proxy_for(my_object).reset

We use the whenever gem to automatically update the crontab of the servers we deploy to. By default, whenever will update all servers with a matching role (we use the :cron role ).

This card describes how to install some tasks only for a given Rails environment or for a given Capistrano stage ("deployment target").

Installing jobs only for a given Rails environment
-----------------------------------...

One of the earliest pieces of wisdom we are given as programmers is to not write duplicate code: Don’t Repeat Yourself (or DRY if you prefer). Identical blocks of code to set up a test sure does look like repetition, so we extract it into a before block.

This is a mistake for tests.

The article explains about how sharing setup between examples make test files harder to read and evolve.

A related frustration I have is working on ultra-DRY & betterspecs-like ...

This seems to be obvious, but you can expect Rake tasks to be called in RSpec.

it 'deletes all Users' do
   FactroyBot.create(:user)
   expect(Rake::Task['notify:critical_operation']).to receive(:invoke)
   
   expect { described_class.clean }.to change(User, :count).from(1).to(0) 
end

Note: Try to avoid logic in rake tasks and prefer to just call classes in them.

Example:

desc 'Some task'
task :some_task do
  SomeClass.new.run
end

Using git fixup helps you to speed up appending changes further back in the git history of your feature branch.

Example:

git commit --fixup aabbcc # Create a commit with the message "fixup! Commit message of aabbcc"
git rebase -i --autosquash master

It would be nice if you could use this feature without the -i flag, but until now it seems not to be possible. Read more about our recommended git workflow for feature branches.

Also have a look at [git shortcut to use git fixup](https://makandracards.com/makand...

To make CSS rules dependent on the screen size, we use media queries:

@media (max-width: 500px) {
  // rules for screen widths of 500px or smaller
}

Browsers will automatically enable and disable the conditional rules as the screen width changes.

To detect responsive breakpoints from JavaScript, you may use the global matchMedia() function. It is supported in all brow...

You can install rubygems 3.0.8 (released on February 18, 2020) to keep all the Gem::Specification#rubyforge_project deprecation warnings away from your development log. With Rubygems >= 3.1 this deprecation warning was introduced. While maintaining older projects this could get quite annoying and the fix below might okey, for newer projects the right ways is to upgrade the gems.

gem update --system 3.0.8

Example message:

NOTE: Gem::Specification#rubyforge_project= is deprecated with no replacement. It will be removed o...

When you have many changes, and you want to spread them across different commits, here is a way to stage all changes matching a given regular expression for a single commit.

Example

Consider the following git diff output.

diff --git a/file1.rb b/file1.rb
index 806ca88..36d536b 100644
--- a/file1.rb
+++ b/file1.rb
@@ -1,7 +1,5 @@
-# Here is a useless comment.
-# It will be removed.
 class File1
-  def foo
+  def bar
     # ...
   end
 end
diff --git a/file2.rb b/file2.rb
index 550e1c6..600f4e3 100644
--- a/file2.rb
+++ b/file2...

The linked GitHub repository is a bit like our "dev" cards deck, but groomed from a single person (Josh Branchaud). It includes an extensive list of over 900 TILs on many topics that might be interesting for most of us. (e.g. Ruby, Rails, Git, Unix..)

Ruby

Here is an excerpt of all the Ruby TILs that were new to me. I encourage you to take your time to skim over the original list as well!

• Assoc For Hashes
  • `Hash#ass...

In Active Record you can use named bindings in where-conditions. This helps you to make your code more readable and reduces repetitions in the binding list.

Example without named bindings

User.where(
  'name = ? OR email ?',
  params[:query],
  params[:query]
)

Example with named bindings

User.where(
  'name = :query OR email :query',
  query: params[:query]
)

With puma you can have concurrent requests. There are two concepts on how Puma can handle two incoming requests: Workers and Threads.

Workers

Puma can have multiple workers. Each worker is a process fork from puma and therefore a very heavy instance and can have multiple threads, that handle the incoming requests.

Example: A Puma server with 2 workers and 1 thread each can handle 2 request in parallel. A third request has to wait until the thread of one of the workers is free.

Threads

Rails is thread-safe since version 4 (n...

Test-Driven Development (TDD) in its most dogmatic form (red-green-refactor in micro-iterations) can be tedious. It does not have to be this way! This guide shows a pragmatic approach with integration and unit tests, that works in practice and improves on productivity.

Advantages

• No added effort: tests need to be written anyway.
• Test heads serve as todo lists. You'll always know what is finished and what is left to do.
• Big tasks are broken down into smaller tasks that can be processed one by one.
• You will not forget a test.
• You...

Simplecov is a code coverage tool. This helps you to find out which parts of your application are not tested.

Integrating this in a rails project with rspec, cucumber and parallel_tests is easy.

1. Add it to your Gemfile and bundle

   group :test do
     gem 'simplecov', require: false
   end
   

2. Add a .simplecov file in your project root:

   SimpleCov.start 'rails' do
     # any custom configs like groups and filters can be here at a central place
     enable_cov...
   

A recent patch level Ruby update caused troubles to some of us as applications started to complain about incompatible gem versions. I'll try to explain how the faulty state most likely is achieved and how to fix it.

Theory

When you deploy a new Ruby version with capistrano-opscomplete, it will take care of a few things:

• The new Ruby version is installed
• The Bundler version stated in the Gemfil...

Chrome allows you to throttle the Network and the CPU. Both settings are useful to measure the performance of you application and reproduce performance issues (Example Debugging frontend performance issues with Chrome DevTools).

You find the settings in: DevTools > Performance > Capture Settings (Gear icon in the right corner) > `CPU: No...

Intro

Embedding videos on a website is very easy, add a <video> tag to your source code and it just works. Most of the time.

The thing is: Both the operating system and Browser of your client must support the container and codecs of your video. To ensure playback on every device, you have to transcode your videos to one or more versions of which they are supported by every device out there.

In this card, I'll explore the available audio and video standards we have right now. The goal is to built a pipeline that...

Code comments allow for adding human readable text right next to the code: notes for other developers, and for your future self. You can imagine comments as post-its (or sometimes multi-sheet letters ...) on real-world objects like cupboards, light switches etc.

As always, with power comes responsibility. Code comments can go wrong in many ways: they may become outdated, silently move away from the code they're referring to, restate the obvious, or just clutter files.

Good Comments

Here are some simple rules to keep your comments help...

To find an input with the type hidden, you need to specify the type hidden:

find_field('Some label', type: :hidden)

Otherwise you will see an exception :

find_field('Some label')
# => Capybara::ElementNotFound: Unable to find field "Some label" that is not disabled`.

Note: Usually you don't need to check the input of hidden fields in an integration test. But e.g. waiting for a datepicker library to write the expected value to this field before continuing the test, which prevents flaky tests, is a valid use case.