Life, Teams, and Software Engineering

Using Mixpanel with EmberJS

In trying to add Mixpanel analytics to a project, I discovered that this is not so straightforward in client side MVC frameworks like EmberJS (we’re using v1.2 as of this writing).  There is a nice writeup here but it’s out of date from a Mixpanel perspective, as they discontinued Streams a few months ago.  The solution I arrived at involves a global jQuery event handler on hashchange combined with a call inside my Ember application initialization. Gist follows.

Hopefully the Ember team comes up with a better way to do this sort of this, since the only other examples trigger before the actual document URL is updated.  See here for a bit of history.

Keeping Bootstrap 3 btn-group Buttons Selected

The Problem

For some reason the Bootstrap 3 btn-group class doesn’t keep buttons selected by default (at least in 3.0.2).  It’s strange that this behavior isn’t easily configurable since I don’t think my use case is uncommon, but oh well.  Here is a jsfiddle demonstrating the problem.

 

The Solution

Basically you need to use jQuery’s on function to attach a click listener to each button within a btn-group. In the even handler:

  1. apply the Bootstrap .active class
  2. remove the class from any of its siblings (assuming you want button selection to be mutually-exclusive).

Using MvcIntegrationTestFramework for ASP.NET MVC Functional Testing

Most other web frameworks, particularly modern MVC frameworks (e.g. Rails, TurboGears, etc.), have first class support for performing full stack functional testing sans browser.  These tests typically execute something like this:

  1. Drop functional testing database
  2. Populate functional testing database with seed data
  3. Start up web stack
  4. Execute tests that perform GET and POST calls to your site
  5. Check that something did or didn’t happen
  6. Tear down web stack
  7. Repeat

.NET however is severely lacking in this area, requiring developers to jump straight from unit testing to browser testing with poor support for anything in between.  Truthfully, “poor” support might be generous.

Thankfully, someone else has felt the pain and has worked to fill the gap.  You can find a very helpful framework for performing this type of testing in ASP.NET MVC applications on Github, MvcIntegrationTestFramework.  However, there are several things missing from this to make it as good a solution as it can be.  Specifically, I prefer that any “unit” tests I run in my solutions run against their own database.  This means updating the Web/App.config file, something MvcIntegrationTestFramework doesn’t support out of the box.  Thankfully I threw together this NUnit TestSetupFixture that performs steps 1-3 for me automagically (though step #3 is at the beginning of every Fixture).

Why Run Functional Tests?

Ever had all your unit tests and data tests pass only to discover that no pages will load because you forgot to update your dependency injection?  Well that’s one reason, but another is that while Selenium tests have their place they are notoriously slow and don’t always have access to the backend like your unit tests do.

Want to check that a user can’t access a page after you revoke a permission?  To do this in Selenium you have to login as an admin, navigate to the user’s permissions, remove it, log out, login as that new user, and then try to navigate to that page as that user.  And that’s only if you don’t care if they can access that page when they do have the permission.  To do this in tests running at the level of MvcIntegrationTestFramework you can just hit the database directly to give the user a permission, make the page request as the user to make sure they can access it, remove the permission, and then try to access it again.  It is much more straightforward, lends itself to data-driven automation, and your developers will be much more likely to build and run these kinds of tests.

Updating the Website’s Web.config File

Here is a Gist I put together that shows how I perform this process from my functional test assembly.  It’s ugly but it works.  The trick here is to modify the Web.config of the application under test while the harness is running, and then put it back to normal when it’s finished running (or something goes wrong).  Just don’t commit while the tests are still running or you’ll check in that change.  But I know you all wait for your tests to finish before committing.

HTML Agility Pack

Something I have found very helpful for digging into HTML responses in these tests is HTML Agility Pack (available on nuget).  It gives you the ability to verify page elements in a simple way.  Just don’t become too reliant on the HTML markup since your tests will become very fragile.  This is just a quick way to get in there and run some quick assertions against your pages.

Still Don’t Get It?

I’ve found these tests to be most useful for places where you want to test your full application stack but don’t want to resort to something like Selenium to accomplish it.  For situations like security/permissions testing this layer can be very powerful.  You can hit every controller action directly all while having direct access to the database to tweak the little bits that make it all work.

Enhanced by Zemanta

Mission Tracking for Agile Projects

Despite agile methods doing a great deal to bring technology teams closer to the consumers and businesses they’re supporting, I’ve found that it is easy to develop a disconnect between a Business person’s view of progress and an agile team’s view of progress.

Given the question “are we on track?” delivery teams tend to answer this on a shorter time horizon then the business tends to care about.  It’s obvious that you’ll be getting two weeks worth of work in two weeks, but what does that move us towards overall?  Will I be able to move to a new market?  Will I attract new customers?  Establish new partnerships?  That thought led me to pose this question.

We would be far better off answering these questions from the perspective of the business owner, which I think is better phrased like this.

Based on our stated business goals (hopefully outlined in a roadmap) how far are we (in terms of man days, story points, etc.) from each stage today?

Even saying something like “we believe we have 6 sprints left before reaching that milestone” could be an unhelpful answer.  It all depends on what that stakeholder is looking for in terms of visibility.  You should be prepared to answer questions like these at a moment’s notice:

  • Will we be able to make our current milestone given our current progress?  If not, what can be done?
  • Will we need more personnel given the scope of the next major milestone?  If so, how many?  When should they be brought on?
  • Are the dates for our next milestone realistic?  If not, what can be done?
Answer questions like these and you’ve gone a long way towards closing the gap between the Executive’s view of progress and the team’s view of progress.
Are there any other big questions you have found to be really impactful in helping to sync the Executive and delivery teams?  How does your team deal with this issue now?
Enhanced by Zemanta

Selenium Server and Internet Explorer

Our team has started on a fairly large greenfield project for one of our clients, so we have the opportunity to decide what is good enough before getting too far along.  We chose Selenium as our browser testing automation framework because it is widely used and has a large support community.  That it’s free also doesn’t hurt, but sometimes that fact doesn’t help either.

We chose to use Selenium Server over WebDriver because it allows our tester, who has very little development background, to develop his tests using Selenium IDE, save the tests as Selenese HTML, and move on.  We started off exporting the test cases to C# and dealing with it that way, but it has some big issues that caused us to move away from it.  In no particular order:

  • the extra step was easy to forget
  • it was difficult to know if you were running the most up to date version of the test
  • there was no incentive to keep the original Selenese files around
  • the conversion was one-way
  • any helpers that we wrote in C# couldn’t be linked up during the export process
  • Most Importantly: there was no way to run the conversion process outside of the Selenium IDE
Add these all up and it’s just not worth the trouble.  So we’ve been running raw Selenese test cases with some custom user extensions against Selenium Server for the past month or so.  Here is a dump of what we’ve discovered regarding the current version of Selenium Standalone (2.28) and Internet Explorer 9.

Focus Is King

Selenium exhibits some strange quirks when executed inside Internet Explorer, most of which have to do with the execution of Javascript events on page elements.  The two I’ve encountered so far are ‘the annoying key press bug’ and ‘the annoying button click bug’.

The Annoying Key Press Bug

We all know Google’s auto-complete search box.  Here is a simple example that illustrates the problem by typing something into Google’s search textbox:

simpletest
open /
type q hello world
waitForElementPresent rcnt
verifyTextPresent Lady Antebellum
When run against Chrome or Firefox this test will work just fine, but run it against Internet Explorer (9 at least) and you’ll get a timeout:
simpletest
open /
type q hello world
waitForElementPresent rcnt Timed out
after
30000ms
verifyTextPresent Lady Antebellum false
Maddeningly no combination of keyDown, keyUp, keyPressed, typeKeys, sendKeys, etcetera, would make it work.

The Annoying Button Click Bug

Expanding on our last example, what happens if we click the “Google Search” button after typing into the search box?  Surely that will get us something, right?
simpletest
open /
type q hello world
click name=btnK
waitForElementPresent rcnt
verifyTextPresent Lady Antebellum
Wrong.
simpletest
open /
type q hello world
click name=btnK
waitForElementPresent rcnt Timed out
after
30000ms
verifyTextPresent Lady Antebellum false

So What Is Going On?

After fighting with this and discovering several workarounds I’ve come to the conclusion that the problem is Internet Explorer being overly paranoid.  Basically, Internet Explorer refuses to fire Javascript events on elements that do not currently have focus.  I don’t know if this is a security feature to protect against XSS or something else entirely, but there it is.  Going back to the first test case, let’s give the text box focus before we type into it:

simpletest
open /
focus q
type q hello world
waitForElementPresent rcnt
verifyTextPresent Lady Antebellum
Now the test succeeds against Internet Explorer!  Note that performing a click on a text box does not appear to be sufficient to give it focus, so you actually need to call the focus command.
simpletest
open /
focus q
type q hello world
waitForElementPresent rcnt
verifyTextPresent Lady Antebellum

And what about the click test?

simpletest
open /
type q hello world
focus name=btnK
click name=btnK
waitForElementPresent rcnt
verifyTextPresent Lady Antebellum

Not quite.

simpletest
open /
type q hello world
focus name=btnK
click name=btnK
waitForElementPresent rcnt Timed out
after
30000ms
verifyTextPresent Lady Antebellum false

So why not?  Turns out that I removed focus from the Internet Explorer window while the test was running. So if we do this:

simpletest
open /
type q hello world
windowFocus
focus name=btnK
click name=btnK
waitForElementPresent rcnt
verifyTextPresent Lady Antebellum

Victory!

simpletest
open /
type q hello world
windowFocus
focus name=btnK
click name=btnK
waitForElementPresent rcnt
verifyTextPresent Lady Antebellum

So how can we solve this without requiring 3 calls for each click/type we want to do in our system?  I added a user extension that deals with both the click and typing focus problems.
Any place you encounter this issue in Internet Explorer just replace type with compatibleType and click with compatibleClick and it should be good to go.  Now that I look at this again, I could probably completely override the built-in type and click functions in Selenium so no changes to the test scripts are necessary.  I’ll update the Gist and this post if I go that route.

Enhanced by Zemanta
« Older posts

Copyright © 2014 Life, Teams, and Software Engineering

Theme by Anders NorenUp ↑