Debugging Firefox Failures on Travis // Collective Idea | Crafting web and mobile software based in Holland, MichiganSure enough, the test in question threw up a dialog, a dialog I had never seen before: “This web page is being redirected to a new location. Would you like to resend the form data you have typed to the new location?” A quick search of this text found a large number of support requests to Mozilla, such as https://support.mozilla.org/en-US/questions/792131 and https://support.mozilla.org/en-US/questions/969705. This dialog comes from Firefox’s Accessibility system, is default to on, and is easily disabled via profile settings. Changing the Firefox profile in Capybara is relatively easy:tagged: firefoxpopupstravis27-09-2017
GUI and Headless Browser Testing - Travis CIIf your test suite handles a modal dialog popup, for example, a redirect to another location, then you may need to add a custom profile so that the popup is suppressed. This can be fixed by applying a custom Firefox profile with the option turned off: (example is in Ruby using Capybara)tagged: seleniumfirefoxpopupsredirect27-09-2017
jakearchibald/navigation-transitionsThe problem If you want to transition between pages, your current option is to fetch the new page with JavaScript, update the URL with pushState, and animate between the two. Having to reimplement navigation for a simple transition is a bit much, often leading developers to use large frameworks where they could otherwise be avoided. This proposal provides a low-level way to create transitions while maintaining regular browser navigation.tagged: csstransitions26-09-2017
Creating a Static API from a Repository | CSS-TricksWhen I first started building websites, the proposition was quite basic: take content, which may or may not be stored in some form of database, and deliver it to people's browsers as HTML pages. Over the years, countless products used that simple model to offer all-in-one solutions for content management and delivery on the web.tagged: static25-09-2017
The State of the Web – Karolina Szczur – MediumThe Internet is growing exponentially, and so is the Web platform we create. Often though we fail to reflect on the greater picture of connectivity and contexts the audience of our work might find themselves in. Even a short glance at the state of the World Wide Web shows that we haven’t been building with empathy, situation variability awareness, let alone performance in mind.tagged: perfperformanceweb25-09-2017
Why its tricky to measure server side rendering performanceI started this post two weeks ago as a simple "How to use SSR to boost performance" article. After hours of profiling and consulting people smarter than me, I know one thing. Server-side Rendering is more nuanced than you would like.tagged: assertionsperfspaces25-09-2017
Groovy Ternary OperatorAnother one of the great operators that more and more languages support is their ternary operator. The ternary is a conditional operator and often referred to as an inline if statement. Before we look at how to use it lets take a look at a common problem it helps us solve. There are often times when you want to set a variable to one value if an expression evaluates to true and another if its false. In pseudo code it might look something like this.tagged: groovyternarycode21-09-2017
find the cost of adding a npm package to your bundlefind the cost of adding a npm package to your bundletagged: npmbundlesizes20-09-2017
Pure CSS3 Animated Gradient BackgroundPure CSS3 Animated Gradient Backgroundtagged: cssborder-gradientbackground18-09-2017
Betting on the WebNote: I just spoke at Coldfront 2017 about why I’m such a big proponent of the Web. What follows is essentially that talk as a blog post (I’ll add a link to the video once it is published).tagged: webpwasoffline15-09-2017
Basic grid layout with fallbacks using feature queriesI’ve been using CSS grid (which henceforth will be referred to as Grid) for quite a bit now, and although I often talk about how we can use grid to make all kinds of creative layouts, I’m fully aware that a basic grid is still a design pattern that is very much in demand on the web.tagged: gridcss15-09-2017
How To Create CSS Gradient Border Colors - HongkiatWith all the new features in CSS3, we are now able to build image-less websites. In the past, the use of image was inevitable when it comes to showing gradient colors. Today, it becomes much leaner with the use of CSS3 Gradient Background. In previous posts, we have shown you how to bring CSS3 Gradient into play as a background color in various forms and directions; Linear, Elliptical, and Repeating gradients.tagged: border-gradientcss07-09-2017
Material Conference - YouTubeMaterial Conference 2017 Playlisttagged: conferencesvideosmaterial-conferenceplaylist04-09-2017
Meeting Achievement Stickers – The Cooper Review – MediumCongratulations on getting through that meeting. Here are some meeting achievement stickers to celebrate your victory.tagged: meetings04-09-2017