Losing query parameter when traversing up states in ui router.

var app = angular.module('plunker', ['ui.router']);

app.config(function($stateProvider, $urlRouterProvider){
  
  $urlRouterProvider.otherwise('/top');
  
  $stateProvider
    .state('top', {
      url: '/top?myParam',
      reloadOnSearch: false,
      template: '<h1>Top</h1><ui-view></ui-view>'
    }).state('top.firstLevel', {
      url: '/first',
      reloadOnSearch: false,
      template: '<h1>First</h1><ui-view></ui-view>'
    }).state('top.firstLevel.secondLevel', {
      url: '/second',
      reloadOnSearch: false,
      template: '<h1>Second</h1><ui-view></ui-view>'
    });
  
});

app.run(function($rootScope){
  
  $rootScope.$on('$stateChangeSuccess',function(event, toState, toParams, fromState, fromParams){
      $rootScope.toParams = toParams;
      $rootScope.timestamp = new Date();
  });
  
});

app.controller('MainCtrl', function($scope, $state) {
  
  $scope.$watch(function(){
    return $state.params;
  }, function(newParams){
    
    $scope.stateParams = newParams;
    
  });
  
  $scope.$watch(function(){
    return $state.current;
  }, function(currentState){
    
    $scope.currentState = currentState;
    
  });
  
  $scope.goTop = function(){
    $state.go('top');
  };
  
  $scope.goFirst = function(){
    $state.go('top.firstLevel');
  };
  
  $scope.goSecond = function(){
    $state.go('top.firstLevel.secondLevel');
  };
  
  $scope.setQueryParam = function(){
    $state.go($state.current.name, {
      myParam: 'woo'
    });
  };
  
});

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.4.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.js" data-semver="1.4.7"></script>
    <script data-require="ui-router@*" data-semver="0.2.15" src="//rawgit.com/angular-ui/ui-router/0.2.15/release/angular-ui-router.js"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    
    <ul>
      <li>
        <button ng-click="setQueryParam()">Set Query Param</button>
      </li>
      <li>
        <button ng-click="goTop()">Go Top</button>
      </li>
      <li>
        <button ng-click="goFirst()">Go First</button>
      </li>
      <li>
        <button ng-click="goSecond()">Go Second</button>
      </li>
    </ul>
    
    <p>Current State {{currentState | json}}</p>
    <p>$state.params watcher {{stateParams | json}}</p>
    
    <p>State Change Time Stamp {{timestamp}}</p>
    <p>State Change To Params {{toParams | json}}</p>
    
    <div ui-view></div>
    
  </body>

</html>

/* Put your css in here */