Chrome extension inject javascript and angular on browser action is clicked

Viewed 1353

I have an extension where I inject just javascript into any page, but when I inject it my angular module and all the controllers does not work. Should I inject them too or do something else?

injection.js

chrome.browserAction.onClicked.addListener(function (tab) {
    chrome.tabs.executeScript(tab.id, {
        file: 'src/injection.js'
    }, function () {
        console.log("Script injected!");
    });
});

app.js

angular.module('app', ['ngRoute', 'ui.router'])
    .run(function ($rootScope) {
        $rootScope.message = "Hello Angular again!";
        $rootScope.successMsg = "Hello Angular again! SUCCESS!";
});

injection.js

'use strict';
var cheapWatcherDiv = document.createElement('div');
cheapWatcherDiv.setAttribute('class', 'cheap-watcher');
document.body.appendChild(cheapWatcherDiv);
var logged = false;
if (logged == false) {
    $(".cheap-watcher").load(chrome.extension.getURL('views/main.html'));
    $('head').append('<link rel="stylesheet" href="' + chrome.extension.getURL('sass/main.css') + '" type="text/css" />');
} else {
    $(".cheap-watcher").load(chrome.extension.getURL('views/logoutTemplate.html'));
}

manifest

...
"content_scripts": [
{
  "run_at": "document_end",
  "matches": [
    "http://*/*",
    "https://*/*"
  ],
  "js": [
    "lib/jquery/dist/jquery.min.js",
    "lib/angular/angular.js",
    "lib/angular-route/angular-route.min.js",
    "lib/ui-router/release/angular-ui-router.min.js",
    "lib/angular-sanitize/angular-sanitize.min.js",

    "src/app.js",
    "src/LoginController.js",
    "src/LogoutController.js",
    "src/MainController.js"
     ]
   }
 ]
1 Answers
Related