Masonry is a famous library to dynamically arrange a grid of items that have different aspect ratio, like horizontal and...
If you come across an (older) application that is using Prototype instead of jQuery, you may often see events bound...
A print stylesheet is easy to create. Choose a font suited for paper, hide some elements, done. Unfortunately print stylesheets...
There seems to be a nasty bug in Chrome 56 when testing with Selenium and Capybara: Slashes are not written...
If you have content inside a page that is hidden by CSS, the following will work with Selenium, but not...
TLDR: A function is hard to use when it sometimes returns a promise and sometimes throws an exception. When writing...
Most browsers have built-in drag and drop support for different page elements like text and images. While this may...
select2 is a great jQuery library to make (large) fields more usable. For Bootstrap 3 there is select2-bootstrap-theme...
In your Cucumber features you can't really click hidden elements when using Selenium (it does work for a plain...
This trick might be useful to implement more complicated directives in AngularJS. I needed it to do drag'n'drop...
So you client has asked you to implement a row of buttons to like the URL on Facebook, Twitter and...
Selenium cannot reliably control a browser when its window is not in focus, or when you accidentally interact with the...
Here is a Javascript function reloadUsers() that fetches a HTML snippet from the server using AJAX and replaces the current...
tl;dr: Use event.currentTarget unless you are absolutely certain that you need event.target. Since it hasn't been written down...
Select2 comes with AJAX support built in, using jQuery's AJAX methods. ... For remote data sources only, Select2 does not...
gleeBox is an experimental project that takes a keyboard-centric approach to navigating the web. It provides alternatives to actions...
When building a form with a file select field, you may want to offer your users a live preview before...
The most common use case for Ruby's #collect is to call a method on each list element and collect...
Though the W3C even gives it as an example, no browser actually supports this CSS: img:before { content: "something"; }
This works well in the simplified case, when your link disappears after it was clicked. Let link_to_remote behave...
Rails ships with two separate build pipelines: Sprockets ("asset pipeline") and Webpacker. Webpacker has many more moving parts, but allows...
Generally, Selenium tests use the browser to interact with the page. If it's unavailable, a timeout error is...
You will find this useful when creating responsive designs that work well on small screens. The attached Javascript gives a...
The Javascript code below is a rough equivalent to the simple_format helper that ships with Rails: function simpleFormat(str...