Launch Chrome app using extension - google-chrome

I have a standalone frame-less Chrome app. I'm sending messages from another Chrome extension to it (Chrome app) which works. But I would like to be able (if it's possible) to launch the app using the extension. Because now I have to launch the app manually.
I've seen Google music "mini player" that you can launch from music.google.com. So I'm wondering if the same can be done using chrome extension.
I wouldn't need the Chrome extension if the Chrome app could read opened tabs or just URLs but since this is not possible one must use extension and message to app to achieve this.

just send msg to your app from extension when you want to open it (In my case, I'm opening app when injected element on page is clicked)
extension script:
var appID = "qwertzuiopasdghghjkhgjghj";
element.onclick = function () {
chrome.runtime.sendMessage(appID, {message: 'fireup'}, function(response){});
});
app background script:
chrome.runtime.onMessageExternal.addListener(function(request, sender, sendResponse) {
if (request.message == 'fireup') {
chrome.app.window.create("page.html",
{
//whatever
});
}
});

You can use chrome.management.launchApp method: https://developer.chrome.com/extensions/management#method-launchApp
To use it you need to add "management" permission to your extension manifest file

Related

Open PWA-framed window from Chrome from Chrome extension

I have a PWA that is able to open secondary windows, when I open them using window.open the new windows have the same window style of the main PWA (no Chrome UI, no tabs, no address bar, status bar of the color defined by my app), the new window will also be grouped under the PWA icon in the operative system Dock/taskbar.
The look of the windows is just like the image below:
I also have a Chrome extension that must be able to open such windows, but the problem I'm having is that if I use chrome.windows.create with popup type the resulting windows have the normal Chrome status bar color, and they aren't listed under the PWA icon. Like this:
I'd like to understand if there's any way to open a window from a Chrome extension and have it follow the PWA-defined theme and get listed under the PWA dock/taskbar icon?
To launch an installed PWA use chrome.management API in an extension page or background script:
chrome.management.getAll(apps => {
const pwa = apps.find(a => a.appLaunchUrl === 'https://pwa.foo.bar/');
if (pwa) chrome.management.launchApp(pwa.id);
});
If you want to set the launch type:
chrome.management.getAll(apps => {
for (const a of apps) {
if (a.appLaunchUrl === 'https://pwa.foo.bar/') {
chrome.management.setLaunchType(a.id, 'OPEN_AS_WINDOW', () => {
chrome.management.launchApp(a.id);
});
break;
}
}
});
manifest.json:
{
"permissions": ["management"],

How to open website in webview as user signed in chrome?

I'm going to open google hangouts site in webview of my chrome packaged app as user signed in chrome.
I can get auth token that way:
chrome.identity.getAuthToken({ 'interactive': true }, function(token) {
console.log(token);
});
but in webview I can see sign in page instead of hangouts site. It seems that webview doesn't have access to auth token.
Here is code displaying webview:
<webview id="id1" partition="persist:googlepluswidgets" src="http://g.co/hangout" style="width:100%;height:100%;"></webview>
Any ideas to share auth token with webview and open site directly, without log in?
Is it at all possible to do it using auth token? If not, is there another method to authorize user while opening that site in webview?

Debugging Chrome extension default_popup using dev tools

I'm trying to do some simple debugging on a Chrome extension. When I try to catch an event ID and show it in an alert, Chrome immediately closes the alert and the default popup window making it impossible to tell what was in the alert. For instance:
$("a[data-toggle='pill']").on('shown.bs.tab', function (e) {
alert(e.target.id);
});
To instead log this to the console, I could do:
$("a[data-toggle='pill']").on('shown.bs.tab', function (e) {
console.log(e.target.id);
});
However, if I inadvertently close the popup or have to reload the extension, then the console window I opened using "inspect popup" on the popup will also be closed. This makes for a very tedious debug process.
What is a better approach to debugging and test Chrome extensions for the default_popup?
You can debug your chrome extensions like this
go to this link
chrome://inspect/#extensions
you can see your installed extensions and you can inspect them
:)
grab the link to the extension and change url to popup window url
in my ex: I changed background.html --> popup.html

Chrome app in window

I want to create chrome web app that will open in own window like Google Keep extension for chrome.
I made chrome web store package, but how to open it in self window instead of chrome browser ??
Create a packaged app by
Using a manifest with { 'app': { 'background': '...' } ....
Add a chrome.app.runtime.onLaunched listener that calls chrome.app.window.create
See the hello-world sample.

Multi-Window Chrome Packaged App?

Hello I'm new to chrome packaged apps.
How would I create a button image, that when clicked launches
a new chrome packaged app window displaying a local html page.
In your first html page, just add the button. Also, that page will need to reference a Javascript file to add the event handlers:
<button id="thebutton">Open a New Window</button>
<script src="script.js"></script>
Then you add an event handler to the button in script.js (or whatever you name your script page):
document.querySelector('#thebutton').addEventListener('click', function() {
chrome.app.window.create('new.html', {"width":300, "height": 200});
});
If you need for that window to be sandboxed (e.g., not use the default content security policy), you need to specify that the page is sandboxed in manifest.json:
"sandbox": {
"pages": ["new.html"]
}
When new.html is loaded, it will be loaded in its own origin which doesn't have access to the opening window or to the advanced API's. If you need the sandboxed page to do something with the advanced API's, you can use postMessage and receive messages to communicate with a window that's still in the CSP.