akash-potdar7

import React from 'react';
import { getBrowserType } from './browserUtil';
import ChromeContent from './ChromeContent';
import FirefoxContent from './FirefoxContent';

class RenderBrowserContent extends React.Component {

  render() {
    const renderByBrowserName = () => {
      const browser = getBrowserType();

akash-potdar7

import React from 'react';
import { isChrome, isFirefox } from './browserUtil';
import ChromeContent from './ChromeContent';
import FirefoxContent from './FirefoxContent';

class RenderBrowserContent extends React.Component {
  // ..

  render() {
    const renderBrowserType = () => {

akash-potdar7

window.addEventListener('DOMContentLoaded', () => {
   const bg = chrome.extension.getBackgroundPage();
   chrome.tabs.query({active: true, currentWindow: true}, (tabs) => {
       const currentTabId = tabs[0].id;
       const currentPerf = bg.perf[currentTabId];
       console.table('Page perforamance metrics : ', currentPerf)
   })
});

akash-potdar7

/** background-script.js */
 
window.perf = {};
 
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
   window.perf[sender.tab.id] = message.essential || {};
})

akash-potdar7

...
 
setInterval(() => {
   const essential = parsePerformanceData();
   window.postMessage({type: "FROM_MY_PAGE", essential})
})
 
...

akash-potdar7

/** custom-script.js */
 
function parsePerformanceData () {
   let meta = {};
   meta.performance = JSON.parse(JSON.stringify(window.performance)) || {};
   return meta;
}

akash-potdar7

...
 
window.addEventListener('message', () => {
   ...
 
   if (event.data.type && event.data.type === 'FROM_MY_PAGE') {
       chrome.runtime.sendMessage({ essential: event.data.essential});
   }
 
}, false);

akash-potdar7

/* Content Script */
function injectScript(filePath, tag) {   
   const node = document.getElementsByTagName(tag)[0];
   const script = document.createElement('script');
   script.setAttribute('type', 'text/javascript');
   script.setAttribute('src', filePath);
   node.appendChild(script);
}

injectScript(chrome.extension.getURL('inject-script.js', 'body'));

akash-potdar7

// The recipient code
recipient.onmessage = function (event) {
   console.log('received message: ' + event.data);
};

// The sender code
recipient.postMessage('hi there'); 
// or 
recipient.send('hi there');

akash-potdar7

(function () {
	console.log('Self invoking function');
  (function(){console.log('inner')}());
}());