如何使用 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.