Chrome Webstore inline installation with AngularJS

Question

I'm a newbie with AngularJS and trying to install a Chrome extension following the Webstore inline installation guide

In my .html file

<button data-ng-click="chromeExtensionInstall()" id="install-button">Add to Chrome</button>

In my .js file

function successCallback () {
    window.alert('success');
}

function failureCallback () {
    window.alert('failure');
}

$scope.chromeExtensionInstall = function() {
    if (!chrome.app.isInstalled) {
        chrome.webstore.install('https://chrome.google.com/webstore/detail/...',
            successCallback(), failureCallback());
    }
};

Both alerts are displayed and then getting this Uncaught Exception: "Chrome Web Store installations can only be initiated by a user gesture"

Any idea?

Answer 1

chrome.webstore.install function accept 2 callback parameters, which means 2 pointers to function. You should not call those functions yourself, but just pass in their names, like this:

chrome.webstore.install('https://chrome.google.com/webstore/detail/...',
        successCallback, failureCallback);

Instead of this:

chrome.webstore.install('https://chrome.google.com/webstore/detail/...',
        successCallback(), failureCallback());

Do you see the difference ? If you don't, have a look on this page which explains it well (and there's also this on 7 common JavaScript mistakes)

Answer 2

Inline installation is composed of two parts:

1. A declarative tag (like <link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/itemID">) and

2. A call to the JavaScript function chrome.webstore.install(). In addition, you must also verify an association between the site that triggers inline installation and the relevant item(s) in the Chrome Web Store.

I think you are doing only the 2nd part. This link is helpful.

http://noelarlante.com/setup-chrome-extension-for-inline-installation/