Tearing Down Capybara Tests of AJAX Pages

An all-in-approach to fix the problem of pending AJAX requests dying in the browser when the server ends a test or switches scenarios.


We were able to work around this issue in most projects by doing this instead:

After '@javascript' do
  step 'I wait for the page to load'
end

How to hide your selenium browser window with "headless"

Note: While the solution in this card should still work, we prefer another solution now: Hide your Selenium browser window with a VNC server.


If you would like to hide the annoying selenium browser window that always gets the focus and prevents you from working, you can use the headless gem. This note provides some instructions how you can get it to work with your cucumber accepta...

CSS-Style

Richard Powell presents a collection of CSS styling advice that's mainly taken from SMACSS. Although at makandra we're using BEM instead of SMACSS, here's my favorites.

Do not use ID's in CSS Selectors

It is never safe to assume there will only ever be one of something on a page so do not use ID's for CSS. Id's are much better used as javascript hooks so use them for this instead.

.list {…} instead of #list {…}

Animate an interface using classes not inline styles

Inline styles added by javascript are h...

Detect the current jQuery version

You can say this in Javascript:

$.fn.jquery
=> "1.11.1"

Daring Fireball: New iPhone Developer Agreement Bans the Use of Adobe's Flash-to-iPhone Compiler

Applications must be originally written in Objective-C, C, C++, or JavaScript as executed by the iPhone OS WebKit engine, and only code written in C, C++, and Objective-C may compile and directly link against the Documented APIs (e.g., Applications that link to Documented APIs through an intermediary translation or compatibility layer or tool are prohibited).

PhoneGap Build

Write your app using HTML, CSS or JavaScript, upload it to the PhoneGap Build service and get back app-store ready apps for Apple iOS, Google Android, Windows Phone 7, Palm, Symbian, BlackBerry and more.

By compiling in the cloud with PhoneGap Build, you get all the benefits of cross-platform development but can still build apps just the way you like.

Font Awesome 5 migration guide

Font Awesome version 5 changed some icon names, and introduces new prefixes fab, far, and fas.

There is a JavaScript shim that you can use as a "quick fix". It allows you to keep v4 icon names on v5.

The linked page includes details on using that, and a migration guide including a list of icon renames.

ClockPicker: Android-style time picker for Bootstrap

ClockPicker is a JavaScript and Bootstrap implementation of an Android-style time picker which looks and feels great.

Unfortunately, it is no longer maintained.

ClockPicker.png

SmartUnderline

SmartUnderline is an open-source JavaScript library which uses clever tricks to draw underlines in a more beautiful and readable way.

We've not yet put this into a project, but its effect is very pretty. Please update this card when you use it.

Copy & Paste & The Web | CSS-Tricks

Insanely detailled guide about controlling copy & paste behavior using web technology in 2015.

Note that you can now trigger a copy action through Javascript, no Flash required.

yaronn/blessed-contrib

Build dashboards using ascii/ansi art and javascript

Awesome!

Magnific Popup: Responsive jQuery Lightbox Plugin

Responsive Lightbox JavaScript that just works.

You can use it for single images or a gallery. Animations are optional.

Databound

Databound provides Javascript a simple API to the Ruby on Rails CRUD.

Tries to expose a full model CRUD as an API. Not sure if this is useful for more refined requirements.

Chartkick

Create beautiful Javascript charts with one line of Ruby.

Promising chart library for easily rendering charts with Google Charts.

This seems to not submit your data points to Google.

RulersGuides.js demo

RulersGuides.js is a Javascript library which enables Photoshop-like rulers and guides interface on a web page

Also available as a bookmarklet.

Pure CSS Timeline | CSSDeck

Clever hack to allow user interaction without Javascript (by using radio buttons and selecting on :checked).

Opal, A new hope (for Ruby programmers)

Opal is a source to source ruby to javascript compiler, corelib and a runtime implementation that currently passes 3000 rubyspecs w/a reachable goal of passing them all.

occ/TraceKit · GitHub

Tracekit is a JavaScript library that automatically normalizes and exposes stack traces for unhandled exceptions across the 5 major browsers: IE, Firefox, Chrome, Safari, and Opera.

CSS3 Animated Loading Bar

Shows how to implement an animated progress bar in pure CSS, without animated GIFs, Javascript or Flash.

jsTimezoneDetect

Makes a robust determination of a user's timezone through Javascript.

Evening on Backbone.js/Views w/ Q&A with David Heinemeier Hansson - YouTube

Interesting interview with DHH, where he talks about how they made the new Basecamp feel very fast without using a lot of Javascript (most of Basecamp still lives on the server). The two tricks they used are PJAX and Russian Doll Caching.

jQuery Tag Cloud

TagCanvas is a Javascript class which will draw and animate a HTML5 canvas based tag cloud.

fnando/i18n-js

A small library to provide the Rails I18n translations in Javascript clients.

CodeMirror

CodeMirror is a JavaScript component that provides a code editor in the browser. When a mode is available for the language you are coding in, it will color your code, and optionally help with indentation.