Question

我正在尝试创建一个Chrome扩展程序，该扩展程序可以抓取您在页面中突出显示的文本，替换其中的一些字母，然后将其输出到弹出窗口中的text Field中。我的Main.js：

var letters = [
    'q','ض',
    'w','ص',
    'e','ث',
    'r','ق',
    't','ف',
    'y','غ',
    'u','ع',
    'i','ه',
    'o','خ',
    'p','ح',
    'a','ش',
    's','س',
    'd','ي',
    'f','ب',
    'g','ل',
    'h','ا',
    'j','ت',
    'k','ن',
    'l','م',
    'z','ئ',
    'x','ء',
    'c','ؤ',
    'v','ر',
    'b','لا',
    'n','ى',
    'm','ة',
    '[','ج',
    ']','د',
    ';','ك',
    ',','و',
    '.','ز',
    '/','ظ',
    "'",'ط',
    ' ',' ',
    '1','1',
    '2','2',
    '3','3',
    '4','4',
    '5','5',
    '6','6',
    '7','7',
    '8','8',
    '9','9',
    '0','0'
     ];//all the used charchters
var lastSelect = null;
var outBox = document.getElementById('copy_box');
outBox.value = null;
function con(english) {//convert from english to arabic
    var aoutput = new Array;
    var chars = english.split(''); 
    for(var i = 0; i < chars.length; i++){
        aoutput.push(letters[letters.indexOf(chars[i])+1]);
    }
    var ar = aoutput.join();
    var res = ar.replace(/,/g,'');
    return res;
}
let getText = new Promise(function(resolve, reject){
  chrome.tabs.executeScript({
      code: "window.getSelection().toString();"
  }, function(results){ 
    lastSelect = results;
  });
  if(lastSelect == undefined){
      reject("You Didn't Select Text!");
  }else{
      resolve(lastSelect);
  }
});

getText.then(function(Resolve){
  outBox.value = con(Resolve);
}).catch(function(reject){
  outBox.value = reject;
});

body{
 background-color:#f39c12;
 font-family:'Roboto Mono', monospace;
 font-size:13px;
 margin:20px;
 padding:0px;
    min-height: 300px;
    width: 300px;
}
h1{
  color:#2ecc71;
  text-shadow:
  	-1px -1px 0 #000,
		1px -1px 0 #000,
		-1px 1px 0 #000,
		1px 1px 0 #000;
}
#copy_box{
    outline:none;
 height:20px;
 width:290px;
 border:none;
 border-radius:10px;
padding: 10px;
}
#arabic
{
 outline:none;
 background-color:#e67e22;
 border:none;
 width:100px;
 height:30px;
 margin: 0px;
  padding:0px;
  }
 #english
{
 outline:none;
 background-color:#e67e22;
 border:none;
 width:100px;
 height:30px;
 margin:0px;
 padding:0px;
 }
hr {
    background-color: #d35400;
    color: #d35400;
    height: 2px;
}
#cpy-btn {
    padding-top: 10px;
    padding-bottom: 10px;
    outline: none;
    width: 100%;
    background-color: #f39c12;
    color: #d35400;
    border: solid #d35400 3px;
    font-size: 20px;
    letter-spacing: 3px;
    transition: all 0.5s ease;
    cursor: pointer;
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>English to Arabic Converter</title>
    <link href="https://fonts.googleapis.com/css?family=Roboto+Mono&display=swap" rel="stylesheet"><!--google Fonts cdn-->
    <link href="popup.css" rel="stylesheet" type="text/css"><!--my Css File-->
</head>
<body>
    <img src="Icon.png">
    <h1>key shifter</h1>
    <hr></hr>
    <p>selcet text press ctrl + shift + language letter to shift text to it</p>
    <input type ="text" id ='copy_box' placeholder="your converted text will apear here"><br><br />
    <button id="cpy-btn">Copy This!</button>
    <br />
    <hr></hr>
    <p>languages Supported :</p>
    <input type ="button" value = "Arabic" id = "arabic">
    <input type ="button" value = "English" id = "english">
    <script src ="main.js"></script><!--my Main Js Script-->
</body>
</html>

问题是：chrome.tabs.executeScript()是异步的，因此页面的响应是在执行outBox.value = con(lastSelect);（lastSelect是未定义的）之后出现的，所以我尝试使用Promise但始终被拒绝但chrome.tabs.executeScript()的返回值仍未定义，因此它的Rejected，

为什么chrome.tabs.executeScript()甚至在promise中也返回未定义的内容？

一些调试详细信息：当我进入chrome控制台并键入lastSelect并且执行返回是期望的时，因此我运行con(lastSelect);并且输出是期望的。

编辑：我认为如果脚本等待页面的响应返回就不会有问题，这将是毫秒级的问题

chrome扩展程序中无法返回异步函数的值

0 个答案: