DevTools 코드 편집기에서 선택한 텍스트를 가져 오는 방법은 무엇입니까?

Question

DevTools의 코드 리더에서 선택된 텍스트를 가져 오려고합니다. onSelectionChanged 핸들러에서 selectionInfo를 얻을 수 있지만 텍스트를 가져 오는 방법을 모른다.

또한 onSelectionChanged가 실행되기 전에 selectionInfo (현재 선택)를 얻는 방법은 무엇입니까?

chrome.devtools.panels.sources.createSidebarPane(
    "title", 
    function(sidebar) { 
     function update(selectionInfo) { 
      //alert([selectionInfo.url, selectionInfo.startLine, selectionInfo.endLine, selectionInfo.startColumn, selectionInfo.endColumn]); 
      sidebar.setObject(JSON.parse(JSON.stringify(selectionInfo))); 
      // How to extract text using data from selectionInfo ??? 
     } 

     update(/*selectionInfo should be there*/); 
     chrome.devtools.panels.sources.onSelectionChanged.addListener(update); 
    } 
); 

Answer 1

chrome.devtools.panels.elements.onSelectionChanged.addListener의 콜백이 어떤 주장을지지 않습니다는 API documentation을은 cf. 즉 selectionInfo은 항상 정의되지 않습니다.

선택한 요소를 가져 오려면 $0 변수를 사용할 수 있습니다. 코드는 그러므로 다음과 같을 것이다 :

chrome.devtools.panels.elements.createSidebarPane(
    "title", 
    function(sidebar) { 
     function update() { 
      sidebar.setExpression("$0"); 
     } 

     update(); 
     chrome.devtools.panels.elements.onSelectionChanged.addListener(update); 
    } 
); 

참고 : 나는 chrome.devtools.panels.elements에 의해, 존재하지 않는, chrome.devtools.panels.sources을 교체했다.