Javascript promises not acting synchronously

I am attempting to use JavaScript promises so that the rest of my code waits for my asynchronous ‘chrome.storage.local.get’ call. However, it seems that the code is still acting asynchronously, and as a result sending undefined data out.

JavaScript code:

else if( request.message === "fetch-local-storage" ){//if popup request local data
        var responseData;

        let store = new Promise(function(resolve, reject){
            chrome.storage.local.get('localSearchList', function(query){
                responseData = query.localSearchList;
                console.log("asynch data: " + JSON.stringify(responseData));
            }); //fetch the local storage data 
            resolve('done');
        });

        store.then(function(res){ //do this only after above code runs
            console.log("The data being sent to popup (via content.js pipeline): " + JSON.stringify(responseData));
            sendResponse({message: "local-storage-data", data: JSON.stringify(responseData)});
        });

}

The console shows the following output:

The data being sent to popup (via content.js pipeline): undefined
asynch data: "[{"word":"mo","color":"rgb(128,0,128)","id":"0"}]"

If you look back at the code, this display shows that it is not working synchronously…

Is there a way to pause at beginning of every async stack trace in chrome developer tools

Is there a way to pause at beginning of every async stack trace in chrome developer tools automatically, rather than adding a manual debugger statement in async callbacks.

Please click link to see the descriptive screen shot for my query

How do I use Promise.all() with chrome.storage()?

I have several async functions running. I want to wait for them all to finish before taking the next steps. Here’s my code that I’m using to get all of the key/values from chrome.storage and the Promise.all() implementation.

var promise1 = Promise.resolve(3);
var promise2 = 42;
var promise3 = new Promise(function(resolve, reject) {
  setTimeout(resolve, 100, 'foo');
});

var getAll = chrome.storage.sync.get(function(result) {
  console.log(result)
});

Promise.all([promise1, promise2, promise3, getAll]).then(function(values) {
  console.log(values); // [3, 42, "foo", undefined]
});

This doesn’t work unfortunately. It returns undefined.

Most of the code above is taken from MDN here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

Why promise is undefined? chrome.tabs.query().then();

Isn’t it suppose to be defined in every built-in chrome function?

Uncaught TypeError: Cannot read property ‘then’ of undefined at popup.js:23

var requestCurrentTabId = {
  active:true,
  windowType:"normal",
  currentWindow: true
};

function getCurrentTab(chromeOpenedTabsList){
  window.currentTabId = chromeOpenedTabsList[0].id;

  //Connect to the content_script messaging port
  //on the current opened page, the extension user is visiting.
  var messagePassingPort = chrome.tabs.connect(currentTabId, {name: "content_script_port"});

  //Inject selection listener into Chrome PDF viewer
  //after opening this popup.


  console.log("Current tab:" + window.currentTabId);
}
//getCurrentTab - is a callback


chrome.tabs.query(requestCurrentTabId, getCurrentTab).then(console.log("Current tab2:" + window.currentTabId));

Use the Chrome Windows API to close windows in a set order from an extension

In my Chrome extension, I am using a background page to close all the current windows and open a new one. However, I need to close a specific window (one that is created by the extension earlier) last, so that it will be reopened first if Ctrl+Shift+T is pressed. I have tried using promises to close it after closing the others, but when I press Ctrl+Shift+T, an older window always gets reopened first. The code I am using is:

//closeLast is the id of the window that needs to be closed last

//promise version of chrome.windows.remove
function removeWindow(windowId){
    return new Promise(function(resolve, reject){
        chrome.windows.remove(windowId, resolve);
    });
}

//closes all windows but one
function closeOthers(newWindow){
    chrome.windows.getAll(function(windows){
        let promises = [];

        windows.forEach(function(thisWindow){
            if(thisWindow.id != newWindow.id && thisWindow.id != closeLast){
                promises.push(removeWindow(thisWindow.id));
            }
        });
        Promise.all(promises).then(function(){
            chrome.windows.remove(closeLast);
        });
    });
}

//creates a new window, and closes all the others
function closeAll(){
    chrome.windows.create({state: "maximized"}, closeOthers);
}

If I remove the chrome.windows.remove(closeLast); line, the specific window stays open as expected, and after closing it manually, it is reopened first after pressing Ctrl+Shift+T. Is there any way to achieve the same behaviour from the background script?

why chrome-dev-tools can’t reflect ‘this’ correctly in a promise?

I use webpack to compile my project, and then I found this will be compiled to _this2 if there is a promise.

And the problem is that when I take a breakpoint in the promise, this will always be undefined in chrome-dev-tools.

Is it a bug? Is it difficult for Chromium develop team to resolve this?

Now, the source code:

enter image description here

the compiled code by webpack:

enter image description here

because there is a source-map, chrome will display the source code for me, and this outside the promise will be correctly inspected.

enter image description here

but, this inside the promise will be undefined

enter image description here