How to return value from executed script with chrome.devtools.inspectedWindow.eval

Question

I'm trying to execute some script inside webpage from devtool panel using chrome.devtools.inspectedWindow.eval, the code is working fine but can't figure out how to return response to callback. I am grateful for your support.

Executed script

const someScript = function () {
    alert("from panel")
    return 123
    // i can't return
}

Devtool

Chrome.devtools.inspectedWindow.eval(
//this regex convert function body to string
    someScript.toString().replace(/^function\s*\S+\s*\([^)]*\)\s*\{|\}$/g, ""),
       function (result, isException) {
           if (isException) {
               //exception always fire
               console.log("Result not received");
           } else {
               console.log("Selected element: " + result);
       }
});

Answer 1

The last evaluated expression of the script is returned to the callback.

Assuming the function returns a value (your function does), all you need is to add some parentheses to call the function as an IIFE, no need to extract the function's body.

const someFunc = function () {
  return 123;
};

chrome.devtools.inspectedWindow.eval(`(${someFunc})()`, (res, err) => {
  if (err) {
    console.warn('Error', err);
  } else {
    console.log('Result', res);
  }
});

Notes:

• Only JSON-compatible types are supported (string, number, boolean, null, and arrays/objects that consist of these types).
• Your devtools panel has its own console, which you can open by right-clicking inside your panel to show the context menu and choosing "Inspect" there.
• Use a comma , insead of + in console.log because the latter doesn't work with arrays/objects.