JavaScript showing wrong result for logical Operation

Question

I have a chrome extension. Its code has a method getSelectionFromPage() which catches the text selected on the webpage and always returns true like below:

function getSelectionFromPage() {
  window.selected = true;
  chrome.tabs.executeScript({
  code: "window.getSelection().toString();"
 }, function(selection) {
  if (selection[0] != '') {
    window.selected = true;
  }else{
    window.selected = false;
  }
 });
 return true
}

On the same window context, I ran the following commands on the console.
The result can be seen as follows:

I am writing the same commands here also:

getSelectionFromPage() //-> true
window.selected //-> false
(getSelectionFromPage() && window.selected) //-> true

The (getSelectionFromPage() && window.selected) should be false. I have tried checking typeof(window.selected) and typeof(getSelectionFromPage()) and both are returning boolean. I don't understand why it is happening.

True false are part of Boolean data type, I don't see anything wrong with it... Also you used and (&&) operator which `true && false -> false`, aren't you mistaking or (||) operator? `true || false -> true` — Hassan Faghihi, Jun 24 '19 at 04:19
`true && false` should be `false` not `true`. but && operation showing true. That is my concern too.. — TechCreative, Jun 24 '19 at 04:21
You set windows . Selected=true;, you could check window.selected first ... Java script is not multi-thread or something, when it run a block of code it do it till the end , and and other code which may reset those state won't interfere — Hassan Faghihi, Jun 24 '19 at 04:24
The body of the anonymous function could be written much more concisely as an arrow function: `selection => window.selected == selection[0] != ''`, though you might want `!==` in this case. ;-) — RobG, Jun 24 '19 at 04:45

Goblinlord · Accepted Answer · 2019-06-24T04:40:43.107

The function which is setting to false is a callback. This will not execute until after the current execution context is complete. Therefore, it will not be set to false until after && window.selection completes execution.

executeScript docs: https://developer.chrome.com/extensions/tabs#method-executeScript

The order of things is:

(function () {
  window.selected = true; // Runs
  chrome.tabs.executeScript({code: "window.getSelection().toString();"}, function(){
    window.selected = false;
  }); // Calls browser API and  set's callback (the anonymous function there) to call later)
  // NOTE: the callback function which was set here was NOT executed yet it was only defined.
  return true;
})() // true
&& window.selected // this is currently true
// Later, now callback executes

If you would like to wait, you could use a Promise instead.

  function getSelectionFromPage() {
    return new Promise(function (resolve) {
      chrome.tabs.executeScript(
        {code: "window.getSelection().toString();"},
        // or just put resolve here instead of defining a function to get value directly
        function(v){
          resolve(!!v);
        }
      );
    });
  }

  getSelectionFromPage().then(haveSelection => console.log(haveSelection);

Thanks for explaining. I understood that i messed it with asynchronous call. — TechCreative, Jun 24 '19 at 04:36

JavaScript showing wrong result for logical Operation

1 Answers1