Boyleing Point
Psychotic ramblings about technology
Post Archive
2020
2018
2017
2016
09
Functional Form Validation in JavaScript (aka: Inheriting bad JavaScript)
Posted by Luke Boyle on the
I was recently given the job of rebuilding a particularly bad landing page from an external company. Apart from class names, styles and markup being all over the place, there was a particularly obnoxious form validation script sitting in the middle of the page. An excerpt of the script can be seen below, and this documents the process I took when reviving the JS side of things.
Automating CSS regression testing with Argus Eyes (PhantomJS)
Posted by Luke Boyle on the
I have had my eyes on Argus Eyes (http://arguseyes.io/) for quite some time and now I have the time to implement it at work. The interface is rather simple. You define your browser breakpoints, the pages, and the parts of the pages you wish to capture. All components
are defined with a name and a selector. For example, ".site-nav" or "body". You define all components in the components array, but then you can cherry pick which ones are used on each page. Such as, homepage may use the hero component, but about may not.
Running Karma tests for Chrome in Travis CI
Posted by Luke Boyle on the
A quick-start guide for running Karma tests for Chrome in Travis CI. When you run Travis on a Node.js project, Travis will - by default - run npm install
and then npm test
. I first ran into the issue in an Angular project that had tests triggered in the prepublish
command. My CI build failed and I decided to remove the prepublish hook and change the name of my test script until I had the time to come back. For months I've been avoiding the issue, but I have finally solved it. The Karma docs suggest that you can run the tests in Firefox with the --browsers flag (see https://karma-runner.github.io/0.8/plus/Travis-CI.html). Travis has since updated so that Chrome can be loaded into the environment. For this to work, you'll need to make changes to your travis.yml
file and your karma config file.
Local Storage Manager version 2.1 is out now
Posted by Luke Boyle on the
The latest version of local-storage-manager has had the internal interface greatly improved for tidiness and best practice, and now has the new Namespace feature. Traditionally, you would have to store your data like so:
React Material-UI touch events not firing
Posted by Luke Boyle on the
After much frustration with this issue, I found this section in the react material-ui documentation - React-Tap-Event-Plugin. The custom components like the select field don't work well with the traditional onClick listener, so as a temporary fix, the react-tap-event-plugin must be included in your react project. The dependency is supposedly a temporary fix. See the repo here: https://github.com/zilverline/react-tap-event-plugin