Working on the Linux command line: How to bash `cd` with autocorrect

Posted Over 2 years ago.

There is an option you can set so that when using the cd command, small typos are automatically corrected. Add...

Unobtrusive JavaScript helper to progressively enhance HTML

Posted Over 2 years ago by Henning Koch.

The attached compiler() function below applies JavaScript behavior to matching HTML elements as they enter the DOM. This works like...

Using attribute event handlers with a strict Content Security Policy (CSP)

Posted Over 2 years ago by Henning Koch.

Given you have a strict CSP that only allows elements from your own domain: Content-Security-Policy: script-src 'self' This will block JavaScript handlers inlined as attribute into your HTML elements. Clicking on the following link will only log an error with a strict CSP: click me click me Solution 1: Move the handler into your JavaScript The recommended solution is to move the handler from the HTML to the allowed JavaScript file that we loaded via . In the example above we could invent a new [data-alert] attribute with the alert message: click me Then our JavaScript intercepts clicks on elements with that attribute: document.addEventListener('click', function(event) { let link = event.target.closest('[data-alert]') if (link) { let message = link.dataset.alert alert(message) event.preventDefault() } }) Solution 2: Allow that one handler in your CSP Some browsers allow the CSP directive script-src-attr. This lets you allow the hashes of actual JavaScript code. The SHA256 hash of alert('hello') is vIsp2avtxDy0157AryO+jEJVpLdmka7PI7o7C4q5ABE= (in Base64). We can allow this one event handlers like this: Content-Security-Policy: script-src 'self'; script-src-attr 'unsafe-hashes' 'sha256-vIsp2avtxDy0157AryO+jEJVpLdmka7PI7o7C4q5ABE=' Note the sha256- prefix. This event handler now works when clicked: click me But any other script will still be blocked: click me Dealing with legacy browsers Currently (November 2023) about 75% of browsers support script-src-attr. Here is a forward-looking compromise that many users use with new CSP features: Have a liberal CSP with old directives supported by all browsers Make your CSP stricter with new, more specific directives for browsers that support it The CSP spec supports that approach in that using newer, more specific directives disable older, more general features. In our case this means: For old browsers, allow all inline scripts For new browsers, disallow inline scripts but allow inline handlers with given hashes Here is a CSP directive that works like this: Content-Security-Policy: script-src 'self' 'unsafe-inline'; script-src-elem 'self'; script-src-attr 'unsafe-hashes' 'sha256-vIsp2avtxDy0157AryO+jEJVpLdmka7PI7o7C4q5ABE=' Old browsers will only use script-src. New browsers will use script-src-elem (for tags) and script-src-attr (for inline event handlers), which override the more liberal rules from script-src. Solution 3: Don't use a strict CSP You can have a secure web application without a strict CSP. A Content Security Policy should never be your first line of defense against Cross-Site-Scripting (XSS). Your primary tool should be to escape and sanitize user input. Many template engines make it easy to do the right thing by escaping dynamic content by default. A CSP is a second security net. It's there when you slip up and somehow, somewhere don't sanitize user input. Depending on your project, you may decide to prioritize developer convenience over a strict CSP.

Spreewald development steps

Posted Over 2 years ago by Emanuel.

Our gem spreewald supports a few helpers for development. In case you notice errors in your Cucumber tests, you might...

Setting SASS variables as value for CSS custom properties

Posted Almost 3 years ago by Dominic Beger.

When using custom properties in your stylesheets, you may want to set a specific property value to an existing variable...

Headless Chrome: Changing the Accept-Language header is not possible

Posted Almost 3 years ago by Emanuel.

It seems like changing the HTTP_ACCEPT_LANGUAGE is not possible for a headless chrome. On Ubuntu the headless Chrome...

Modern HTTP Status codes for redirecting

Posted Almost 3 years ago.
en.wikipedia.org

Formerly 301 (Moved Permanently) and 302 (Found) were used for redirecting. Browsers did implement them in different ways, so since...

GitHub Actions: Retrying a failing step

Posted Almost 3 years ago by Henning Koch.

If you have a flaky command you can use the nick-invision/retry to re-try a failing command, optionally...

How to checkout submodules in Gitlab CI

Posted Almost 3 years ago by Emanuel.

Accessing other repositories in Gitlab CI is not straight forward, since the access rights of the current pipeline might not...

Upgrading Capybara with deprecated Integer selectors

Posted Almost 3 years ago by Emanuel.

Capybara added a deprecation warning in version 3.35.3 (version from 2019) that shows up if your selector is not of...

Geordi 6.0.0 released

Posted Almost 3 years ago by Dominik Schöler.

6.0.0 2021-06-02 Compatible changes geordi commit will continue even if one of the given projects is inaccessible. It...

Chromedriver: Disabling the w3c option might break your integration tests with Chrome 91

Posted Almost 3 years ago by Florian Leinsinger.

We recently noticed issues with Chrome 75+ when having the w3c option enabled within the Selenium webdriver. It looks like...

Accessing JavaScript objects from Capybara/Selenium

Posted Almost 3 years ago by Dominic Beger.

When testing JavaScript functionality in Selenium (E2E), you may need to access a class or function inside of a evaluate...

Heads up: Byebug has problems with zeitwerk

Posted Almost 3 years ago.

I encountered a unlucky behavior of byebug 11.1.3 (the most recent version at time of writing) when using it with...

RSpec: Ensuring a method is called on an object that will be created in the future

Posted Almost 3 years ago.
rspec.info

rspec >= 3.1 brings a method and_wrap_original. It seems a bit complicated at first, but there are use cases...

Ruby: Fixing strings with invalid encoding and converting to UTF-8

Posted Almost 3 years ago by Arne Hartherz.

When dealing with external data sources, you may have to deal with improperly encoded strings. While you should prefer deciding...

RubyMine: How to exclude single files

Posted Almost 3 years ago by Daniel Straßner.
jetbrains.com

In RubyMine folders can be excluded from search, navigation etc. by marking it as excluded. You might sometimes wish to...

Carrierwave: Using a nested directory structure for file system performance

Posted Almost 3 years ago by Arne Hartherz.

When storing files for lots of records in the server's file system, Carrierwave's default store_dir approach may...

Debugging your Webpack build time with Speed Measure Plugin

Posted About 3 years ago by Arne Hartherz.

If your Webpack build is slow, you can use the Speed Measure Plugin for Webpack to figure out where time...

When does Webpacker compile?

Posted About 3 years ago by Henning Koch.

Webpack builds can take a long time, so we only want to compile when needed. This card shows what will...

Limiting GitLab CI runner to specific branches or events

Posted About 3 years ago by Florian Leinsinger.
docs.gitlab.com

Use rules to include or exclude jobs in pipelines. Rules are evaluated in order until the first match. When a...

Clean code: Avoiding short versions in command options

Posted About 3 years ago by Emanuel.

This card is a general reminder to avoid the short version of a command option in shared code. It's...

How to generate and test a htpasswd password hash

Posted About 3 years ago by Daniel Straßner.

Generate a password htpasswd -Bn firstname.lastname This will ask you for a password and use bcrypt (-B, more secure) and...

How to push to Git without running CI on GitLab CI, GitHub Actions, or Travis CI

Posted About 3 years ago by Arne Hartherz.

If a project ist configured to spawn CI runners for tests or deployment when pushing to the Repo, a habit...