Troubleshooting Windows Runtime errors (Windows Store apps using JavaScript and HTML)

When you are using Windows Runtime asynchronous methods in JavaScript, you may need to debug errors thrown by an asynchronous method. In some cases you may not even be aware that an asynchronous method has been called, because it occurred somewhere deep in the call stack.

When you are running the app in debug mode, and a Windows Runtime asynchronous method throws an error, the JavaScript Error object contains two special properties: Error.asyncOpType and Error.asyncOpSource. You can use them to determine the name of the asynchronous method and the location in your code that originated the asynchronous operation.

The following code provokes an error "The system cannot find the file specified" inside the event handler for a click event.

<div id="divId" >
    <button id="clicker">Click Me</button>
</div>
<script type="text/javascript">
    var clicker = document.getElementById("clicker");
    clicker.style.backgroundColor = "red";
    clicker.addEventListener("click", clickHandler);

    var clickDiv = document.getElementById("divId");

    function clickHandler(ev) {
        Windows.Storage.ApplicationData.current.localFolder.getItemAsync("notAFile").then(
            function (complete) {
                clickDiv.innerText = complete.name;
            },
            function (error) {
                clickDiv.innerText =  
                error.asyncOpSource.stack + " called " + error.asyncOpType;
        });
    }
</script>
        

When you run this code, the resulting DIV text should be "at clickHandler (ms-appx://<GUID>/default.html:<lineNumber>:<columnNumber>) called Windows.Foundation.IAsyncOperation`1<Windows.Storage.IStorageItem>" .

For more information about the special Error properties, see Special Error Properties from Asynchronous Windows Runtime Methods

Build date: 11/29/2012