improve doc and add test for page view tracking

README.md

@@ -33,14 +33,24 @@ for more details on how to obtain the instrumentation key.
 
 #### Track router changes
 
-To track page views, pass a history object to the init method.
+To track page views, pass a history object to the init method.  
+For more information see the [documentation][react-router] of the `react-router` package.
+
 
 ```javascript
 import ReactAI from 'react-appinsights';
-import createHistory from 'history/createBrowserHistory'
+import { Router } from 'react-router-dom';
+import { createBrowserHistory } from 'history';
 
-const history = createHistory()
+const history = createBrowserHistory()
 ReactAI.init({instrumentationKey:'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxxx'}, history);
+
+ReactDOM.render(
+  <Router history={history}>
+    <App />
+  </Router>,
+  document.getElementById("root")
+);
 ```
 
 #### Enable React components usage tracking
@@ -105,3 +115,4 @@ Refer to [this doc][appinsights-js-api] for information on the Javascript API of
  [appinsights-js]: https://docs.microsoft.com/en-us/azure/application-insights/app-insights-javascript
  [appinsights-nodejs]: https://azure.microsoft.com/en-us/documentation/articles/app-insights-nodejs/
  [appinsights-js-api]: https://github.com/Microsoft/ApplicationInsights-JS/blob/master/API-reference.md
+ [react-router]: https://github.com/ReactTraining/react-router/blob/master/FAQ.md#how-do-i-access-the-history-object-outside-of-components

src/ReactAI.js

@@ -12,7 +12,7 @@ export const ReactAI = {
     AppInsightsUsage.init(appInsightsOptions);
 
     if (history) {
-      history.listen(_ => {
+      history.listen((_location, _action) => {
         AppInsights.trackPageView();
       });
     }

test/ReactAI.test.js

@@ -7,6 +7,8 @@ import { mount } from 'enzyme';
 
 import { AppInsights } from 'applicationinsights-js';
 
+import createHistory from 'history/createBrowserHistory'
+
 const INNER_TEXT = Math.random()
   .toString(36)
   .substring(7);
@@ -25,6 +27,7 @@ describe('Tracked component', () => {
     jest.mock('applicationinsights-js');
     appInsights.downloadAndSetup = jest.fn();
     appInsights.trackMetric = jest.fn();
+    appInsights.trackPageView = jest.fn();
   });
 
   it('renders correctly', () => {
@@ -56,4 +59,13 @@ describe('Tracked component', () => {
     expect(AppInsights.trackMetric.mock.calls[0][4]).toBeNull();
     expect(JSON.stringify(AppInsights.trackMetric.mock.calls[0][5])).toEqual('{"Component Name":"TestComponent"}');
   });
+
+  it('tracks page views', () => {
+    const history = createHistory()
+    ReactAI.init(INIT_SETTINGS, history);
+
+    history.push("/home", { some: "state" });
+    history.push("/new-fancy-page");
+    expect(AppInsights.trackPageView.mock.calls.length).toEqual(2);
+  })
 });