Listen for ‘paid for full version’ event in Chrome Extension

I have an Chrome Extension uploaded in Chrome Store, it has free trial and paid modes (only One Time payment is available for paid modes)

I need to be able to recognize when user switches between these modes from extension’s background script, so I can enabledisable premium functionality.

Official docs don’t contain anything regarding this.

I tried adding chrome.runtime.onInstalled event listener, but it doesn’t get triggered when user switches to paid mode…

I’m able to get current license version by hitting
but I don’t think it’s a best way to hit it each few seconds to check for license change, there must be a better way…

Google Chrome device frame is not visible when turned on

I know my question is out of topic, but I will ask anyway. Because I need an answer, I also asked this on Quora.

From this site it shows how to enable the frame.

I want to take a screen shot / even full screen shot of my web app for showcase / use it for reporting. I used Chrome for this.

In the developer’s tool there is this option to hide and show the Device Frame. Yet I didn’t see it.


As you can see, there is an overflow menu from the right – hide device frame. I already enabled it.

I take a sample screen shot from Angular Material page. As you can see there is no device frame wrapping the web app. Yet I enable the device frame. 🙁


I thought it will be visible the device frame once the screen shot is done. But what I see is what I get.

Is this a bug? Is there any extension that can perform this operation?

captureVisibleTab in chrome extension returns a double sized image

I’m developing a screenshot taking google chrome extension. But my problem is, that the screenshot don’t have the original size, it is much bigger. If the size of my web document has 1272×594 pixel, the screenshot will be 2544×1188 pixel.

The minimal working example takes a screenshot of the current tab, after clicking on “Test Plugin” in context menu and displays the screenshot in the current tab as an overlay.

My minimal working example:


  "name": "Minimal working Example",
  "version": "1.0",
  "description": "",
  "permissions": ["contextMenus", "tabs", "activeTab"],
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  "manifest_version": 2


chrome.runtime.onInstalled.addListener(function() {
        id: 'minimalExampe',
        title: 'Test Plugin',
        contexts: ['all']

chrome.contextMenus.onClicked.addListener(function(itemData) {
    if (itemData.menuItemId == "minimalExampe") {
        // checks, if content.js is already injected, otherwise content.js is added
        chrome.tabs.query({active: true, currentWindow: true}, function (tabs) {
            chrome.tabs.sendMessage(tabs[0].id, {func: 'alreadyInjected'}, function (response) {
                if (response === undefined) {
                        file: 'content.js'
                    console.log('Script added');
                } else {
                    console.log('Script was already injected');
                //does the screenshot
                chrome.tabs.captureVisibleTab(null, {format: 'png'}, function (screen) {
                    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
                        chrome.tabs.sendMessage(tabs[0].id, {func: 'showPicture', picture: screen});




    function(request, sender, sendResponse) {
        switch(request.func) {
            case 'showPicture':
            case 'alreadyInjected':
                sendResponse({alreadyInjected: true});

function showPicture(picture) {
    var img = new Image();
    img.src = picture; = '1000'; = 'absolute'; = '0'; = '0';
    img.onload = function () {

Does anybody know why? Every help is welcome.


Unmarked cached assests in the Chrome Dev tool

I have web page where a few cached assets are marked as cached (i.e here is from disk cache)

cached assests marked as cached

but seeing blow screen shot , dozens of other cached assests(e.g react ,jQuery) are neither marked as 304 status code nor the cached from disk/from memory cache,etc.

As to their actual size ,they are undoubtedly from cache , how come these cached files are not marked cached?

cached assests marked as cached

Getting the correct Google client ID for Chrome users with multiple accounts

I’m trying to get the Google Client Id (found under of a user corresponding to the account he’s currently connected with.

Explanation: when connecting with your gmail account on Chrome, the result of the code given here ( gives the user’s client ID that I need to use the Google Payment API.
The problem is if the user has multiple accounts connected on Chrome.

Example: Our user has an email account for work (WEmail) and a personal email account (PEmail). He first connects to chrome using his WEmail. Then adds his PEmail to the list of Chrome connected accounts. Then our user wishes to make a payment on an extension he has installed, with his PEmail.

The issue here is that to process such a payment you need the google client ID of that user, and when you fetch it, you will get the one of the first connected account (WEmail) and not the one of the current used account (PEmail). Which makes it impossible to process the payment since you might not be serving the right account.

Is there any way to get all the currently used ids of a user or jsut the currently used id?
If not, are there plans to integrate such a solution in the short term?

Thanks for your help.

How can I make HTTP request wait before continuing

I’m developing an extension for Google Chrome and I’m monitoring HTTP requests. In the event handler for chrome.webRequest.onHeadersReceived I’m trying to make a delay. It cannot wait asynchronously (unlike WebExtensions in Firefox) and it doesn’t support something like Thread.Sleep or CriticalSection or ResetEvent or anything. The only solution that I see is spin waiting which is a very bad choice. Even synchronous XMLHTTPRequest is deprecated and doesn’t work.

var headersReceived = function (e) {
    /// ?????? some method to delay synchronously
    return {cancel: false};

                                                {urls: ["*://*/*"]},
                                                ["blocking", "responseHeaders"]);

How to make http request wait asynchronously in Chrome extensions

I’m trying to monitor and modify http headers with a delay in Chrome extensions.
If I write the code to run synchronous it works as expected with a spin loop; however I want to handle this asynchronously. Here’s my code:

var headersReceived = function (e) {
  return new Promise((resolve, reject) => {
    window.setTimeout(() => {
        resolve({responseHeaders: e.responseHeaders});
    }, 5000);

                                                {urls: ["*://*/*"]},
                                                ["blocking", "responseHeaders"]);

Chrome runs the promise callback as expected but doesn’t wait for resolve. It just returns back immidiately and doesn’t wait for the extension to respond. Is there any way to achieve this?

“Error: Invocation of form set() doesn’t match definition set(object items, optional function callback)”

i have a gmail extension which uses , methods in content script.
it works well for extension, but when extension off and the on or extension not uses for a long time and then uses , it shows an error like

“Error: Invocation of form set() doesn’t match definition set(object items, optional function callback)”

when the page reloads it again works well. I need a solution to work this without page reload

Edit: i added the below code in background.js asper @wOxxOm, but it still shows the same error

var manifest =;{populate:true},function(windows){
        var url = tab.url; 
        if(url.indexOf('') > -1){ 
             var  scripts= manifest.content_scripts[0].js;  
             s = scripts.length;  
            for(var k = 0 ; k < s; k++ ) {  
              chrome.tabs.executeScript(, {
                file: scripts[k]


also the listner in content script

    function doListen(request){
        if ( && request.types && request.types =='MESSAGE_COMPOSE') {
            window.postMessage({ type: "MESSAGE_COMPOSE",}, "*");

How does Google Chrome/Chromium Assigns loaderId to requests(as mentioned in google dev tools protocol)?

what id loaderId and how it is assigned as mentioned in following url?

see Page.navigate in , it return loaderId.

is it unique for each navigation request?

Which is the category for get the FPS (frame per second) using chrome-remote-interface

I am using the javascript module chrome-remote-interface, which implement a WebSocket client of chrome devtools protocol, to generating timeline with some categories: gpu, memory use and FPS (frame per second), but when executing a tracing navigation with the categories below I can get no frame category of timeline.

const categories = [

    transferMode: 'ReturnAsStream',
    options: 'sampling-frequency=10000',
    categories: categories.join(',')

Tracing.tracingComplete((traceCompleteEvent) => {
    writeTimelineFrom(, 'timeline.json');

I use:

  • ubuntu 18.04
  • google-chrome 67
  • node 8
  • chrome-remote-interface 0.25.6