Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
421 views
in Technique[技术] by (71.8m points)

javascript - Uncaught (in promise) Error

This is obviously a SSCCE. I have the following (jsFiddle here):

<html>
  <body>
    <input id='file-dlg' type='file'/>
    <br/>
    <button id='submit' type='button'>submit</button>
    <script>
     document.getElementById('file-dlg').addEventListener('change', storeAPromise);
     var p; 
     function storeAPromise() {
       p = new Promise(function executor(resolve, reject) {
         try {
           throw new Error('snafu');
         } catch(e) {
           reject(e);
         }
       });
     };
     document.getElementById('submit').onclick = function() {
       p.then(function() {}, function reject(e) {
         console.error('some problem happenned', e);
       });
     };
    </script>
  </body>
</html>

When the user is using the file dialog to select a file, I expect nothing at all to be printed on the console as the Error is caught and the promise's reject function is called. In contrast, I am expecting the error to appear on the console with the description "some error happened" only when I click the "submit" button.

Yet, this is not what I observe. As soon as the user selects a file with the dialog I see on the console:

Uncaught (in promise) Error: snafu(…)

When the user presses the "submit" button I do see the expected log line "some problem happened" but I don't understand why I also see the earlier "Uncaught (in promise)" log line when the user selects a file with the file dialog. I also don't see why the error is described as "Uncaught" given that I catch (unconditionally) all exceptions and simple invoke the reject function.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

It's not an uncaught exception, it's an uncaught rejection. Promises should not be left dangling in the rejected state with no error callback attached - that's why the console is warning you about this. You can also handle these cases in your application with the unhandledrejection event.

If you want to handle the error later (install the handler when the user clicks the button, which might be never!), you still will need to immediately install an empty callback (that explicitly ignores the error) to suppress the warning.

var p = Promise.resolve();
document.getElementById('file-dlg').addEventListener('change', function createPromise() {
  p = new Promise(function executor(resolve, reject) {
    throw new Error('snafu');
  });
  p.catch(e => {/* ignore for now */});
});
document.getElementById('submit').addEventListener('click', function addErrorHandler() {
  p.catch(function onReject(e) {
    console.error('some problem happened', e);
  });
});

Notice that you don't need that try/catch - the promise constructor will catch all exceptions from the executor by default already.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...