Handle hardware back button click

Question

I can not figure out how to make my winjs(react-winjs) app to work with a hardware back button. This is a example of my navigation function:

handleNavigation(location) {
    this.setState({
        location: location
    });

    WinJS.Navigation.navigate(`/${location}`);
    console.log(WinJS.Navigation.history);
}

console.log(WinJS.Navigation.history) outputs correct array called "backStack" with correct history order, but clicking hardware back button on windows phone emulator just simply quits the app.

Am I missing something obvious?

This is what I managed to find and tried but with no success (I did find some good docs for C# as well, but what's not what I need):

link 1

link 2

Thanks

Answer 1

Indeed this was a very silly mistake, I initialized my app without waiting for winjs/windows to be ready, this is how I should have initilized it:

(function () {
"use strict";

var app = WinJS.Application;
var activation = Windows.ApplicationModel.Activation;

app.onactivated = function (args) {
    if (args.detail.kind === activation.ActivationKind.launch) {
        if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
            // This is how you should initialize your app
            ReactDOM.render(<App />, document.getElementById('app'));
        } else {
            // TODO: This application was suspended and then terminated.
            // To create a smooth user experience, restore application state here so that it looks like the app never stopped running.
        }
        args.setPromise(WinJS.UI.processAll());
    }
};

app.oncheckpoint = function (args) {
    // TODO: This application is about to be suspended. Save any state that needs to persist across suspensions here.
    // You might use the WinJS.Application.sessionState object, which is automatically saved and restored across suspension.
    // If you need to complete an asynchronous operation before your application is suspended, call args.setPromise().
};

app.start();
})();

this way I can addEventListener to "backclick" in my components componentWillMount function and it works:

componentWillMount() {
    WinJS.Application.addEventListener("backclick", function () {
        document.body.style.background = "red"; //or for example setState/show notification etc...
    });
}