Simple Chatter

Last night’s Geeks Group was pretty awesome. It’s definitely a night I look forward to every month. The biggest problem is heading home and starting work the next day. Janson Hartliep and I chatted about this heading out.

Geeks Group has a similar high as good conferences. Heading out you have such visions of grandeur, and you feel so empowered to go forth and make the world “awesomer”. But then you realize your day job’s responsibilities and you feel overwhelmed. At the very least it is a great way for a developer to recharge their batteries.

I quickly realized from listening to Dean Whitaker, the President of Whittaker Associates, Brandon Keepers from Collective Idea, and Janson from Elevator Up, that literary speaking. I’m as dumb as a bag of bricks.

They kept talking about book titles and bloggers either in our field, or at least in the fringes of it that just kept me shaking my head with the continual “Who is that guy?”

Towards the end of the conversation, it became readily apparent that I need to read at least a fraction of what they have been going through. So then the topic a wiki came up.

Aaron had previously mentioned a few members have expressed an interest in a job board somewhere for other members, or newcomers to take a look at. While probably not the most elegant solution, it does suffice.

So last night I threw up a wiki on our servers, which totally addresses my selfish need to get a hold of good book / blog titles.

So head over to http://geeks.elevatorup.com/. If you’re already a member, fill out some of your info. If not, feel free to join us on the third tuesday of every month in Holland. You can also check out our new google group. At the very least, add a good title to our book / blog page. I need to git smarter-er.

I came across something in Rails that’s fixed an issue that has seriously irked me.

Given a form in Rails:

...
<p>
  <label for="user_name">Name</label>
  <%= f.text_field :name %>
</p>
...

if a validation error would occur, the generated code becomes:

  <p>
    <label for="user_name">Name</label>
    <div class="fieldWithErrors"><input id="user_name" name="user[name]" size="30" type="text" value="" /></div>
  </p>

Which is invalid markup. I’ve constantly resorted to editing rails source in order to change the divs to spans.

Today I came across something really neat: field_proc_error. By setting this in your configuration like environment.rb, you can drastically change the output of the generated error

  config.action_view.field_error_proc = Proc.new{ |html_tag, instance| "<span class=\"field_with_errors\">#{html_tag}</span>" }

Going through trac, I see it’s been in there forever, but as usual, I’m the last one to catch it.

Awesomely useful. Thanks Rails Core.

Ever since I started going down the route of mocking my views in order to test my controllers in isolation, I’ve had a nagging feeling about the lack of execution in the view. Not in terms of too much code that should boiled away into a helper method, the controller, or even the model itself. I felt that an integration test would at least be able to execute a “sunny day” scenario in order to ensure that all of the methods the view was calling on a model actually exists, it just didn’t feel enough.

Then I came across Zach Dennis’s post about testing views in isolation, which I found intriguing. After a discussion with Zach at the Grand Rapids User Ruby Group he showed me some examples of tests he has been doing at Atomic Object. Immediately I felt something was irking me in the manner of how heavily the tests depended on the presence of classes.

An example of such a test would be something like :

  ...
  def setup
    # information to setup the context of the view
  end

  def test_should_display_title
    assert_select "#scoreboard .points", /joe's points/
  end
  ...

From talking with Zach, he conveyed to me that his biggest win was being able to assert client’s requirements regarding the rendering of data.

The issue I couldn’t resolve was that the developer had to add classes to pre-existing semantic code. I should give some context here. I feel that translating a design concept from a design tool (Photoshop, GIMP, Fireworks, etc) into valid and semantic HTML, using CSS to achieve cross browser compatibility, as well as addressing concerns related to accessibility is no easy feat. It is definitely a skill-set I want to get better at, and by no means do I feel adequate now. I’ve used the term “front end developer” in order to describe that skill set. That being said I’ve worked with some very intelligent front end developers that consistently educate me on the importance of semantic and minimalistic code.

Therefore when I see a back-end developer adding classes to what I would consider good front end code, I become hesitant. Is the tester inadvertently dictating front end html based off of the necessity to assert client requirements?

I’ve been really upset that I haven’t been able to put my finger on why this issue doesn’t sit well with me. I knew at some level this felt like microformats, but they added context using classes, not semantic value. Then I realized that’s exactly what microformats do. Look at this example of an hCard

  <!-- Stolen from my bosses's blog at http://theparagon.org/contact/ -->

  <div class="vcard">
    <div class="fn">Aaron Schaap</div> 
    <a class="url org" href="http://www.elevatorup.com/">Elevator Up L.L.C.</a>
    <div class="adr">
      <div class="street-address">1106 Ardmore St.</div>
      <span class="locality">Holland</span>, 
      <span class="region">MI</span>
      <span class="postal-code">49423</span>
    </div>
    <div class="tel">
      <span class="type">Phone</span>: <span class="value">616-566-1423</span>
    </div>
  </div><!-- class="vcard" -->

The only semantic html element in that snipbit is the anchor pointing to our company’s homepage. It’s not the divs or spans that compose this snipbit into something a user agent can discern, but rather the classes applied.

So I finally realized what Zach was trying to do. His test was just another user agent consuming html for semantic value. The biggest hurdle apart from just mirroring the html structure (which is extremely brittle) is trying to pull out meaning from the markup.

At this point I’m much more comfortable adopting this technique in our own code at Elevator Up, with two reservations. First, the tester needs to work well with the front-end developer in order to ensure they aren’t forcing the markup for the sole purpose of testing. The tester is looking for semantic context not bookmarked identifiers. Second, the classes that are used should first look to microformats in order to help promote the proliferation of of the standard. Again the tests are just one user agent among many that can consume the markup. Given the example above I would much rather see “street-address” instead of “street_address”, “address”, “street” or “streetAddress”.