Send input text from contentScipt to popup html Chrome Extension built using angular

Question

I built a Chrome extension using angular. But I encourted an issue in regard to send data from contentscript to popup. any tips for sending data from input tag to display in popup? Thanks

Answer 1

Follow these steps:

1. First, send the message from contentScript file

   var type = e.detail.type; // a "key" for your data
   var data = e.detail.data;
   
   chrome.runtime.sendMessage({type: type, data: data});
   

2. Now you can get message in your Angular app

   /// <reference types="chrome"/>
   
   if (chrome.runtime) {
       chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
           const type = message.type;
           const data = message.data;
   
           return new Promise((resolve, reject) => {
               // Write your codes
           });
       });
   }
   

   Be sure to add the following code to the top of your TS or JS file

   <reference types="chrome"/>
   

Note: If chrome.runtime has as error, then you can install this npm package to fix it

npm install @types/chrome --save-dev