SignalR2 OnConnected not working as per documentat

Question

Below is the code I wrote for SignalR implementation based on ASP.Net documentation and I use manual proxy creation method. I Could see only negotiate happening and received a Connection id.

I can't see OnConnected method in my hub gets executed when I start connection. According to the note section in the document I have attached event handler before I call start method

SignalR Hub

public class MyTestHub: Hub
{
    private static Dictionary<int, List<string>> userConnections 
                                                     = new Dictionary<int, List<string>>();

    public override Task OnConnected()
    {
        RegisterUserConnectionInMap();
        return base.OnConnected();
    }
}

Startup.cs

     app.Map(
           "/signalr",
            map =>
            {
              var hubConfiguration = new HubConfiguration { EnableDetailedErrors = true};
              map.RunSignalR(hubConfiguration);
            });

Javascript Client Code

var connection = $.hubConnection();
var contosoChatHubProxy = connection.createHubProxy('MyTestHub');
contosoChatHubProxy.on('addContosoChatMessageToPage', function(userName:any, message:any) {
    console.log(userName + ' ' + message);
});
connection.start()
.done(function(){ console.log('Now connected, connection ID=' + connection.id); })
.fail(function(){ console.log('Could not connect'); });

Note section in documentation

Normally you register event handlers before calling the start method to establish the connection. If you want to register some event handlers after establishing the connection, you can do that, but you must register at least one of your event handler(s) before calling the start method. One reason for this is that there can be many Hubs in an application, but you wouldn't want to trigger the OnConnected event on every Hub if you are only going to use to one of them. When the connection is established, the presence of a client method on a Hub's proxy is what tells SignalR to trigger the OnConnected event. If you don't register any event handlers before calling the start method, you will be able to invoke methods on the Hub, but the Hub's OnConnected method won't be called and no client methods will be invoked from the server.

I could not figure out what I miss for past two days.

UPDATE:

Even I tried with auto generated proxy class by including <script src="~/SignalR/hubs" with the following client code. Still OnConnected Not fired

var contosoChatHubProxy = $.connection.myTestHub;
contosoChatHubProxy.client.addContosoChatMessageToPage = function (name, message) {
    console.log(userName + ' ' + message);
};
$.connection.hub.start()
    .done(function(){ console.log('Now connected, connection ID=' + $.connection.hub.id); })
    .fail(function(){ console.log('Could not Connect!'); });

Console Log after connectton

Answer 1

I have ended with the below solution. Hope it will help some one.

declare var $: any;

@Injectable()
export class CityChangeNotifier {

constructor(private appService: AppService, private router: Router) {
    this.connection = $.hubConnection();
    this.CityChangeHub = this.connection.createHubProxy('CityChangeNotificationHub');
    this.CityChangeHub
        .on('CityUpdatedByServer', (newLocation:any, connectionId:string) => this.onCityUpdatedByServer(newLocation, connectionId));
    this.connection.transportConnectTimeout = 10000;
    this.startConnection();  
 }

private startConnection(): void {
    let that = this;
    this.connection.start()
        .done((connection: any) => { that.connectionId = connection.id; })
        .fail(() => { });  
  }  
}