Houen's Blog

Thoughts on life, startups, tech & code

Turn off javascript in Google Chrome DevTools (1 min read)

When testing and debugging, I often need to see how a web page looks like and behaves with Javascript / JS turned off. Luckily it is easy to turn off javascript in Google Chrome DevTools.

Step 1: Open Google Chrome DevTools

Either right click any element and choose “Inspect”, or use a keyboard shortcut (Mac/OSX: Cmd + Option + J, Windows: Ctrl + Alt + J)

You will see something like this bar:

Open Chrome DevTools

Step 2: Open the Run command box

Use keyboard shortcut:

Mac / OSX: Cmd + Shift + P

Windows: Ctrl + Shift + P

You should now see this:

Open Chrome run command box

Step 3: Turn off Javascript

Start typing “Javascript” in the run cmd box. After a bit of the word, you will see the option “Disable Javascript” to turn it off, or “Enable Javascript” to turn it back on. Select it with the keyboard or mouse, and you are done. Javascript is now turned off in Google Chrome

Turn off Javascript with Chrome Run command

Step 4: Turn Javascript back on

Complete steps 1-3 and choose “Enable Javascript” to revert to normal:

Turn Javascript back on

There. With this post, I will never forget how to turn off javascript in Chrome again.

If you liked this post, also check out more Chrome keyboard shortcuts or more on the Run Command menu. Who likes doing extra work after all?

Capybara finding and Selecting hidden elements and text

Finding hidden elements

After upgrading an older version of the Capybara gem to something a bit more modern, you may come across a lot of errors regarding finding hidden elements and hidden text, like this:

Capybara::ElementNotFound: Unable to find visible css ...

The error above is because Capybara by default no longer “sees” hidden elements. Hidden elements can be many things. Most common are content hidden by CSS and content out of the current viewport (screen).

Tell Capybara to look for hidden elements as well

To fix it, you must add visible: false or visible: :all to your test code.




find('span', visible: false)

The same goes for other selectors such as all and first. Now Capybara will be able to find the element. However, calling .text may simply produce nil on the element.

Capybara still cannot see the text

There is a particularly annoying addition to the above: In order for Capybara to find and select the hidden text of the hidden elements, you can no longer simply do .text. You have to instead do .text(:all), as described in the Capybara docs here.

Finding and selecting hidden text

So now our final Capybara text selector becomes:

sometext = find('span', visible: false).text(:all)

That is all that is required. As a final comment, please note that you can also have Capybara work like it used to and “see” hidden elements and hidden text by default:


I generally tend to avoid this option, though, since it is not recommended by the author / contributors. This argument may sound silly, but since it is not recommended, they are going to be coding in a different direction in the future. This might lead to difficulty down the line. Better to just get it done with now.

And it can be done.

I have upgrade several Ruby / Rails projects where the LOC (lines of code) of the app/ folder was 35000+ and while fixing capybaras use of hidden text is tedious work, it can generally be completed within a working day or two.

Happy coding!

Finding and selecting hidden elements and text with Capybara

Your startup needs a polaroid wall


The Polaroid wall at Crealytics in Berlin

Note: This is a follow-up to a post I did on How Silos are hurting your startup. Have you read it already? We will both get more out of this post if you read the other one first. You will get the backstory. I can assume you know it. Win-Win. Go on. We will wait for you.

Hi again. I hope I have made the case for why silos are hurting your startup. Here is a little trick to help break down silos.

Here is a recap of my postulation from earlier:

The best thing we can do against silos is let camaraderie and friendship develop between employees of different departments.

How do friendships develop? Initially, by chit-chatting to each other. By taking an interest. By bonding through the art of conversation. More than one. Repeated display of interest between amicable individuals is the surest sign to a budding friendship.

There is a very important part to a conversation of people getting to know each other. Their names.

Dale Carnegie said it well:

A person’s name is to that person the sweetest and most important sound in any language

This is true. And so is the opposite. There is nothing more hindering for friendship than if one person does not know the other persons name.

Some people are very good at this. Were they born with this ability? Did they learn it somehow? I do not know.

Let us go a year back in time. I had a bit of a problem with names then. Introduce me to someone. Then wait a day. I can now tell you all sorts of interesting facts and wonderful sides to that person. Their name, however…
Wait, it is right on my tongue…

I noticed this being a hindrance several times. There were people I was genuinely interested in talking to. But I could not. They had told me their name. I had told them mine. They likely could remember mine. If I struck up a conversation, it would get awkward. So I did not.

Then I remembered something from when I was working in the Rainmaking Copenhagen office:

The polaroid wall.

When a new employee joins, a polaroid is taken of them. They write their name on it. Possibly also a little doodle. It is fun. It is old-school. It looks great in the office. It helps with a feeling of “one big family”.

And when someone forgets the name of another employee, all they have to do is take a cup of coffee. Study the wall. Learn the name. Then go make new friends.

This is why your startup needs a polaroid wall.

Thank you for your time.


PS: I highly recommend the Fujifilm Instax Mini 8 instant camera. I have one myself, and it is just the right size for a company wall.

PPS: A common objection I hear at this point is this: “But we already have names and pictures on our website”. Yes. You do. And what does it take to update that website? Let us compare:

  • The Website way
    • Find a digital camera. Who had it last? What event was it used at? Ok, here it is.
    • Now take the picture.
    • Now upload it to a computer.
    • Now crop it.
    • It does not look good enough. This is a public branding page. We must look good to the public.
    • Take a new one.
    • Now upload it to the website. Oh, you need IT to do that? They are too busy developing features. File a ticket for updating the employee page.
    • Wait two weeks.
    • Now it is updated.

      I know, I know, maybe all of the above hassle does not apply to your company. Then you are one of the lucky few. Trust me on this.

      At Crealytics, the process would be much simpler. A polaroid wall is still superior.

  • Polariod way:
    • Take picture
    • Write name
    • Done!


Get a polaroid wall. Your silos will be a little less powerful for it.

Silos will hurt your startup. Friendships will make you strong

Update: Part 2 is now up. Read this one first, though. There is a link in the bottom as well.

Are you just five people to your startup? I envy you.

I envy the shared direction you feel with your colleagues. How you feel at one with the vision. You are one entity fighting for a common goal. You can rely on your teammates. They can rely on you. This is a wonderful feeling.

Now your startup gains both traction and success. Champagne all around!
It is time to start hiring so you can keep up with x, y and z.

Your company grows. You get the need for specialisation. You develop teams, departments. Areas of responsibility take on a power of their own.

There is a side effect to this. Silos happen.


Silos are when teams distance themselves from each other. Let us enter the mind of a person in a silo. It is now most important how something affects your team.

Your work. Your stress. Your relationship with management. Your little silo.

How things affect your silo become more important than how they affect the company. Others will take care of that. This is in essence an instance of the Bystander Effect.

In a silo, employees will gradually care less and less about the company as a whole. An employee in a silo will not feel a strong relationship to the company. They do not work in the company. They work in the silo. The company is what causes problems. What hurts their silo.

The end result: The company is hurt greatly by these silos.

It is vital that they be kept in check.

Keeping silos in check

A way to keep silos in check is very simple:

Communication. Talking. Caring.

Silos occur naturally. Banding in groups is part of human nature. Luckily, so is caring.

What we need to introduce is compassion for the other silos. You just got an amazing friend in another team. You had the best talks over those Friday beers. Suddenly, you care a lot about her workload. His stress. Her work-life balance.

You need your engineers to buddy with sales, sales to buddy with HR, HR to buddy with Operations. And so on and so on.

Basically, you need friendships to evolve across departments.


Now go forth, and do all in your power to help your employees make friends with each other.


For great insight into how to make your company GREAT, I highly recommend the book From Good To Great by Jim C. Collins


PS: I had more to say about silos than I first thought. So this blog post came to life. It will be followed up by one about Why your large-ish startup absolutely needs a polaroid wall.

The three most important words in a User Story

A Product Owner (PO) / Product Manager  (PM) comes to my development team. She or he tells us: We have a business request. We have identified the next important business need. We know who it is for. We know what they need. We would like a good technical solution to it. This is perfect.

Here is the general structure of this:

As a [user role] (Who)
In order to [satisfy need] (Why)
I would like to [desired behaviour] (What)

It is short. It is concise. It contains a clear Who. A clear Why. A clear What.

The Who, Why, What

The Who, Why and What is the core of any user story. And it is routinely overlooked by Product Owners in tech startups.

  • Who are we building this for. Who are we trying to make happy with this
  • Why are we building it. Why is Who unhappy without this change
  • What are we building. What can we do to solve the Why?

We must know for Who we are doing something. How else can we make the best decisions for them?

We must focus on Why we are doing something. How else will we know if it worked?

Lastly, we use these two as reasons for the What we are building.

There is a saying in Software Development: The only constant is change. Everybody knows this saying. Everybody is tired of it. It is still true.

Change is the reason the Who and Why are just as important as the What. Often they are more important. Who and Why is the only way to judge the What. The What may be fitting right now. It will be ever more obsolete in the future. The Who and Why give us focus for the next What.

Let us finish an example of what the above might look like in real life:

As a new user

In order to learn how to set up my first project

I would like to be shown an on-boarding message when I first log in

There. The foundation is set. Now we can continue to flesh out the Who / Why / What as much as we want.

The day you became less stressed at work

I have found a work system that helps me relax. It helps me focus my brain on energising and fun things. My brain has no worry about remembering tasks. It is free to focus on fun and creative thoughts.

Passively I have been simplifying and evolving the system all my work life. I will try to tell you about the system as I use it today. This way you can hopefully jump right into being less stressed and more productive, starting tomorrow.

Note: I will spend some time here trying to convince you why you should have a system. If you are already convinced, scroll to “The System” below.

Why a system?

  • Your brain has a finite amount of computing power.
  • Everything you need to remember uses up this power.
  • The more power you can use on interesting tasks, the more real progress you can make.
  • Things can get complicated at work. The first thing to go the way of the mammoth is your overview. This is when you need a good, simple system.

If you are anything like me:

  • Remembering everything that comes in at work is tasking. (Most for managers, but also as a developer)
  • You spend too much energy actively remembering things you must not forget.
  • You stress about important things you have to remember to do.

Even if you are not like me, this is true for everyone:

  • Things often come up that must be handled later, but you are in the middle of something else.
    Coding maybe? Maybe you are in “the zone”.
    Maybe it is imperative that you do not switch focus constantly.

A good work system can help with all of the above. In my system, it takes me 5 seconds to be sure I do not forget a task. No matter how important a task is.

This way, even if a task is very important, I can continue whatever I was doing without wasting time switching tasks.

But we use Jira / Trello / Taiga / Kanban / Scrum already?

Awesome! But those are team systems. You need a system that is private only to you, where:

  • You do not need to care what your boss / coworkers / HR thinks about what you write.
  • You are limited to only the important things.
  • You are not distracted by other peoples tasks or ideas.
  • You can put a task in so fast there is no reason not to. This goal is key.

Many people use no system

I see many developers working in tech startups not using any system for managing their personal work. This can work very well, but I believe with a good system they could be doing even better. I have been using mine for the last decade. It has served me very well. I am writing this post to suggest you to give it a try.

The system has proven versatile

My system has evolved through my different roles. While evolving, it has also stayed much the same. It has served me well as junior developer, senior developer, team lead, CTO and freelance contractor.

The system is deceptively simple

Prepare to be underwhelmed. My system is insanely simple. That does not mean it is not valuable.

The system

Here it is. It is just a piece of paper. The power lies in the checkboxes.


The checkboxes

I currently use four kinds.

The empty checkbox

This is a task I should remember to take care of today. Taking care of a task means one of four things:

A started task: “The Dot”

This is a task I have started. I am actively working on this task today.

A deferred task: “The Arrow”.

This is a task I needed to defer until tomorrow. Either it took too long, or better things to do came up.

A completed task: “The Check Mark”.

This is the most satisfying. The task has been completed, and I have moved on to other things.

A dropped task: “The X”.

The task was for some reason either not doable, or not needed. I currently do not plan to  revisit this task.

How I use my system

The weekly routine

I keep all my today lists in a bundle with a paperclip. This way I can always easily see what I did this week, and compare with what I need to do today.

Daily Standup

If you are not a software developer and/or have not heard of daily standups: It is a system where a team meets every day. Most commonly it consists of the following:

  • What did I do yesterday?
  • What will I do today?
  • Am I currently blocked by anything?
  • Do I need help from other team members?

Between when I come in to work and we have our daily standup, I fill in my tasks for the day. At standup I use the task list from the last day as a reminder of what I did and how it went. If anything comes up during standup that I need to take care of, I add it to my list immediately. 5 seconds, remember?

The daily cycle

  • I start by reviewing last days paper. Things to defer to today, I copy to todays paper, and mark with the Arrow. Otherwise they get the X. Or the Check Mark if it is completed.
  • Now pick a task based on the fun / benefit of doing. Mark it with The Dot. Work on it.
  • Switch to something else. Mark that. Work on it. Come back to the original task
  • End it. Mark it with The Check Mark, The Arrow, or The X.
  • Workday is over. Leave paper. Come back tomorrow.

A small side note; I use “next day” instead of “tomorrow”, since on Monday, I review the paper from Friday. Once the Friday paper has been reviewed, I archive or trash the notes from the previous week. Normally I archive them. They will help me if I need to remember something. As I am currently freelancing, they also help with my CV / Resumé.

The emotional boost

I get satisfaction from checking the boxes completed during the day. When it is done I can look at the check marks and think: “I did well today.” This emotional boost should not be underestimated.


There you have it. This is my system for keeping track of my daily tasks, and keeping my head clear. I know it can seem trivial. It is a small change, with a big impact. For me it has made a huge difference. I can focus on what I am doing without worrying about what I need to do next. I can more easily achieve “flow”.

Parsley bootstrap form validation in Rails 3

Hi there

Parsley bootstrap form validation in Rails 3

        // basic data-api overridable properties here..                                       
        inputs: 'input, textarea, select'                                                     
        , excluded: 'input[type=hidden]'                                                      
        , trigger: false                                                                      
        , focus: 'first'                                                                      
        , validationMinlength: 3                                                              
        , successClass: 'success'                                                             
        , errorClass: 'error'                                                                 
        , validators: {}                                                                      
        , messages: {}                                                                        

        //some quite advanced configuration here..                                            
        , validateIfUnchanged: false                                                          
        , errors: {                     // specify where parsley error-success classes are set
        classHandler: function (el) {                                                         
            return jQuery(el).closest('.control-group');                                      
        , container: function ( elem, isRadioOrCheckbox ) {}                                  
        , errorsWrapper: ''                                                      
        , errorElem: '

‘ } , listeners: { onFieldValidate: function ( elem, ParsleyField ) { return false; } , onFormSubmit: function ( isFormValid, event, ParsleyForm ) {} , onFieldError: function ( elem, constraints, ParsleyField ) {} , onFieldSuccess: function ( elem, constraints, ParsleyField ) {} } } );

Git large rebase made simple, easy and painless

Git clutter

The large Git rebase

At my work we use a simple and clean workflow, for getting our code into production. We use Pull Requests for our branches, and rebase them so our history is nice and tight. This works very well 95% of the time. Branches are sufficiently small, turnaround is fast, and we have no problems. But, sometimes we still end up with something less than ideal. Luckily there is a nifty way of doing this. (more…)

Ruby Map Array to Hash (Also Rails)

Ruby Map Array to Hash


Sometimes you need to map array value to a hash structure. It could be that you have a set of keys, and you want to map some values related to those keys to a hash in order to return it from a function. Or something else, what do I know. But I do know a nice, clean way to do it: (more…)

Get email about new posts

Get the latest posts delivered to your mailbox: