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…
Project management best practices: Working with clients in person
When working on a bigger project, the easiest way to improve your work relation with a client or an external product manager, is to make sure you see them in person once in a while.
It makes sense to meet each other when you start working together to establish a relationship and find out what makes them tick.
If you need to discuss a larger package of work, use the opportunity and meet up and discuss it in person.
When you have to discuss something in your daily work, prefer talking to writing, and consider using a webcam.
CSS font metrics in detail
Line-height and vertical-align are simple CSS properties. So simple that most of us are convinced to fully understand how they work and how to use them. But it’s not. They really are complex, maybe the hardest ones, as they have a major role in the creation of one of the less-known feature of CSS: inline formatting context.
For example, line-height can be set as a length or a unitless value 1, but the default is normal. OK, but what normal is? We often read that it is (or should be) 1, or maybe 1.2, even the CSS spec is unclear on that…
Choosing the right gems for your project
Adding a gem means you take over the liability towards the external code.
Checklist
Based on "To gem, or not to gem":
- Gem is really needed (prefer writing your own code for simple requirements without many edge cases)
- Gem is tested well (coverage and quality)
- Gem has a good code quality
- Gem's licence fits to the project requirement
- Try to avoid gems that do much more than your requireme…
Working with or without time zones in Rails applications
Rails supports time zones, but there are several pitfalls. Most importantly because Time.now and Time.current are completely different things and code from gems might use one or the other.
Especially configuring an application that cares only about one time zone is a bit tricky.
The following was tested on Rails 5.1 but should apply to Rails 4.2 as well.
Using only local time
Your life will be easier if your application does not need to support time zones. Disable them like this:
```
config.time_zone = 'Berlin' # Your local time…
RubyMine: Efficiently filtering results in the "Finder" overlay
RubyMine comes with a nice way to grep through your project's files: The finder (ctrl + shift + f). Don't be discouraged about the notice 100+ matches in n+ files if your searched keyword is too general or widely used in your project.
RubyMine comes with a few ways to narrow down the resulting list, don't hesitate to apply those filters to speed up your search. Your keybinding might vary based on your personal settings.
File mask (alt + k)
If you already know the file extension of your …
Regular Expressions: Excessive backtracking can get yourself in trouble
Two weeks ago, Cloudflare was struck by a global outage that lasted ~30 minutes. The incident was rooted on a CPU exhaustion caused by a single regular expression containing some catastrophic backtracking:
.*(?:.*=.*)
This is a small reminder do keep using the lazy operator ? whenever possible and furthermore be aware that regular expressions should not only be unit-tested but also evaluated in terms of performance.
CSS Support Guide for Email Clients
CSS support in major e-mail clients is horrible.
This will give you an overview what you will not be able to use across all clients.
Beware of "nil" values in params
Recent rails security updates have shown that people make incorrect assumptions about the possible contents of the params hash.
Just don't make any! Treat it as what it is: potentially unsafe user input. For example:
/pages/edit?foo --> params == {:foo => nil}
/pages/edit?foo[] --> params == {:foo => [nil]} # at least in older rails 3 and in rails 2.x
Be especially wary about stuff like
User.find_by_password_reset_token(params[:password_reset_token])
If params[:password_reset_token] is nil, you'll retriev…
Ruby blocks: Braces and do/end have different precedence
Braces and do/end are completely swappable—almost all the time. They have different precedence. It’s not often that anyone comes across what this means in practice.
TL;DR {} binds stronger than do…end (as always in Ruby, special characters bind stronger than words)
Demo
Right way
names = ['bRUce', 'STaN', 'JOlIE']
# Blocks in braces are passed to the rightmost method
print names.map { |name| name.downcase }
print(names.map do |name| name.downcase end) # equivalent
=> ["bruce", "stan", "jolie"]
Wrong way
Avoid…
Webpack(er): A primer
webpack is a very powerful asset bundler written in node.js to bundle (ES6) JavaScript modules, stylesheets, images, and other assets for consumption in browsers.
Webpacker is a wrapper around webpack that handles integration with Rails.
This is a short introduction.
Installation
If you haven't already, you need to install node.js and Yarn.
Then, put
```ruby
gem 'webpacker', '~> 4.x' # check if 4.x is still cu…
Installing Ruby 2.3 or below on Ubuntu 17 and above
From Ubuntu 17, rbenv fails to install Ruby below 2.4 because of a mismatching OpenSSL dependency: it needs libssl1.0-dev for the installation process, but recent Ubuntus come with libssl-dev.
From the linked StackOverflow comment:
As far as I know (and tested), Ruby versions < 2.4 requires libssl1.0, while >2.4 libssl1.1+. The two libssl packages conflict with each other, so you can't have both of them, so I had to juggle the libs in order to install the required ruby version. To make things even funnier (or more complicated),…
How to inspect the HTML of an email in Thunderbird
Inspecting the source of an email does not always reveal the plain HTML source, but some encoded byte mess. In order to inspect the HTML anyways, you can use a little trick:
While composing a message, select all (Ctrl + A), then navigate to Insert > HTML on the message window.
If you need to inspect a received message, hit "Reply" to turn it into composition mode.
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:
page.evaluate_script("$('input').focus()")
page.execute_script("$('input').focus()")
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…
Using pure Sass functions to make reusable logic more useful - Advanced
Functions and mixins are very similar in nature. Because they can both accept variables, you might end up creating a mixin when what you really need is a function.
Browsers will not send a referrer when linking from HTTPS to HTTP
- When your site is on HTTPS and you are linking or redirecting to a HTTP site, the browser will not send a referrer.
- This means the target site will see your traffic as "direct traffic", i.e. they cannot distinguish such hits from a user who directly typed in the URL.
Reasons for this behavior
It's probably because of this RFC:
Clients SHOULD NOT include a Referer header field in a (non-secure) HTTP request if the referring page was transferr…